-
Notifications
You must be signed in to change notification settings - Fork 1
/
elements-link-stories.f0b85a4d.iframe.bundle.js
2 lines (2 loc) · 10.6 KB
/
elements-link-stories.f0b85a4d.iframe.bundle.js
1
2
/*! For license information please see elements-link-stories.f0b85a4d.iframe.bundle.js.LICENSE.txt */
(globalThis.webpackChunk_yoast_ui_library=globalThis.webpackChunk_yoast_ui_library||[]).push([[417],{"../../node_modules/@storybook/addon-docs/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{H2:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.H2,Hl:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.Hl,Pd:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.Pd,Tn:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.Tn,VY:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.VY,W8:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.W8,fy:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.fy,gG:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.gG,hE:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.hE,oz:()=>_storybook_blocks__WEBPACK_IMPORTED_MODULE_1__.oz});__webpack_require__("../../node_modules/@storybook/addon-docs/dist/chunk-HLWAVYOI.mjs");var _storybook_blocks__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../../node_modules/@storybook/blocks/dist/index.mjs")},"./.storybook/interactive-docs-page.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{f:()=>InteractiveDocsPage});var _storybook_addon_docs__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/@storybook/addon-docs/dist/index.mjs"),prop_types__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/prop-types/index.js"),prop_types__WEBPACK_IMPORTED_MODULE_3___default=__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_3__),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__=(__webpack_require__("../../node_modules/react/index.js"),__webpack_require__("../../node_modules/react/jsx-runtime.js"));const InteractiveDocsPage=({stories})=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_0__.hE,{}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_0__.Pd,{}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_0__.VY,{of:"meta"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_0__.VY,{of:"story"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_0__.Tn,{}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_0__.H2,{}),stories.map(((story,index)=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_0__.fy,{of:story},(null==story?void 0:story.name)||`story-${index}`)))]});InteractiveDocsPage.propTypes={stories:prop_types__WEBPACK_IMPORTED_MODULE_3___default().arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_3___default().oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_3___default().object,prop_types__WEBPACK_IMPORTED_MODULE_3___default().func]))},InteractiveDocsPage.defaultProps={stories:[]},InteractiveDocsPage.__docgenInfo={description:"An alternative version of the Storybook DocsPage component.\n\nReplacing the Stories component with individual DocsStory components.\nThis prevents Stories from passing `__forceInitialArgs` to the DocsStory components.\nWhich makes the stories are interactive on the docs page, making the `args` more like initial values.\n\n@param {(Object|function)[]} [stories] The stories to display.\n@returns {JSX.Element} The DocsPage component without stories.",methods:[],displayName:"InteractiveDocsPage",props:{stories:{defaultValue:{value:"[]",computed:!1},description:"",type:{name:"arrayOf",value:{name:"union",value:[{name:"object"},{name:"func"}]}},required:!1}}}},"./src/elements/link/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var classnames__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/classnames/index.js"),classnames__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_0__),prop_types__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/prop-types/index.js"),prop_types__WEBPACK_IMPORTED_MODULE_3___default=__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_3__),react__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../../node_modules/react/index.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("../../node_modules/react/jsx-runtime.js");const classNameMap={variant:{default:"yst-link--default",primary:"yst-link--primary",error:"yst-link--error"}},Link=(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)((({as:Component,variant,className,children,...props},ref)=>(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(Component,{ref,className:classnames__WEBPACK_IMPORTED_MODULE_0___default()("yst-link",classNameMap.variant[variant],className),...props,children})));Link.displayName="Link",Link.propTypes={children:prop_types__WEBPACK_IMPORTED_MODULE_3___default().node.isRequired,variant:prop_types__WEBPACK_IMPORTED_MODULE_3___default().oneOf(Object.keys(classNameMap.variant)),as:prop_types__WEBPACK_IMPORTED_MODULE_3___default().elementType,className:prop_types__WEBPACK_IMPORTED_MODULE_3___default().string},Link.defaultProps={as:"a",variant:"default",className:""};const __WEBPACK_DEFAULT_EXPORT__=Link;Link.__docgenInfo={description:"@param {JSX.Element} [Component] The component to render as.\n@param {string} [variant] The variant of the link.\n@param {string} [className] The HTML classes.\n@param {JSX.node} children The content of the link.\n@param {Object} [props] The props.\n@returns {JSX.Element} The link.",methods:[],displayName:"Link",props:{as:{defaultValue:{value:'"a"',computed:!1},description:"",type:{name:"elementType"},required:!1},variant:{defaultValue:{value:'"default"',computed:!1},description:"",type:{name:"enum",value:[{value:'"default"',computed:!1},{value:'"primary"',computed:!1},{value:'"error"',computed:!1}]},required:!1},className:{defaultValue:{value:'""',computed:!1},description:"",type:{name:"string"},required:!1},children:{description:"",type:{name:"node"},required:!0}}}},"./src/elements/link/stories.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Anchor:()=>Anchor,Button:()=>Button,CustomComponent:()=>CustomComponent,Factory:()=>Factory,default:()=>stories});__webpack_require__("../../node_modules/react/index.js");var elements_link=__webpack_require__("./src/elements/link/index.js"),interactive_docs_page=__webpack_require__("./.storybook/interactive-docs-page.js");var jsx_runtime=__webpack_require__("../../node_modules/react/jsx-runtime.js");const Factory={render:({children,...args})=>("a"!==args.as&&void 0!==args.as||(args.href="#!"),(0,jsx_runtime.jsx)(elements_link.A,{...args,children})),parameters:{controls:{disable:!1}},args:{children:"Link factory"}},Anchor={parameters:{controls:{disable:!1},docs:{description:{story:"Pass the `href`, `target` and `rel` props to get the attributes.<br>When using target `_blank`, please add a visually hidden text inside the link to notify screen reader users to the fact that the link opens in a new tab.\n"}}},args:{children:(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)("span",{className:"yst-sr-only",children:"(Opens in a new browser tab)"}),"yoast.com"]}),href:"https://yoast.com",target:"_blank",rel:"noopener noreferrer"}},Button={parameters:{controls:{disable:!1},docs:{description:{story:"When specifying `button`, pass the `onClick` prop to have a functional button.\n"},source:{transform:()=>'const handleClick = () => alert( "You clicked the button!" )\n\n<Link\n as="button"\n onClick={ handleClick }\n>\n Button\n</Link>'}}},args:{as:"button",children:"Button",onClick:()=>alert("You clicked the button!")}},CustomComponent={name:"Custom component",parameters:{docs:{description:{story:"When using a custom component, that component will only look like a link by default. Please make sure the component behaves like a link.\n"},source:{transform:()=>"const Component = ( { className, children } ) => <span className={ className }>Custom { children }</span>\n\n<Link as={ Component }>\n component\n</Link>"}}},args:{as:({className,children})=>(0,jsx_runtime.jsxs)("span",{className,children:["Custom ",children]}),children:"component"}},stories={title:"1) Elements/Link",component:elements_link.A,argTypes:{children:{control:"text"},as:{options:["a","button"]},className:{control:"text"}},parameters:{docs:{description:{component:"Links are clickable elements within a user interface that typically appear as underlined text or a different color from surrounding text. Text links are used to navigate users to another page or section, playing a crucial role in enhancing user experience and providing clear and intuitive navigation.\n\nThe implementation of required properties is your responsibility. I.e. an anchor tag needs `href`, but a button needs an `onClick`. This component does not know about either one."},page:()=>(0,jsx_runtime.jsx)(interactive_docs_page.f,{stories:[Anchor,Button,CustomComponent]})}}}},"../../node_modules/memoizerific sync recursive":module=>{function webpackEmptyContext(req){var e=new Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}webpackEmptyContext.keys=()=>[],webpackEmptyContext.resolve=webpackEmptyContext,webpackEmptyContext.id="../../node_modules/memoizerific sync recursive",module.exports=webpackEmptyContext},"./node_modules/classnames/index.js":(module,exports)=>{var __WEBPACK_AMD_DEFINE_RESULT__;!function(){"use strict";var hasOwn={}.hasOwnProperty;function classNames(){for(var classes=[],i=0;i<arguments.length;i++){var arg=arguments[i];if(arg){var argType=typeof arg;if("string"===argType||"number"===argType)classes.push(arg);else if(Array.isArray(arg)){if(arg.length){var inner=classNames.apply(null,arg);inner&&classes.push(inner)}}else if("object"===argType){if(arg.toString!==Object.prototype.toString&&!arg.toString.toString().includes("[native code]")){classes.push(arg.toString());continue}for(var key in arg)hasOwn.call(arg,key)&&arg[key]&&classes.push(key)}}}return classes.join(" ")}module.exports?(classNames.default=classNames,module.exports=classNames):void 0===(__WEBPACK_AMD_DEFINE_RESULT__=function(){return classNames}.apply(exports,[]))||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)}()}}]);