@madie/madie-design-system 1.2.97 → 1.2.98

package/storybook-static/Tabs-Tabs-stories.0689a934.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs-Tabs-stories.d1758be4.iframe.bundle.js","mappings":"AAIA","sources":["webpack://@madie/madie-design-system/./components/Tabs/Tab.js","webpack://@madie/madie-design-system/./components/Tabs/index.js","webpack://@madie/madie-design-system/./components/Tabs/Tabs.stories.js","webpack://@madie/madie-design-system/./components/Tabs/tabs.scss","webpack://@madie/madie-design-system/./components/Tabs/tabs.scss?f72e"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport { Tab as MuiTab } from \"@mui/material\";\n\nconst typeA = {\n    color: \"#fff\",\n    borderRadius: \"4px 4px 0px 0px !important\",\n    backgroundColor: \"#003366\",\n    \"&:hover\": {\n        background: \"#001F3D\",\n    },\n    \"&:focus\": {\n        background: \"#125496\",\n        boxShadow: \"0px 0px 0px 4px #CBE4FF\",\n    },\n};\nconst typeB = {\n    color: \"#515151\",\n    \"&:hover\": {\n        background: \"#F2F9FF\",\n        color: \"#242424\",\n    },\n    \"&:focus\": {\n        boxShadow: \"0px 0px 0px 4px #CBE4FF\",\n        background: \"#fff\",\n    },\n};\nconst typeC = {\n    color: \"#333\",\n    background: \"#EDEDED\",\n    \"&:hover\": {\n        background: \"#FAFAFA\",\n        color: \"#515151\",\n    },\n    \"&:focus\": {\n        boxShadow: \"0px 0px 0px 4px #CBE4FF\",\n        background: \"#fff\",\n    },\n};\n\nconst Tab = ({ type, orientation, size, ...rest }) => {\n    const baseStyle = {\n        height: size === \"standard\" ? \"48px\" : \"60px\",\n        fontFamily: \"Rubik, sans serif\",\n        fontWeight: 400,\n        padding: size === \"standard\" ? \"14.5px 24px\" : \"20.5px 24px\",\n        textTransform: \"none\",\n        fontSize: \"16px\",\n        alignItems: orientation === \"vertical\" && \"flex-start\",\n        \"&.Mui-disabled\": {\n            background: \"#DDDDDD\",\n            color: \"#717171 !important\",\n        },\n    };\n    const style = ((type) => {\n        if (type === \"A\") {\n            return { ...baseStyle, ...typeA };\n        }\n        if (type === \"B\" || type === \"D\") {\n            return { ...baseStyle, ...typeB };\n        }\n        if (type === \"C\") {\n            return { ...baseStyle, ...typeC };\n        }\n    })(type);\n    return <MuiTab tabIndex={0} sx={style} {...rest} />;\n};\n\nTab.propTypes = {\n    orientation: PropTypes.string,\n    type: PropTypes.oneOf([\"A\", \"B\", \"C\", \"D\"]),\n    size: PropTypes.oneOf([\"standard\", \"large\"]),\n};\nTab.defaultProps = {\n    type: \"A\",\n    size: \"standard\",\n    onChange: null,\n};\n\nexport default Tab;\n","import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport { Tabs as MuiTabs } from \"@mui/material\";\n\nconst typeA = {\n    \"& .MuiTabs-flexContainer\": {\n        columnGap: \"4px !important\",\n    },\n    \"& .MuiTabs-indicator\": {\n        display: \"none !important\",\n    },\n};\n\nconst typeB = {\n    backgroundColor: \"#FFF\",\n    color: \"#515151\",\n    \"& .MuiTabs-indicator\": {\n        backgroundColor: \"#209FA6\",\n        height: \"6px\",\n    },\n};\n\nconst typeC = {\n    color: \"333\",\n    \"& .MuiTabs-indicator\": {\n        backgroundColor: \"#209FA6\",\n        height: \"100%\",\n        width: \"6px !important\",\n        left: 0,\n    },\n};\n\nconst typeCVerticalSelected = {\n    \"& .MuiTab-root.Mui-selected\": {\n        borderTop: \"solid 1px #8C8C8C\",\n        borderBottom: \"solid 1px #8C8C8C\",\n        borderRight: \"1px solid white\",\n        width: \"calc(100% + 1px)\",\n    },\n};\n\nconst typeD = {\n    backgroundColor: \"#FFF\",\n    color: \"#515151\",\n    \"& .MuiTabs-indicator\": {\n        backgroundColor: \"#209FA6\",\n        height: \"6px\",\n        top: 0,\n    },\n};\n\nconst baseStyle = {\n    outline: \"none\",\n    fontFamily: \"Rubik, sans Sarif\",\n    fontWeight: 400,\n    lineHeight: 19,\n    backgroundColor: \"transparent\",\n    \"& .Mui-selected\": {\n        outline: \"none\",\n        fontWeight: 500,\n        color: \"#333 !important\",\n        backgroundColor: \"#fff\",\n    },\n};\n\nconst Tabs = ({ type, size, orientation, ...rest }) => {\n    let style = { ...baseStyle };\n\n    switch (type) {\n        case \"A\":\n            style = { ...style, ...typeA };\n            break;\n        case \"B\":\n            style = { ...style, ...typeB };\n            break;\n        case \"C\":\n            if (orientation === \"vertical\") {\n                style = { ...style, ...typeC, ...typeCVerticalSelected };\n            } else {\n                style = { ...style, ...typeC };\n            }\n            break;\n        case \"D\":\n            style = { ...style, ...typeD };\n            break;\n        default:\n            break;\n    }\n\n    return (\n        <MuiTabs disableRipple orientation={orientation} sx={style} {...rest} />\n    );\n};\n\nTabs.propTypes = {\n    orientation: PropTypes.string,\n    type: PropTypes.oneOf([\"A\", \"B\", \"C\", \"D\"]),\n    size: PropTypes.oneOf([\"standard\", \"large\"]),\n    ariaLabel: PropTypes.string,\n    selected: PropTypes.string,\n    defaultSelectedId: PropTypes.string,\n    onChange: PropTypes.func,\n    children: PropTypes.oneOfType([PropTypes.node, PropTypes.array]),\n};\n\nTabs.defaultProps = {\n    orientation: \"horizontal\",\n    type: \"A\",\n    size: \"standard\",\n    selected: null,\n    defaultSelectedId: null,\n    onChange: null,\n    children: null,\n};\n\nexport default Tabs;\n","(function (global, factory) {\n  if (typeof define === \"function\" && define.amd) {\n    define([\"exports\", \"react\", \"@storybook/addon-knobs\", \"./tabs.scss\", \"./index\", \"./Tab\"], factory);\n  } else if (typeof exports !== \"undefined\") {\n    factory(exports, require(\"react\"), require(\"@storybook/addon-knobs\"), require(\"./tabs.scss\"), require(\"./index\"), require(\"./Tab\"));\n  } else {\n    var mod = {\n      exports: {}\n    };\n    factory(mod.exports, global.react, global.addonKnobs, global.tabs, global.index, global.Tab);\n    global.TabsStories = mod.exports;\n  }\n})(typeof globalThis !== \"undefined\" ? globalThis : typeof self !== \"undefined\" ? self : this, function (_exports, _react, _addonKnobs, _tabs, _index, _Tab) {\n  \"use strict\";\n\n  Object.defineProperty(_exports, \"__esModule\", {\n    value: true\n  });\n  _exports.default = _exports.TypeA = void 0;\n  _react = _interopRequireWildcard(_react);\n  _index = _interopRequireDefault(_index);\n  _Tab = _interopRequireDefault(_Tab);\n  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }\n  function _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n  var _default = _exports.default = {\n    title: \"Tabs\",\n    component: _index.default,\n    decorators: [_addonKnobs.withKnobs]\n  };\n  const TypeA = () => {\n    // state, setState\n    const [selected, setSelected] = (0, _react.useState)(1);\n    const handleChange = (e, v) => {\n      // 1,2,3\n      setSelected(v);\n    };\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        margin: \"25px\"\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        width: \"fit-content\"\n      }\n    }, \"Standard: A\", /*#__PURE__*/_react.default.createElement(_index.default, {\n      type: \"A\",\n      size: \"standard\",\n      value: selected,\n      onChange: handleChange\n    }, /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"A\",\n      size: \"standard\",\n      label: \"Item One\",\n      value: 1\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"A\",\n      size: \"standard\",\n      label: \"Item Two\",\n      value: 2\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"A\",\n      size: \"standard\",\n      label: \"Item Three\",\n      value: 3\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"A\",\n      size: \"standard\",\n      label: \"disabled\",\n      value: 4,\n      disabled: true\n    }))), /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        width: \"fit-content\"\n      }\n    }, \"Large: A\", /*#__PURE__*/_react.default.createElement(_index.default, {\n      type: \"A\",\n      size: \"large\",\n      value: selected,\n      onChange: handleChange\n    }, /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"A\",\n      size: \"large\",\n      label: \"Item One\",\n      value: 1\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"A\",\n      size: \"large\",\n      label: \"Item Two\",\n      value: 2\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"A\",\n      size: \"large\",\n      label: \"Item Three\",\n      value: 3\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"A\",\n      size: \"large\",\n      label: \"disabled\",\n      value: 4,\n      disabled: true\n    }))), /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        width: \"fit-content\"\n      }\n    }, \"Standard: B\", /*#__PURE__*/_react.default.createElement(_index.default, {\n      type: \"B\",\n      size: \"standard\",\n      value: selected,\n      onChange: handleChange\n    }, /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"B\",\n      size: \"standard\",\n      label: \"Item One\",\n      value: 1\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"B\",\n      size: \"standard\",\n      label: \"Item Two\",\n      value: 2\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"B\",\n      size: \"standard\",\n      label: \"Item Three\",\n      value: 3\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"B\",\n      size: \"standard\",\n      label: \"disabled\",\n      value: 4,\n      disabled: true\n    }))), /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        width: \"fit-content\"\n      }\n    }, \"Large: B\", /*#__PURE__*/_react.default.createElement(_index.default, {\n      type: \"B\",\n      size: \"large\",\n      value: selected,\n      onChange: handleChange\n    }, /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"B\",\n      size: \"large\",\n      label: \"Item One\",\n      value: 1\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"B\",\n      size: \"large\",\n      label: \"Item Two\",\n      value: 2\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"B\",\n      size: \"large\",\n      label: \"Item Three\",\n      value: 3\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"B\",\n      size: \"large\",\n      label: \"disabled\",\n      value: 4,\n      disabled: true\n    }))), /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        width: \"fit-content\"\n      }\n    }, \"Standard: C\", /*#__PURE__*/_react.default.createElement(_index.default, {\n      type: \"C\",\n      value: selected,\n      onChange: handleChange\n    }, /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"standard\",\n      label: \"Item One\",\n      value: 1\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"standard\",\n      label: \"Item Two\",\n      value: 2\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"standard\",\n      label: \"Item Three\",\n      value: 3\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"standard\",\n      label: \"disabled\",\n      value: 4,\n      disabled: true\n    }))), /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        width: \"fit-content\"\n      }\n    }, \"Large: C\", /*#__PURE__*/_react.default.createElement(_index.default, {\n      type: \"C\",\n      value: selected,\n      onChange: handleChange\n    }, /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"large\",\n      label: \"Item One\",\n      value: 1\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"large\",\n      label: \"Item Two\",\n      value: 2\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"large\",\n      label: \"Item Three\",\n      value: 3\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"large\",\n      label: \"disabled\",\n      value: 4,\n      disabled: true\n    }))), /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: \"vertical-standard-type-c-wrapper\"\n    }, /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: \"vertical-standard-type-c\"\n    }, /*#__PURE__*/_react.default.createElement(\"h4\", null, \"Vertical Standard: C\"), /*#__PURE__*/_react.default.createElement(_index.default, {\n      type: \"C\",\n      value: selected,\n      onChange: handleChange,\n      orientation: \"vertical\"\n    }, /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"standard\",\n      label: \"Item One\",\n      value: 1,\n      orientation: \"vertical\"\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"standard\",\n      label: \"Item Two\",\n      value: 2,\n      orientation: \"vertical\"\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"standard\",\n      label: \"Item Three\",\n      value: 3,\n      orientation: \"vertical\"\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"C\",\n      size: \"standard\",\n      label: \"disabled\",\n      value: 4,\n      disabled: true,\n      orientation: \"vertical\"\n    })))), /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        width: \"fit-content\"\n      }\n    }, \"Standard: D\", /*#__PURE__*/_react.default.createElement(_index.default, {\n      type: \"D\",\n      value: selected,\n      onChange: handleChange\n    }, /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"D\",\n      size: \"standard\",\n      label: \"Item One\",\n      value: 1\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"D\",\n      size: \"standard\",\n      label: \"Item Two\",\n      value: 2\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"D\",\n      size: \"standard\",\n      label: \"Item Three\",\n      value: 3\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"D\",\n      size: \"standard\",\n      label: \"disabled\",\n      value: 4,\n      disabled: true\n    }))), /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        width: \"fit-content\"\n      }\n    }, \"Large: D\", /*#__PURE__*/_react.default.createElement(_index.default, {\n      type: \"D\",\n      value: selected,\n      onChange: handleChange\n    }, /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"D\",\n      size: \"large\",\n      label: \"Item One\",\n      value: 1\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"D\",\n      size: \"large\",\n      label: \"Item Two\",\n      value: 2\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"D\",\n      size: \"large\",\n      label: \"Item Three\",\n      value: 3\n    }), /*#__PURE__*/_react.default.createElement(_Tab.default, {\n      type: \"D\",\n      size: \"large\",\n      label: \"disabled\",\n      value: 4,\n      disabled: true\n    }))));\n  };\n  _exports.TypeA = TypeA;\n});","// Imports\nimport ___CSS_LOADER_API_SOURCEMAP_IMPORT___ from \"../../node_modules/css-loader/dist/runtime/sourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `.vertical-standard-type-c-wrapper *{overflow:visible !important}.vertical-standard-type-c>h4{padding-top:16px}.vertical-standard-type-c{width:300px;border-right:solid 1px #8c8c8c}`, \"\",{\"version\":3,\"sources\":[\"webpack://./components/Tabs/tabs.scss\"],\"names\":[],\"mappings\":\"AAEA,oCACC,2BAAA,CAIA,6BACC,gBAAA,CAFF,0BAIC,WAAA,CACA,8BAAA\",\"sourcesContent\":[\"// Required to have OverFlow visible for parent component of Tabs\\n// in order to add styling for Mui.selected Tabs\\n.vertical-standard-type-c-wrapper * {\\n\\toverflow: visible !important;\\n}\\n\\n.vertical-standard-type-c {\\n\\t> h4 {\\n\\t\\tpadding-top: 16px;\\n\\t}\\n\\twidth: 300px;\\n\\tborder-right: solid 1px #8C8C8C;\\n}\\n\"],\"sourceRoot\":\"\"}]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___;\n","var api = require(\"!../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n            var content = require(\"!!../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[15].use[1]!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[15].use[2]!./tabs.scss\");\n\n            content = content.__esModule ? content.default : content;\n\n            if (typeof content === 'string') {\n              content = [[module.id, content, '']];\n            }\n\nvar options = {};\n\noptions.insert = \"head\";\noptions.singleton = false;\n\nvar update = api(content, options);\n\n\n\nmodule.exports = content.locals || {};"],"names":[],"sourceRoot":""}

package/storybook-static/TextArea-TextArea-stories.f862921e.iframe.bundle.js

@@ -0,0 +1,2 @@
+(self.webpackChunk_madie_madie_design_system=self.webpackChunk_madie_madie_design_system||[]).push([[1680],{"./components/TextArea/TextArea.stories.js"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/prop-types/index.js"),__webpack_require__("./node_modules/@storybook/addon-knobs/dist/index.js"),__webpack_require__("./components/TextArea/index.jsx"),__webpack_require__("./node_modules/@mui/material/index.js")],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_propTypes,_addonKnobs,_index,_material){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=_exports.WithHelperText=_exports.VariedHeights=_exports.Textarea=_exports.Required=_exports.ReadOnlyWithValue=_exports.Error=_exports.DisabledWithValue=_exports.DisabledWithNoValue=void 0,_react=_interopRequireDefault(_react),_propTypes=_interopRequireDefault(_propTypes),_index=_interopRequireDefault(_index),_exports.default={title:"TextArea",component:_index.default,decorators:[_addonKnobs.withKnobs]};const Wrapper=({children})=>_react.default.createElement("div",{className:"qpp-u-padding--16",style:{width:300}},children);Wrapper.propTypes={className:_propTypes.default.string,children:_propTypes.default.node};const Textarea=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small"}));_exports.Textarea=Textarea;const WithHelperText=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:_react.default.createElement(_material.FormHelperText,{"data-testid":"helper-text",error:!1},"a descriptive message")}));_exports.WithHelperText=WithHelperText;const ReadOnlyWithValue=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",value:"This is a read only text area",readOnly:!0,required:!0}));_exports.ReadOnlyWithValue=ReadOnlyWithValue;const DisabledWithValue=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",value:"This is a disabled text area",disabled:!0,required:!0}));_exports.DisabledWithValue=DisabledWithValue;const DisabledWithNoValue=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",disabled:!0,required:!0}));_exports.DisabledWithNoValue=DisabledWithNoValue;const Required=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",required:!0,label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small"}));_exports.Required=Required;const Error=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",error:!0,required:!0,label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:"An error message"}));_exports.Error=Error;const VariedHeights=()=>_react.default.createElement("div",{className:"qpp-u-padding--16",style:{width:900,marginBottom:"16px"}},_react.default.createElement("div",{style:{display:"flex",flexDirection:"row"}},_react.default.createElement(_index.default,{placeholder:"Placeholder",required:!0,label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:"An error message"}),_react.default.createElement(_index.default,{placeholder:"Placeholder",required:!0,label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:"An error message"}),_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:"An error message designed to take up a lot of space to see how we space multiple input elements within the same row in a responsive manner "}),_react.default.createElement(_index.default,{placeholder:"Placeholder",error:!0,required:!0,label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:"An error message"})));_exports.VariedHeights=VariedHeights})?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)}}]);
+//# sourceMappingURL=TextArea-TextArea-stories.f862921e.iframe.bundle.js.map

package/storybook-static/TextArea-TextArea-stories.f862921e.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea-TextArea-stories.3efe44e9.iframe.bundle.js","mappings":"AAAA","sources":["webpack://@madie/madie-design-system/./components/TextArea/TextArea.stories.js"],"sourcesContent":["(function (global, factory) {\n  if (typeof define === \"function\" && define.amd) {\n    define([\"exports\", \"react\", \"prop-types\", \"@storybook/addon-knobs\", \"./index\", \"@mui/material\"], factory);\n  } else if (typeof exports !== \"undefined\") {\n    factory(exports, require(\"react\"), require(\"prop-types\"), require(\"@storybook/addon-knobs\"), require(\"./index\"), require(\"@mui/material\"));\n  } else {\n    var mod = {\n      exports: {}\n    };\n    factory(mod.exports, global.react, global.propTypes, global.addonKnobs, global.index, global.material);\n    global.TextAreaStories = mod.exports;\n  }\n})(typeof globalThis !== \"undefined\" ? globalThis : typeof self !== \"undefined\" ? self : this, function (_exports, _react, _propTypes, _addonKnobs, _index, _material) {\n  \"use strict\";\n\n  Object.defineProperty(_exports, \"__esModule\", {\n    value: true\n  });\n  _exports.default = _exports.WithHelperText = _exports.VariedHeights = _exports.Textarea = _exports.Required = _exports.ReadOnlyWithValue = _exports.Error = _exports.DisabledWithValue = _exports.DisabledWithNoValue = void 0;\n  _react = _interopRequireDefault(_react);\n  _propTypes = _interopRequireDefault(_propTypes);\n  _index = _interopRequireDefault(_index);\n  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }\n  var _default = _exports.default = {\n    title: \"TextArea\",\n    component: _index.default,\n    decorators: [_addonKnobs.withKnobs]\n  };\n  const Wrapper = ({\n    children\n  }) => /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: \"qpp-u-padding--16\",\n    style: {\n      width: 300\n    }\n  }, children);\n  Wrapper.propTypes = {\n    className: _propTypes.default.string,\n    children: _propTypes.default.node\n  };\n  const Textarea = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\"\n  }));\n  _exports.Textarea = Textarea;\n  const WithHelperText = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: /*#__PURE__*/_react.default.createElement(_material.FormHelperText, {\n      \"data-testid\": `helper-text`,\n      error: false\n    }, \"a descriptive message\")\n  }));\n  _exports.WithHelperText = WithHelperText;\n  const ReadOnlyWithValue = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    value: \"This is a read only text area\",\n    readOnly: true,\n    required: true\n  }));\n  _exports.ReadOnlyWithValue = ReadOnlyWithValue;\n  const DisabledWithValue = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    value: \"This is a disabled text area\",\n    disabled: true,\n    required: true\n  }));\n  _exports.DisabledWithValue = DisabledWithValue;\n  const DisabledWithNoValue = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    disabled: true,\n    required: true\n  }));\n  _exports.DisabledWithNoValue = DisabledWithNoValue;\n  const Required = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    required: true,\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\"\n  }));\n  _exports.Required = Required;\n  const Error = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    error: true,\n    required: true,\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: \"An error message\"\n  }));\n  _exports.Error = Error;\n  const VariedHeights = () => /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: \"qpp-u-padding--16\",\n    style: {\n      width: 900,\n      marginBottom: \"16px\"\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"div\", {\n    style: {\n      display: \"flex\",\n      flexDirection: \"row\"\n    }\n  }, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    required: true,\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: \"An error message\"\n  }), /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    required: true,\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: \"An error message\"\n  }), /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: \"An error message designed to take up a lot of space to see how we space multiple input elements within the same row in a responsive manner \"\n  }), /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    error: true,\n    required: true,\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: \"An error message\"\n  })));\n  _exports.VariedHeights = VariedHeights;\n});"],"names":[],"sourceRoot":""}

package/storybook-static/TextField-TextField-stories.ed07af6e.iframe.bundle.js

@@ -0,0 +1,2 @@
+(self.webpackChunk_madie_madie_design_system=self.webpackChunk_madie_madie_design_system||[]).push([[1910],{"./components/TextField/TextField.stories.js"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/prop-types/index.js"),__webpack_require__("./node_modules/@storybook/addon-knobs/dist/index.js"),__webpack_require__("./components/TextField/index.jsx"),__webpack_require__("./node_modules/@mui/material/index.js"),__webpack_require__("./node_modules/@mui/icons-material/Search.js"),__webpack_require__("./node_modules/@mui/icons-material/Clear.js")],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_propTypes,_addonKnobs,_index,_material,_Search,_Clear){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=_exports.WithToolTipText=_exports.WithLeftAndRightIcon=_exports.WithHelperText=_exports.VariedHeights=_exports.TextfieldDifferentLabel=_exports.Textfield=_exports.Required=_exports.ReadOnly=_exports.Error=_exports.Disabled=void 0,_react=_interopRequireDefault(_react),_propTypes=_interopRequireDefault(_propTypes),_index=_interopRequireDefault(_index),_Search=_interopRequireDefault(_Search),_Clear=_interopRequireDefault(_Clear),_exports.default={title:"TextField",component:_index.default,decorators:[_addonKnobs.withKnobs]};const Wrapper=({children})=>_react.default.createElement("div",{className:"qpp-u-padding--16",style:{width:300}},children);Wrapper.propTypes={className:_propTypes.default.string,children:_propTypes.default.node};const Textfield=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small"}));_exports.Textfield=Textfield;const WithHelperText=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:_react.default.createElement(_material.FormHelperText,{"data-testid":"helper-text",error:!1},"a descriptive message")}));_exports.WithHelperText=WithHelperText;const ReadOnly=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"ReadOnly Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",readOnly:!0}));_exports.ReadOnly=ReadOnly;const Disabled=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Disabled Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",disabled:!0}));_exports.Disabled=Disabled;const Required=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",required:!0,label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small"}));_exports.Required=Required;const Error=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",error:!0,required:!0,label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:"An error message"}));_exports.Error=Error;const WithToolTipText=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Confirm New Version #","data-testid":"measure-name-text-field",size:"small",tooltipText:"Input the new version # located to the left to confirm.",helperText:"test",id:"measure-name"}));_exports.WithToolTipText=WithToolTipText;const VariedHeights=()=>_react.default.createElement("div",{className:"qpp-u-padding--16",style:{width:900,marginBottom:"16px"}},_react.default.createElement("div",{style:{display:"flex",flexDirection:"row"}},_react.default.createElement(_index.default,{placeholder:"Placeholder",required:!0,label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:"An error message"}),_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:"An error message designed to take up a lot of space to see how we space multiple input elements within the same row in a responsive manner "}),_react.default.createElement(_index.default,{placeholder:"Placeholder",error:!0,required:!0,label:"Text Label",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small",helperText:"An error message"})));_exports.VariedHeights=VariedHeights;const WithLeftAndRightIcon=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{id:"search",tw:"w-full",label:"Search",placeholder:"Search",inputProps:{"data-testid":"test-case-list-search-input"},"data-testid":"test-case-list-search",slotProps:{input:{startAdornment:_react.default.createElement(_material.InputAdornment,{position:"start"},_react.default.createElement(_Search.default,null)),endAdornment:_react.default.createElement(_material.InputAdornment,{position:"end"},_react.default.createElement(_material.IconButton,{onClick:""},_react.default.createElement(_Clear.default,null)))}},name:"test-case-list-search"}));_exports.WithLeftAndRightIcon=WithLeftAndRightIcon;const TextfieldDifferentLabel=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{placeholder:"Placeholder",label:"Text Label with different color",labelColor:"#1976d2",id:"measureName",inputProps:{"data-testid":"measure-name-input"},"data-testid":"measure-name-text-field",size:"small"}));_exports.TextfieldDifferentLabel=TextfieldDifferentLabel})?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)}}]);
+//# sourceMappingURL=TextField-TextField-stories.ed07af6e.iframe.bundle.js.map

package/storybook-static/TextField-TextField-stories.ed07af6e.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextField-TextField-stories.f6c24573.iframe.bundle.js","mappings":"AAAA","sources":["webpack://@madie/madie-design-system/./components/TextField/TextField.stories.js"],"sourcesContent":["(function (global, factory) {\n  if (typeof define === \"function\" && define.amd) {\n    define([\"exports\", \"react\", \"prop-types\", \"@storybook/addon-knobs\", \"./index\", \"@mui/material\", \"@mui/icons-material/Search\", \"@mui/icons-material/Clear\"], factory);\n  } else if (typeof exports !== \"undefined\") {\n    factory(exports, require(\"react\"), require(\"prop-types\"), require(\"@storybook/addon-knobs\"), require(\"./index\"), require(\"@mui/material\"), require(\"@mui/icons-material/Search\"), require(\"@mui/icons-material/Clear\"));\n  } else {\n    var mod = {\n      exports: {}\n    };\n    factory(mod.exports, global.react, global.propTypes, global.addonKnobs, global.index, global.material, global.Search, global.Clear);\n    global.TextFieldStories = mod.exports;\n  }\n})(typeof globalThis !== \"undefined\" ? globalThis : typeof self !== \"undefined\" ? self : this, function (_exports, _react, _propTypes, _addonKnobs, _index, _material, _Search, _Clear) {\n  \"use strict\";\n\n  Object.defineProperty(_exports, \"__esModule\", {\n    value: true\n  });\n  _exports.default = _exports.WithToolTipText = _exports.WithLeftAndRightIcon = _exports.WithHelperText = _exports.VariedHeights = _exports.TextfieldDifferentLabel = _exports.Textfield = _exports.Required = _exports.ReadOnly = _exports.Error = _exports.Disabled = void 0;\n  _react = _interopRequireDefault(_react);\n  _propTypes = _interopRequireDefault(_propTypes);\n  _index = _interopRequireDefault(_index);\n  _Search = _interopRequireDefault(_Search);\n  _Clear = _interopRequireDefault(_Clear);\n  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }\n  var _default = _exports.default = {\n    title: \"TextField\",\n    component: _index.default,\n    decorators: [_addonKnobs.withKnobs]\n  };\n  const Wrapper = ({\n    children\n  }) => /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: \"qpp-u-padding--16\",\n    style: {\n      width: 300\n    }\n  }, children);\n  Wrapper.propTypes = {\n    className: _propTypes.default.string,\n    children: _propTypes.default.node\n  };\n  const Textfield = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\"\n  }));\n  _exports.Textfield = Textfield;\n  const WithHelperText = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: /*#__PURE__*/_react.default.createElement(_material.FormHelperText, {\n      \"data-testid\": `helper-text`,\n      error: false\n    }, \"a descriptive message\")\n  }));\n  _exports.WithHelperText = WithHelperText;\n  const ReadOnly = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"ReadOnly Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    readOnly: true\n  }));\n  _exports.ReadOnly = ReadOnly;\n  const Disabled = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Disabled Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    disabled: true\n  }));\n  _exports.Disabled = Disabled;\n  const Required = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    required: true,\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\"\n  }));\n  _exports.Required = Required;\n  const Error = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    error: true,\n    required: true,\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: \"An error message\"\n  }));\n  _exports.Error = Error;\n  const WithToolTipText = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Confirm New Version #\",\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    tooltipText: \"Input the new version # located to the left to confirm.\",\n    helperText: \"test\",\n    id: \"measure-name\"\n    // previously this was how it was done. it could make more sense to only pass it an id and progrematically determine it. Example:\n    // inputProps={{\n    //     \"data-testid\": \"measure-name-input\",\n    //     \"aria-describedby\":\n    //         \"measure-name-helper-text measure-name-tooltip\",\n    // }}\n  }));\n  _exports.WithToolTipText = WithToolTipText;\n  const VariedHeights = () => /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: \"qpp-u-padding--16\",\n    style: {\n      width: 900,\n      marginBottom: \"16px\"\n    }\n  }, /*#__PURE__*/_react.default.createElement(\"div\", {\n    style: {\n      display: \"flex\",\n      flexDirection: \"row\"\n    }\n  }, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    required: true,\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: \"An error message\"\n  }), /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: \"An error message designed to take up a lot of space to see how we space multiple input elements within the same row in a responsive manner \"\n  }), /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    error: true,\n    required: true,\n    label: \"Text Label\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\",\n    helperText: \"An error message\"\n  })));\n  _exports.VariedHeights = VariedHeights;\n  const WithLeftAndRightIcon = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    id: \"search\",\n    tw: \"w-full\",\n    label: \"Search\",\n    placeholder: \"Search\",\n    inputProps: {\n      \"data-testid\": \"test-case-list-search-input\"\n    },\n    \"data-testid\": \"test-case-list-search\",\n    slotProps: {\n      input: {\n        startAdornment: /*#__PURE__*/_react.default.createElement(_material.InputAdornment, {\n          position: \"start\"\n        }, /*#__PURE__*/_react.default.createElement(_Search.default, null)),\n        endAdornment: /*#__PURE__*/_react.default.createElement(_material.InputAdornment, {\n          position: \"end\"\n        }, /*#__PURE__*/_react.default.createElement(_material.IconButton, {\n          onClick: \"\"\n        }, /*#__PURE__*/_react.default.createElement(_Clear.default, null)))\n      }\n    },\n    name: \"test-case-list-search\"\n  }));\n  _exports.WithLeftAndRightIcon = WithLeftAndRightIcon;\n  const TextfieldDifferentLabel = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    placeholder: \"Placeholder\",\n    label: \"Text Label with different color\",\n    labelColor: \"#1976d2\",\n    id: \"measureName\",\n    inputProps: {\n      \"data-testid\": \"measure-name-input\"\n    },\n    \"data-testid\": \"measure-name-text-field\",\n    size: \"small\"\n  }));\n  _exports.TextfieldDifferentLabel = TextfieldDifferentLabel;\n});"],"names":[],"sourceRoot":""}

package/storybook-static/TextInput-TextInput-stories.7043f852.iframe.bundle.js

@@ -0,0 +1,2 @@
+(self.webpackChunk_madie_madie_design_system=self.webpackChunk_madie_madie_design_system||[]).push([[2886],{"./components/TextInput/index.js"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/prop-types/index.js")],__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_propTypes){"use strict";Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_react=_interopRequireDefault(_react),_propTypes=_interopRequireDefault(_propTypes);var _excluded=["id","name","placeholder","disabled","required","size","className","label","minLength","maxLength","hint","errorLabel","error","autoComplete","onChange","onKeyPress","style","dataTestId","type","innerRef","number","variant","parentElement"];function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=_objectWithoutPropertiesLoose(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r<n.length;r++)o=n[r],-1===t.indexOf(o)&&{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(-1!==e.indexOf(n))continue;t[n]=r[n]}return t}var TextInput=function TextInput(_ref){var id=_ref.id,name=_ref.name,placeholder=_ref.placeholder,disabled=_ref.disabled,required=_ref.required,size=_ref.size,className=_ref.className,label=_ref.label,minLength=_ref.minLength,maxLength=_ref.maxLength,hint=_ref.hint,errorLabel=_ref.errorLabel,error=_ref.error,autoComplete=_ref.autoComplete,onChange=_ref.onChange,onKeyPress=_ref.onKeyPress,style=_ref.style,dataTestId=_ref.dataTestId,type=_ref.type,innerRef=_ref.innerRef,number=_ref.number,variant=_ref.variant,parentElement=_ref.parentElement,props=_objectWithoutProperties(_ref,_excluded),ContainerElement=parentElement||"span",numberProps={pattern:"[0-9]*"},textInputClass=["qpp-c-text-input","success"===variant&&!error&&"qpp-c-text-input--success",error&&"qpp-c-text-input--error","big"===size&&"qpp-c-text-input--big",className].filter(Boolean).join(" ");return _react.default.createElement(ContainerElement,{className:"qppds ds-text-input-container"},label&&_react.default.createElement("label",{className:"qpp-u-margin-bottom--8",htmlFor:id},label),_react.default.createElement("input",_extends({},number?numberProps:{},{style,"data-testid":dataTestId,type,className:textInputClass||"",id,name,placeholder,disabled,minLength,maxLength,required,autoComplete,onChange,onKeyPress,ref:innerRef},props)),hint&&_react.default.createElement("span",{className:"qpp-hint-message"},hint),error&&_react.default.createElement("span",{"aria-label":errorLabel,role:"alert",className:"qpp-error-message"},error))};TextInput.propTypes={id:_propTypes.default.string,name:_propTypes.default.string,placeholder:_propTypes.default.string,disabled:_propTypes.default.bool,required:_propTypes.default.bool,className:_propTypes.default.string,minLength:_propTypes.default.string,maxLength:_propTypes.default.string,hint:_propTypes.default.string,errorLabel:_propTypes.default.string,error:_propTypes.default.string,autoComplete:_propTypes.default.string,onChange:_propTypes.default.func,onKeyPress:_propTypes.default.func,style:_propTypes.default.object,dataTestId:_propTypes.default.string,type:_propTypes.default.string,innerRef:_propTypes.default.string,number:_propTypes.default.bool,variant:_propTypes.default.oneOf(["success"]),parentElement:_propTypes.default.string,label:_propTypes.default.string,size:_propTypes.default.oneOf(["big"])},TextInput.defaultProps={id:"",name:"",placeholder:null,disabled:!1,required:!1,className:"",minLength:"",maxLength:"",error:null,errorLabel:null,hint:null,autoComplete:"on",onChange:function onChange(){return null},onKeyPress:function onKeyPress(){return null},style:null,dataTestId:"",type:"text",innerRef:null,number:!1,variant:null,parentElement:"span",label:null,size:null},_exports.default=TextInput,TextInput.__docgenInfo={description:"",methods:[],displayName:"TextInput",props:{id:{defaultValue:{value:'""',computed:!1},description:"",type:{name:"string"},required:!1},name:{defaultValue:{value:'""',computed:!1},description:"",type:{name:"string"},required:!1},placeholder:{defaultValue:{value:"null",computed:!1},description:"",type:{name:"string"},required:!1},disabled:{defaultValue:{value:"false",computed:!1},description:"",type:{name:"bool"},required:!1},required:{defaultValue:{value:"false",computed:!1},description:"",type:{name:"bool"},required:!1},className:{defaultValue:{value:'""',computed:!1},description:"",type:{name:"string"},required:!1},minLength:{defaultValue:{value:'""',computed:!1},description:"",type:{name:"string"},required:!1},maxLength:{defaultValue:{value:'""',computed:!1},description:"",type:{name:"string"},required:!1},error:{defaultValue:{value:"null",computed:!1},description:"",type:{name:"string"},required:!1},errorLabel:{defaultValue:{value:"null",computed:!1},description:"",type:{name:"string"},required:!1},hint:{defaultValue:{value:"null",computed:!1},description:"",type:{name:"string"},required:!1},autoComplete:{defaultValue:{value:'"on"',computed:!1},description:"",type:{name:"string"},required:!1},onChange:{defaultValue:{value:"() => null",computed:!1},description:"",type:{name:"func"},required:!1},onKeyPress:{defaultValue:{value:"() => null",computed:!1},description:"",type:{name:"func"},required:!1},style:{defaultValue:{value:"null",computed:!1},description:"",type:{name:"object"},required:!1},dataTestId:{defaultValue:{value:'""',computed:!1},description:"",type:{name:"string"},required:!1},type:{defaultValue:{value:'"text"',computed:!1},description:"",type:{name:"string"},required:!1},innerRef:{defaultValue:{value:"null",computed:!1},description:"",type:{name:"string"},required:!1},number:{defaultValue:{value:"false",computed:!1},description:"",type:{name:"bool"},required:!1},variant:{defaultValue:{value:"null",computed:!1},description:"",type:{name:"enum",value:[{value:'"success"',computed:!1}]},required:!1},parentElement:{defaultValue:{value:'"span"',computed:!1},description:"",type:{name:"string"},required:!1},label:{defaultValue:{value:"null",computed:!1},description:"",type:{name:"string"},required:!1},size:{defaultValue:{value:"null",computed:!1},description:"",type:{name:"enum",value:[{value:'"big"',computed:!1}]},required:!1}}}},void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof __WEBPACK_AMD_DEFINE_FACTORY__?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./components/TextInput/TextInput.stories.js"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/prop-types/index.js"),__webpack_require__("./components/TextInput/index.js"),__webpack_require__("./node_modules/@storybook/addon-knobs/dist/index.js")],__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_propTypes,_index,_addonKnobs){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=_exports.SuccessInputField=_exports.InputFieldWithPlaceholder=_exports.InputFieldWithHint=_exports.InputField=_exports.FocusedInputField=_exports.ErrorInputField=_exports.DisabledInputField=_exports.BigInput=void 0,_react=_interopRequireDefault(_react),_propTypes=_interopRequireDefault(_propTypes),_index=_interopRequireDefault(_index),_exports.default={title:"Text Input",component:_index.default,decorators:[_addonKnobs.withKnobs]};const optionalProps={"aria-label":"example label"},Wrapper=({children})=>_react.default.createElement("div",{className:"qpp-u-padding--16"},children);Wrapper.propTypes={children:_propTypes.default.node};const InputField=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,_extends({style:{width:"auto"},id:"example",name:"single-example",value:"Example value",label:"Input Field"},optionalProps)));_exports.InputField=InputField;const InputFieldWithPlaceholder=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{id:"placeholder-example",name:"placheholder",label:"Placeholder Example",placeholder:"Placeholder value"}));_exports.InputFieldWithPlaceholder=InputFieldWithPlaceholder;const DisabledInputField=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{disabled:!0,id:"disabled-example",name:"disabled_example",value:"Example value",label:"Disabled Example"}));_exports.DisabledInputField=DisabledInputField;const FocusedInputField=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{id:"focused-example",name:"focused_example",value:"Example value",label:"Focused Example",className:"qpp-c-text-input--focus"}));_exports.FocusedInputField=FocusedInputField;const ErrorInputField=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{className:"qpp-u-margin-bottom--8",id:"error-example",name:"error_example",value:"Example value",error:"Error Message",label:"Error Example"}));_exports.ErrorInputField=ErrorInputField;const SuccessInputField=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{variant:"success",id:"success-example",name:"success",value:"Example value",label:"Success Example"}));_exports.SuccessInputField=SuccessInputField;const InputFieldWithHint=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{className:"qpp-u-margin-bottom--8",id:"hint-example",name:"hint",value:"Example value",label:"Hint Example",hint:"Hint Message"}));_exports.InputFieldWithHint=InputFieldWithHint;const BigInput=()=>_react.default.createElement(Wrapper,null,_react.default.createElement(_index.default,{id:"big-example",name:"hint",value:"Example value",label:"Big Example",size:"big"}));_exports.BigInput=BigInput},void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof __WEBPACK_AMD_DEFINE_FACTORY__?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)}}]);
+//# sourceMappingURL=TextInput-TextInput-stories.7043f852.iframe.bundle.js.map

package/storybook-static/TextInput-TextInput-stories.7043f852.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextInput-TextInput-stories.21fd9ce9.iframe.bundle.js","mappings":"AAGA","sources":["webpack://@madie/madie-design-system/./components/TextInput/index.js","webpack://@madie/madie-design-system/./components/TextInput/TextInput.stories.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nconst TextInput = ({\n    id,\n    name,\n    placeholder,\n    disabled,\n    required,\n    size,\n    className,\n    label,\n    minLength,\n    maxLength,\n    hint,\n    errorLabel,\n    error,\n    autoComplete,\n    onChange,\n    onKeyPress,\n    style,\n    dataTestId,\n    type,\n    innerRef,\n    number,\n    variant,\n    parentElement,\n    ...props\n}) => {\n    const ContainerElement = parentElement || \"span\";\n    const numberProps = {\n        pattern: \"[0-9]*\",\n    };\n\n    const textInputClass = [\n        \"qpp-c-text-input\",\n        variant === \"success\" && !error && \"qpp-c-text-input--success\",\n        error && \"qpp-c-text-input--error\",\n        size === \"big\" && \"qpp-c-text-input--big\",\n        className,\n    ]\n        .filter(Boolean)\n        .join(\" \");\n\n    return (\n        <ContainerElement className=\"qppds ds-text-input-container\">\n            {label && (\n                <label className=\"qpp-u-margin-bottom--8\" htmlFor={id}>\n                    {label}\n                </label>\n            )}\n            <input\n                {...(number ? numberProps : {})}\n                style={style}\n                data-testid={dataTestId}\n                type={type}\n                className={textInputClass || \"\"}\n                id={id}\n                name={name}\n                placeholder={placeholder}\n                disabled={disabled}\n                minLength={minLength}\n                maxLength={maxLength}\n                required={required}\n                autoComplete={autoComplete}\n                onChange={onChange}\n                onKeyPress={onKeyPress}\n                ref={innerRef}\n                {...props}\n            />\n            {hint && <span className=\"qpp-hint-message\">{hint}</span>}\n            {error && (\n                <span\n                    aria-label={errorLabel}\n                    role=\"alert\"\n                    className=\"qpp-error-message\"\n                >\n                    {error}\n                </span>\n            )}\n        </ContainerElement>\n    );\n};\n\nTextInput.propTypes = {\n    id: PropTypes.string,\n    name: PropTypes.string,\n    placeholder: PropTypes.string,\n    disabled: PropTypes.bool,\n    required: PropTypes.bool,\n    className: PropTypes.string,\n    minLength: PropTypes.string,\n    maxLength: PropTypes.string,\n    hint: PropTypes.string,\n    errorLabel: PropTypes.string,\n    error: PropTypes.string,\n    autoComplete: PropTypes.string,\n    onChange: PropTypes.func,\n    onKeyPress: PropTypes.func,\n    style: PropTypes.object,\n    dataTestId: PropTypes.string,\n    type: PropTypes.string,\n    innerRef: PropTypes.string,\n    number: PropTypes.bool,\n    variant: PropTypes.oneOf([\"success\"]),\n    parentElement: PropTypes.string,\n    label: PropTypes.string,\n    size: PropTypes.oneOf([\"big\"]),\n};\n\nTextInput.defaultProps = {\n    id: \"\",\n    name: \"\",\n    placeholder: null,\n    disabled: false,\n    required: false,\n    className: \"\",\n    minLength: \"\",\n    maxLength: \"\",\n    error: null,\n    errorLabel: null,\n    hint: null,\n    autoComplete: \"on\",\n    onChange: () => null,\n    onKeyPress: () => null,\n    style: null,\n    dataTestId: \"\",\n    type: \"text\",\n    innerRef: null,\n    number: false,\n    variant: null,\n    parentElement: \"span\",\n    label: null,\n    size: null,\n};\n\nexport default TextInput;\n","(function (global, factory) {\n  if (typeof define === \"function\" && define.amd) {\n    define([\"exports\", \"react\", \"prop-types\", \"./index\", \"@storybook/addon-knobs\"], factory);\n  } else if (typeof exports !== \"undefined\") {\n    factory(exports, require(\"react\"), require(\"prop-types\"), require(\"./index\"), require(\"@storybook/addon-knobs\"));\n  } else {\n    var mod = {\n      exports: {}\n    };\n    factory(mod.exports, global.react, global.propTypes, global.index, global.addonKnobs);\n    global.TextInputStories = mod.exports;\n  }\n})(typeof globalThis !== \"undefined\" ? globalThis : typeof self !== \"undefined\" ? self : this, function (_exports, _react, _propTypes, _index, _addonKnobs) {\n  \"use strict\";\n\n  Object.defineProperty(_exports, \"__esModule\", {\n    value: true\n  });\n  _exports.default = _exports.SuccessInputField = _exports.InputFieldWithPlaceholder = _exports.InputFieldWithHint = _exports.InputField = _exports.FocusedInputField = _exports.ErrorInputField = _exports.DisabledInputField = _exports.BigInput = void 0;\n  _react = _interopRequireDefault(_react);\n  _propTypes = _interopRequireDefault(_propTypes);\n  _index = _interopRequireDefault(_index);\n  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }\n  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\n  var _default = _exports.default = {\n    title: \"Text Input\",\n    component: _index.default,\n    decorators: [_addonKnobs.withKnobs]\n  };\n  const optionalProps = {\n    \"aria-label\": \"example label\"\n  };\n  const Wrapper = ({\n    children\n  }) => /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: \"qpp-u-padding--16\"\n  }, children);\n  Wrapper.propTypes = {\n    children: _propTypes.default.node\n  };\n  const InputField = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, _extends({\n    style: {\n      width: \"auto\"\n    },\n    id: \"example\",\n    name: \"single-example\",\n    value: \"Example value\",\n    label: \"Input Field\"\n  }, optionalProps)));\n  _exports.InputField = InputField;\n  const InputFieldWithPlaceholder = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    id: \"placeholder-example\",\n    name: \"placheholder\",\n    label: \"Placeholder Example\",\n    placeholder: \"Placeholder value\"\n  }));\n  _exports.InputFieldWithPlaceholder = InputFieldWithPlaceholder;\n  const DisabledInputField = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    disabled: true,\n    id: \"disabled-example\",\n    name: \"disabled_example\",\n    value: \"Example value\",\n    label: \"Disabled Example\"\n  }));\n  _exports.DisabledInputField = DisabledInputField;\n  const FocusedInputField = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    id: \"focused-example\",\n    name: \"focused_example\",\n    value: \"Example value\",\n    label: \"Focused Example\",\n    className: \"qpp-c-text-input--focus\"\n  }));\n  _exports.FocusedInputField = FocusedInputField;\n  const ErrorInputField = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    className: \"qpp-u-margin-bottom--8\",\n    id: \"error-example\",\n    name: \"error_example\",\n    value: \"Example value\",\n    error: \"Error Message\",\n    label: \"Error Example\"\n  }));\n  _exports.ErrorInputField = ErrorInputField;\n  const SuccessInputField = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    variant: \"success\",\n    id: \"success-example\",\n    name: \"success\",\n    value: \"Example value\",\n    label: \"Success Example\"\n  }));\n  _exports.SuccessInputField = SuccessInputField;\n  const InputFieldWithHint = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    className: \"qpp-u-margin-bottom--8\",\n    id: \"hint-example\",\n    name: \"hint\",\n    value: \"Example value\",\n    label: \"Hint Example\",\n    hint: \"Hint Message\"\n  }));\n  _exports.InputFieldWithHint = InputFieldWithHint;\n  const BigInput = () => /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    id: \"big-example\",\n    name: \"hint\",\n    value: \"Example value\",\n    label: \"Big Example\",\n    size: \"big\"\n  }));\n  _exports.BigInput = BigInput;\n});"],"names":[],"sourceRoot":""}

package/storybook-static/TimeField-TimeField-stories.e69c0bc6.iframe.bundle.js

@@ -0,0 +1,2 @@
+(self.webpackChunk_madie_madie_design_system=self.webpackChunk_madie_madie_design_system||[]).push([[1478],{"./components/InputLabel/index.jsx"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/@mui/material/index.js"),__webpack_require__("./node_modules/prop-types/index.js")],__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_material,_propTypes){"use strict";Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_react=_interopRequireDefault(_react),_propTypes=_interopRequireDefault(_propTypes);var _excluded=["required","disabled","error"];function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=_objectWithoutPropertiesLoose(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r<n.length;r++)o=n[r],-1===t.indexOf(o)&&{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(-1!==e.indexOf(n))continue;t[n]=r[n]}return t}var Label=function Label(_ref){var required=_ref.required,disabled=_ref.disabled,error=_ref.error,rest=_objectWithoutProperties(_ref,_excluded);return _react.default.createElement(_material.InputLabel,_extends({required,disabled,error,sx:[{backgroundColor:"transparent",display:"flex",flexDirection:"row-reverse",alignSelf:"baseline",textTransform:"none",position:"initial",transform:"translateX(0px) translateY(0px)",fontFamily:"Rubik",fontWeight:500,fontSize:14,color:"#333","& .MuiInputLabel-asterisk":{color:"#AE1C1C !important",marginRight:"3px !important"}},required&&{transform:"translateX(-12px) translateY(0px)","& .MuiInputLabel-asterisk":{color:"#D92F2",marginRight:"3px !important"}},disabled&&{color:"#333333 !important"},error&&{color:"#AE1C1C !important"}]},rest))};Label.propTypes={required:_propTypes.default.bool.isRequired,disabled:_propTypes.default.bool.isRequired,error:_propTypes.default.bool},_exports.default=Label,Label.__docgenInfo={description:"",methods:[],displayName:"Label",props:{required:{description:"",type:{name:"bool"},required:!0},disabled:{description:"",type:{name:"bool"},required:!0},error:{description:"",type:{name:"bool"},required:!1}}}},void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof __WEBPACK_AMD_DEFINE_FACTORY__?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./components/ReadOnlyTextField/index.jsx"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/@mui/material/index.js"),__webpack_require__("./components/InputLabel/index.jsx"),__webpack_require__("./node_modules/prop-types/index.js")],__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_material,_InputLabel,_propTypes){"use strict";Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_react=_interopRequireDefault(_react),_InputLabel=_interopRequireDefault(_InputLabel),_propTypes=_interopRequireDefault(_propTypes);var _excluded=["id","required","disabled","label"];function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=_objectWithoutPropertiesLoose(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r<n.length;r++)o=n[r],-1===t.indexOf(o)&&{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(-1!==e.indexOf(n))continue;t[n]=r[n]}return t}var ReadOnlyTextField=function ReadOnlyTextField(_ref){var id=_ref.id,_ref$required=_ref.required,required=void 0!==_ref$required&&_ref$required,_ref$disabled=_ref.disabled,disabled=void 0!==_ref$disabled&&_ref$disabled,label=_ref.label,rest=_objectWithoutProperties(_ref,_excluded);return _react.default.createElement(_material.FormControl,{fullWidth:!0},_react.default.createElement(_InputLabel.default,{disabled,shrink:!0,required,htmlFor:id,sx:[{backgroundColor:"transparent",display:"flex",flexDirection:"row-reverse",alignSelf:"baseline",textTransform:"none",position:"initial",transform:"translateX(0px) translateY(0px)",fontFamily:"Rubik",fontWeight:500,fontSize:14,color:"#333","& .MuiInputLabel-asterisk":{color:"#AE1C1C !important",marginRight:"3px !important"}},required&&{transform:"translateX(-12px) translateY(0px)","& .MuiInputLabel-asterisk":{color:"#D92F2",marginRight:"3px !important"}},disabled&&{color:"rgba(0,0,0,0.6)"}]},label),_react.default.createElement(_material.TextareaAutosize,_extends({style:{color:"#333",fontFamily:"Rubik",fontSize:"14px",fontStyle:"normal",fontWeight:400,lineHeight:"24px",border:"none",resize:"none",padding:"0px 0px",outline:"none",boxShadow:"none"},readOnly:!0,disableUnderline:!0,label:null,disabled,id},rest,{value:null==(null==rest?void 0:rest.value)||""===rest.value||"object"===_typeof(rest.value)&&0===Object.keys(rest.value).length?"-":rest.value})))};ReadOnlyTextField.propTypes={id:_propTypes.default.string,required:_propTypes.default.bool,disabled:_propTypes.default.bool,placeholder:_propTypes.default.string,label:_propTypes.default.string},_exports.default=ReadOnlyTextField,ReadOnlyTextField.__docgenInfo={description:"",methods:[],displayName:"ReadOnlyTextField",props:{required:{defaultValue:{value:"false",computed:!1},description:"",type:{name:"bool"},required:!1},disabled:{defaultValue:{value:"false",computed:!1},description:"",type:{name:"bool"},required:!1},id:{description:"",type:{name:"string"},required:!1},placeholder:{description:"",type:{name:"string"},required:!1},label:{description:"",type:{name:"string"},required:!1}}}},void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof __WEBPACK_AMD_DEFINE_FACTORY__?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./components/TimeField/TimeField.jsx"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/@mui/x-date-pickers/index.js"),__webpack_require__("./node_modules/@mui/x-date-pickers/LocalizationProvider/index.js"),__webpack_require__("./node_modules/@mui/x-date-pickers/AdapterDayjs/index.js"),__webpack_require__("./components/InputLabel/index.jsx"),__webpack_require__("./node_modules/lodash/lodash.js"),__webpack_require__("./node_modules/prop-types/index.js"),__webpack_require__("./node_modules/dayjs/dayjs.min.js"),__webpack_require__("./components/ReadOnlyTextField/index.jsx")],__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_xDatePickers,_LocalizationProvider,_AdapterDayjs,_InputLabel,_lodash,_propTypes,_dayjs,_ReadOnlyTextField){"use strict";Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_react=_interopRequireDefault(_react),_InputLabel=_interopRequireDefault(_InputLabel),_propTypes=_interopRequireDefault(_propTypes),_dayjs=_interopRequireDefault(_dayjs);var _excluded=["id","label","value","handleTimeChange","readOnly","disabled","required","error"];function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=_objectWithoutPropertiesLoose(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r<n.length;r++)o=n[r],-1===t.indexOf(o)&&{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(-1!==e.indexOf(n))continue;t[n]=r[n]}return t}var timeFieldStyle={width:"170px",height:40,marginTop:"8px","& .MuiOutlinedInput-notchedOutline":{borderRadius:"3px",borderColor:"#8C8C8C","& legend":{width:0}},"& .MuiOutlinedInput-root":{"&&":{borderRadius:"3px"}},"& .MuiInputBase-input":{color:"#333333",fontFamily:"Rubik",fontSize:14,borderRadius:"3px",padding:"9px",Width:"170px","&::placeholder":{opacity:1,color:"#717171",fontFamily:"Rubik",fontSize:14}}},TimeField=function TimeField(_ref){var id=_ref.id,label=_ref.label,value=_ref.value,handleTimeChange=_ref.handleTimeChange,readOnly=_ref.readOnly,disabled=_ref.disabled,required=_ref.required,error=_ref.error,rest=_objectWithoutProperties(_ref,_excluded);return readOnly?_react.default.createElement(_ReadOnlyTextField.ReadOnlyTextField,_extends({required,label,id,size:"small"},rest,{value:value?_dayjs.default.utc(value).format("HH:mm:ss a"):"-"})):_react.default.createElement(_LocalizationProvider.LocalizationProvider,{dateAdapter:_AdapterDayjs.AdapterDayjs},_react.default.createElement(_InputLabel.default,{"data-testid":"".concat((0,_lodash.kebabCase)(label)),style:{marginBottom:0,height:16},sx:[{backgroundColor:"transparent",textTransform:"none",height:17,left:0,right:0,top:0,fontFamily:"Rubik",fontStyle:"normal",fontWeight:500,fontSize:14,color:"#333333"}],required,disabled,error},"".concat(label)),_react.default.createElement(_xDatePickers.TimePicker,_extends({sx:timeFieldStyle,disabled,value:value||null,onChange:handleTimeChange,slotProps:{textField:{id:"time"}}},rest)))};TimeField.propTypes={id:_propTypes.default.string,label:_propTypes.default.string.isRequired,value:_propTypes.default.object,handleTimeChange:_propTypes.default.func.isRequired,disabled:_propTypes.default.bool,required:_propTypes.default.bool,readOnly:_propTypes.default.bool,error:_propTypes.default.string},_exports.default=TimeField,TimeField.__docgenInfo={description:"",methods:[],displayName:"TimeField",props:{id:{description:"",type:{name:"string"},required:!1},label:{description:"",type:{name:"string"},required:!0},value:{description:"",type:{name:"object"},required:!1},handleTimeChange:{description:"",type:{name:"func"},required:!0},disabled:{description:"",type:{name:"bool"},required:!1},required:{description:"",type:{name:"bool"},required:!1},readOnly:{description:"",type:{name:"bool"},required:!1},error:{description:"",type:{name:"string"},required:!1}}}},void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof __WEBPACK_AMD_DEFINE_FACTORY__?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./components/TimeField/TimeField.stories.js"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./components/TimeField/TimeField.jsx"),__webpack_require__("./node_modules/@storybook/addon-knobs/dist/index.js")],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_TimeField,_addonKnobs){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=_exports.TimeFieldComponent=void 0,_react=_interopRequireWildcard(_react),_TimeField=_interopRequireDefault(_TimeField),_exports.default={title:"TimeField",component:_TimeField.default,decorators:[_addonKnobs.withKnobs]};const TimeFieldComponent=args=>{const[value,setValue]=(0,_react.useState)(""),handleTimeChange=(newValue,v)=>{console.log("Time changed: newValue = ",newValue),setValue(newValue)};return _react.default.createElement("div",{className:"qpp-u-padding--16"},_react.default.createElement(_TimeField.default,{disabled:!1,label:"Result Time",handleTimeChange,value}))};_exports.TimeFieldComponent=TimeFieldComponent})?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)}}]);
+//# sourceMappingURL=TimeField-TimeField-stories.e69c0bc6.iframe.bundle.js.map

package/storybook-static/TimeField-TimeField-stories.e69c0bc6.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeField-TimeField-stories.d4b2e4df.iframe.bundle.js","mappings":"AAIA","sources":["webpack://@madie/madie-design-system/./components/InputLabel/index.jsx","webpack://@madie/madie-design-system/./components/ReadOnlyTextField/index.jsx","webpack://@madie/madie-design-system/./components/TimeField/TimeField.jsx","webpack://@madie/madie-design-system/./components/TimeField/TimeField.stories.js"],"sourcesContent":["import React from \"react\";\nimport { InputLabel as MUIInputLabel } from \"@mui/material\";\nimport PropTypes from \"prop-types\";\n\nconst Label = ({ required, disabled, error, ...rest }) => {\n    return (\n        <MUIInputLabel\n            required={required}\n            disabled={disabled}\n            error={error}\n            sx={[\n                {\n                    backgroundColor: \"transparent\",\n                    display: \"flex\",\n                    flexDirection: \"row-reverse\",\n                    alignSelf: \"baseline\",\n                    textTransform: \"none\",\n                    // force it outside the select box\n                    position: \"initial\",\n                    transform: \"translateX(0px) translateY(0px)\",\n                    fontFamily: \"Rubik\",\n                    fontWeight: 500,\n                    fontSize: 14,\n                    color: \"#333\",\n                    \"& .MuiInputLabel-asterisk\": {\n                        color: \"#AE1C1C !important\",\n                        marginRight: \"3px !important\", //this was\n                    },\n                },\n                required && {\n                    transform: \"translateX(-12px) translateY(0px)\",\n                    \"& .MuiInputLabel-asterisk\": {\n                        color: \"#D92F2\",\n                        marginRight: \"3px !important\", //this was\n                    },\n                },\n                disabled && {\n                    color: \"#333333 !important\",\n                },\n                error && {\n                    color: \"#AE1C1C !important\",\n                },\n            ]}\n            {...rest}\n        />\n    );\n};\nLabel.propTypes = {\n    required: PropTypes.bool.isRequired,\n    disabled: PropTypes.bool.isRequired,\n    error: PropTypes.bool,\n};\nexport default Label;\n","import React from \"react\";\nimport { FormControl, TextareaAutosize } from \"@mui/material\";\nimport InputLabel from \"../InputLabel\";\nimport PropTypes from \"prop-types\";\n\nconst ReadOnlyTextField = ({\n    id,\n    required = false,\n    disabled = false,\n    label,\n    ...rest\n}) => {\n    return (\n        <FormControl fullWidth>\n            <InputLabel\n                disabled={disabled}\n                shrink\n                required={required}\n                htmlFor={id}\n                sx={[\n                    {\n                        backgroundColor: \"transparent\",\n                        display: \"flex\",\n                        flexDirection: \"row-reverse\",\n                        alignSelf: \"baseline\",\n                        textTransform: \"none\",\n                        // force it outside the select box\n                        position: \"initial\",\n                        transform: \"translateX(0px) translateY(0px)\",\n                        fontFamily: \"Rubik\",\n                        fontWeight: 500,\n                        fontSize: 14,\n                        color: \"#333\",\n                        \"& .MuiInputLabel-asterisk\": {\n                            color: \"#AE1C1C !important\",\n                            marginRight: \"3px !important\",\n                        },\n                    },\n                    required && {\n                        transform: \"translateX(-12px) translateY(0px)\",\n                        \"& .MuiInputLabel-asterisk\": {\n                            color: \"#D92F2\",\n                            marginRight: \"3px !important\", //this was\n                        },\n                    },\n                    disabled && {\n                        color: \"rgba(0,0,0,0.6)\",\n                    },\n                ]}\n            >\n                {label}\n            </InputLabel>\n            <TextareaAutosize\n                style={{\n                    color: \"#333\",\n                    fontFamily: \"Rubik\",\n                    fontSize: \"14px\",\n                    fontStyle: \"normal\",\n                    fontWeight: 400,\n                    lineHeight: \"24px\",\n                    border: \"none\",\n                    resize: \"none\",\n                    padding: \"0px 0px\",\n                    outline: \"none\",\n                    boxShadow: \"none\",\n                }}\n                readOnly={true}\n                disableUnderline={true}\n                label={null}\n                disabled={disabled}\n                id={id}\n                {...rest}\n                value={\n                    rest?.value == null ||\n                    rest.value === \"\" ||\n                    (typeof rest.value === \"object\" &&\n                        Object.keys(rest.value).length === 0)\n                        ? \"-\"\n                        : rest.value\n                }\n            />\n        </FormControl>\n    );\n};\n\nReadOnlyTextField.propTypes = {\n    id: PropTypes.string,\n    required: PropTypes.bool,\n    disabled: PropTypes.bool,\n    placeholder: PropTypes.string, // expects placeholder objects of { name: value } and inserts into the render item function.\n    label: PropTypes.string,\n};\nexport default ReadOnlyTextField;\n","import React from \"react\";\nimport { TimePicker } from \"@mui/x-date-pickers\";\nimport { LocalizationProvider } from \"@mui/x-date-pickers/LocalizationProvider\";\nimport { AdapterDayjs } from \"@mui/x-date-pickers/AdapterDayjs\";\nimport InputLabel from \"../InputLabel\";\nimport { kebabCase } from \"lodash\";\nimport PropTypes from \"prop-types\";\nimport dayjs from \"dayjs\";\nimport { ReadOnlyTextField } from \"../ReadOnlyTextField\";\n\nconst timeFieldStyle = {\n    width: \"170px\",\n    height: 40,\n    marginTop: \"8px\",\n    \"& .MuiOutlinedInput-notchedOutline\": {\n        borderRadius: \"3px\",\n        borderColor: \"#8C8C8C\",\n        \"& legend\": {\n            width: 0,\n        },\n    },\n    \"& .MuiOutlinedInput-root\": {\n        \"&&\": {\n            borderRadius: \"3px\",\n        },\n    },\n    \"& .MuiInputBase-input\": {\n        color: \"#333333\",\n        fontFamily: \"Rubik\",\n        fontSize: 14,\n        borderRadius: \"3px\",\n        padding: \"9px\",\n        Width: \"170px\",\n        \"&::placeholder\": {\n            opacity: 1,\n            color: \"#717171\",\n            fontFamily: \"Rubik\",\n            fontSize: 14,\n        },\n    },\n};\n\nconst TimeField = ({\n    id,\n    label,\n    value,\n    handleTimeChange,\n    readOnly,\n    disabled,\n    required,\n    error,\n    ...rest\n}) => {\n        if (readOnly) {\n        return (\n            <ReadOnlyTextField\n                required={required}\n                label={label}\n                id={id}\n                size=\"small\"\n                {...rest}\n                value={value ? dayjs.utc(value).format(\"HH:mm:ss a\") : \"-\"}\n            />\n        );\n    }\n    return (\n        <LocalizationProvider dateAdapter={AdapterDayjs}>\n            <InputLabel\n                data-testid={`${kebabCase(label)}`}\n                style={{ marginBottom: 0, height: 16 }}\n                sx={[\n                    {\n                        backgroundColor: \"transparent\",\n                        textTransform: \"none\",\n                        height: 17,\n                        left: 0,\n                        right: 0,\n                        top: 0,\n                        fontFamily: \"Rubik\",\n                        fontStyle: \"normal\",\n                        fontWeight: 500,\n                        fontSize: 14,\n                        color: \"#333333\",\n                    },\n                ]}\n                required={required}\n                disabled={disabled}\n                error={error}\n            >\n                {`${label}`}\n            </InputLabel>\n            <TimePicker\n                sx={timeFieldStyle}\n                disabled={disabled}\n                value={value ? value : null}\n                onChange={handleTimeChange}\n                slotProps={{\n                    textField: {\n                        id: \"time\",\n                    },\n                }}\n                {...rest}\n            />\n        </LocalizationProvider>\n    );\n};\n\nTimeField.propTypes = {\n    id: PropTypes.string,\n    label: PropTypes.string.isRequired,\n    value: PropTypes.object,\n    handleTimeChange: PropTypes.func.isRequired,\n    disabled: PropTypes.bool,\n    required: PropTypes.bool,\n    readOnly: PropTypes.bool,\n    error: PropTypes.string,\n};\n\nexport default TimeField;\n","(function (global, factory) {\n  if (typeof define === \"function\" && define.amd) {\n    define([\"exports\", \"react\", \"./TimeField\", \"@storybook/addon-knobs\"], factory);\n  } else if (typeof exports !== \"undefined\") {\n    factory(exports, require(\"react\"), require(\"./TimeField\"), require(\"@storybook/addon-knobs\"));\n  } else {\n    var mod = {\n      exports: {}\n    };\n    factory(mod.exports, global.react, global.TimeField, global.addonKnobs);\n    global.TimeFieldStories = mod.exports;\n  }\n})(typeof globalThis !== \"undefined\" ? globalThis : typeof self !== \"undefined\" ? self : this, function (_exports, _react, _TimeField, _addonKnobs) {\n  \"use strict\";\n\n  Object.defineProperty(_exports, \"__esModule\", {\n    value: true\n  });\n  _exports.default = _exports.TimeFieldComponent = void 0;\n  _react = _interopRequireWildcard(_react);\n  _TimeField = _interopRequireDefault(_TimeField);\n  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }\n  function _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n  var _default = _exports.default = {\n    title: \"TimeField\",\n    component: _TimeField.default,\n    decorators: [_addonKnobs.withKnobs]\n  };\n  const TimeFieldComponent = args => {\n    const [value, setValue] = (0, _react.useState)(\"\");\n    const handleTimeChange = (newValue, v) => {\n      console.log(\"Time changed: newValue = \", newValue);\n      setValue(newValue);\n    };\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: \"qpp-u-padding--16\"\n    }, /*#__PURE__*/_react.default.createElement(_TimeField.default, {\n      disabled: false,\n      label: \"Result Time\",\n      handleTimeChange: handleTimeChange,\n      value: value\n    }));\n  };\n  _exports.TimeFieldComponent = TimeFieldComponent;\n});"],"names":[],"sourceRoot":""}

package/storybook-static/Toast-Toast-stories.9226d3b7.iframe.bundle.js

@@ -0,0 +1,3 @@
+/*! For license information please see Toast-Toast-stories.9226d3b7.iframe.bundle.js.LICENSE.txt */
+(self.webpackChunk_madie_madie_design_system=self.webpackChunk_madie_madie_design_system||[]).push([[3186],{"./node_modules/@babel/runtime/helpers/interopRequireDefault.js"(module){module.exports=function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}},module.exports.__esModule=!0,module.exports.default=module.exports},"./node_modules/@mui/icons-material/Cancel.js"(__unused_webpack_module,exports,__webpack_require__){"use strict";var _interopRequireDefault=__webpack_require__("./node_modules/@babel/runtime/helpers/interopRequireDefault.js").default;Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _createSvgIcon=_interopRequireDefault(__webpack_require__("./node_modules/@mui/icons-material/utils/createSvgIcon.js")),_jsxRuntime=__webpack_require__("./node_modules/react/jsx-runtime.js");exports.default=(0,_createSvgIcon.default)((0,_jsxRuntime.jsx)("path",{d:"M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2m5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12z"}),"Cancel")},"./node_modules/@mui/icons-material/CheckCircle.js"(__unused_webpack_module,exports,__webpack_require__){"use strict";var _interopRequireDefault=__webpack_require__("./node_modules/@babel/runtime/helpers/interopRequireDefault.js").default;Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _createSvgIcon=_interopRequireDefault(__webpack_require__("./node_modules/@mui/icons-material/utils/createSvgIcon.js")),_jsxRuntime=__webpack_require__("./node_modules/react/jsx-runtime.js");exports.default=(0,_createSvgIcon.default)((0,_jsxRuntime.jsx)("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8z"}),"CheckCircle")},"./node_modules/@mui/icons-material/Clear.js"(__unused_webpack_module,exports,__webpack_require__){"use strict";var _interopRequireDefault=__webpack_require__("./node_modules/@babel/runtime/helpers/interopRequireDefault.js").default;Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _createSvgIcon=_interopRequireDefault(__webpack_require__("./node_modules/@mui/icons-material/utils/createSvgIcon.js")),_jsxRuntime=__webpack_require__("./node_modules/react/jsx-runtime.js");exports.default=(0,_createSvgIcon.default)((0,_jsxRuntime.jsx)("path",{d:"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"}),"Clear")},"./node_modules/@mui/icons-material/Error.js"(__unused_webpack_module,exports,__webpack_require__){"use strict";var _interopRequireDefault=__webpack_require__("./node_modules/@babel/runtime/helpers/interopRequireDefault.js").default;Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _createSvgIcon=_interopRequireDefault(__webpack_require__("./node_modules/@mui/icons-material/utils/createSvgIcon.js")),_jsxRuntime=__webpack_require__("./node_modules/react/jsx-runtime.js");exports.default=(0,_createSvgIcon.default)((0,_jsxRuntime.jsx)("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-2h2zm0-4h-2V7h2z"}),"Error")},"./node_modules/@mui/icons-material/Info.js"(__unused_webpack_module,exports,__webpack_require__){"use strict";var _interopRequireDefault=__webpack_require__("./node_modules/@babel/runtime/helpers/interopRequireDefault.js").default;Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _createSvgIcon=_interopRequireDefault(__webpack_require__("./node_modules/@mui/icons-material/utils/createSvgIcon.js")),_jsxRuntime=__webpack_require__("./node_modules/react/jsx-runtime.js");exports.default=(0,_createSvgIcon.default)((0,_jsxRuntime.jsx)("path",{d:"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-6h2zm0-8h-2V7h2z"}),"Info")},"./node_modules/@mui/icons-material/utils/createSvgIcon.js"(__unused_webpack_module,exports,__webpack_require__){"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return _utils.createSvgIcon}});var _utils=__webpack_require__("./node_modules/@mui/material/utils/index.js")},"./components/Toast/index.jsx"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/@mui/icons-material/Error.js"),__webpack_require__("./node_modules/@mui/icons-material/Info.js"),__webpack_require__("./node_modules/@mui/icons-material/Cancel.js"),__webpack_require__("./node_modules/@mui/icons-material/CheckCircle.js"),__webpack_require__("./node_modules/@mui/material/index.js"),__webpack_require__("./node_modules/@mui/icons-material/Clear.js"),__webpack_require__("./node_modules/classnames/index.js"),__webpack_require__("./node_modules/prop-types/index.js")],__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_Error,_Info,_Cancel,_CheckCircle,_material,_Clear,_classnames,_propTypes){"use strict";Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_react=_interopRequireDefault(_react),_Error=_interopRequireDefault(_Error),_Info=_interopRequireDefault(_Info),_Cancel=_interopRequireDefault(_Cancel),_CheckCircle=_interopRequireDefault(_CheckCircle),_Clear=_interopRequireDefault(_Clear),_classnames=_interopRequireDefault(_classnames),_propTypes=_interopRequireDefault(_propTypes);var _excluded=["toastType","open","message","canClose","onClose","autoHideDuration","testId","toastKey","toastProps","closeButtonProps"];function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=_objectWithoutPropertiesLoose(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r<n.length;r++)o=n[r],-1===t.indexOf(o)&&{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(-1!==e.indexOf(n))continue;t[n]=r[n]}return t}var Toast=function Toast(_ref){var _ref$toastType=_ref.toastType,toastType=void 0===_ref$toastType?"warning":_ref$toastType,_ref$open=_ref.open,open=void 0===_ref$open||_ref$open,message=_ref.message,_ref$canClose=_ref.canClose,canClose=void 0===_ref$canClose||_ref$canClose,onClose=_ref.onClose,autoHideDuration=_ref.autoHideDuration,testId=_ref.testId,toastKey=_ref.toastKey,toastProps=_ref.toastProps,closeButtonProps=_ref.closeButtonProps,rest=_objectWithoutProperties(_ref,_excluded),Icon={warning:_Error.default,info:_Info.default,danger:_Cancel.default,success:_CheckCircle.default}[toastType],toastClass=(0,_classnames.default)("toast",toastType),iconClass=(0,_classnames.default)("alert-icon",toastType);return _react.default.createElement(_material.Snackbar,_extends({key:toastKey||void 0,anchorOrigin:{vertical:"top",horizontal:"center"},autoHideDuration,open,onClose,message:_react.default.createElement("div",_extends({className:toastClass},toastProps),_react.default.createElement(Icon,{className:iconClass}),_react.default.createElement("div",{id:"message","data-testid":testId},message),canClose&&_react.default.createElement(_material.IconButton,_extends({onClick:onClose,sx:{marginLeft:"auto","&:after":{content:"''",position:"absolute",left:"0px",width:"1px",height:"40px",backgroundColor:"#B0B0B0",pointerEvents:"none"}}},closeButtonProps),_react.default.createElement(_Clear.default,{sx:{color:"#242424"}}))),sx:{overflow:"hidden","& .MuiPaper-root":{backgroundColor:"#fff",padding:0},"& .MuiSnackbar-root":{overflow:"hidden",borderRadius:4},"& .MuiSnackbarContent-message":{padding:0,flexGrow:1,".messageCont":{display:"flex",flexDirection:"row",flexGrow:1,justifyContent:"space-between",div:{display:"flex"}}}}},rest))};Toast.propTypes={toastType:_propTypes.default.string,open:_propTypes.default.bool,message:_propTypes.default.node,canClose:_propTypes.default.bool,onClose:_propTypes.default.func,autoHideDuration:_propTypes.default.number,testId:_propTypes.default.string,toastKey:_propTypes.default.string,toastProps:_propTypes.default.object,closeButtonProps:_propTypes.default.object},_exports.default=Toast,Toast.__docgenInfo={description:"",methods:[],displayName:"Toast",props:{toastType:{defaultValue:{value:'"warning"',computed:!1},description:"",type:{name:"string"},required:!1},open:{defaultValue:{value:"true",computed:!1},description:"",type:{name:"bool"},required:!1},canClose:{defaultValue:{value:"true",computed:!1},description:"",type:{name:"bool"},required:!1},message:{description:"",type:{name:"node"},required:!1},onClose:{description:"",type:{name:"func"},required:!1},autoHideDuration:{description:"",type:{name:"number"},required:!1},testId:{description:"",type:{name:"string"},required:!1},toastKey:{description:"",type:{name:"string"},required:!1},toastProps:{description:"",type:{name:"object"},required:!1},closeButtonProps:{description:"",type:{name:"object"},required:!1}}}},void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof __WEBPACK_AMD_DEFINE_FACTORY__?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./components/Toast/Toast.stories.js"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/@storybook/addon-knobs/dist/index.js"),__webpack_require__("./components/Toast/index.jsx")],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_addonKnobs,_index){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=_exports.WarningToast=_exports.SuccessToast=_exports.InfoToast=_exports.DangerToast=void 0,_react=_interopRequireWildcard(_react),_index=_interopRequireDefault(_index),_exports.default={title:"Toast",component:_index.default,decorators:[_addonKnobs.withKnobs]};const SuccessToast=()=>{const[toastOpen,setToastOpen]=(0,_react.useState)(!1);return _react.default.createElement("div",{style:{height:"100vh",width:"100vw",backgroundColor:"#242424"}},_react.default.createElement("button",{onClick:()=>setToastOpen(!0),style:{position:"absolute",top:"50%",left:"calc(50% - 80px)"}},"Simulate Success"),_react.default.createElement(_index.default,{toastKey:"toast-key",testId:"success-toast",toastType:"success",open:toastOpen,message:"An action has successfully been completed",onClose:()=>setToastOpen(!1),autoHideDuration:3e3}))};_exports.SuccessToast=SuccessToast;const WarningToast=()=>{const[toastOpen,setToastOpen]=(0,_react.useState)(!1);return _react.default.createElement("div",{style:{height:"100vh",width:"100vw",backgroundColor:"#242424"}},_react.default.createElement("button",{onClick:()=>setToastOpen(!0),style:{position:"absolute",top:"50%",left:"calc(50% - 80px)"}},"Simulate Warning"),_react.default.createElement(_index.default,{toastKey:"toast-key",toastType:"warning",testId:"warning-toast",open:toastOpen,message:"Something has gone wrong. consider fixing before continuing",onClose:()=>setToastOpen(!1),autoHideDuration:3e3}))};_exports.WarningToast=WarningToast;const InfoToast=()=>{const[toastOpen,setToastOpen]=(0,_react.useState)(!1);return _react.default.createElement("div",{style:{height:"100vh",width:"100vw",backgroundColor:"#242424"}},_react.default.createElement("button",{onClick:()=>setToastOpen(!0),style:{position:"absolute",top:"50%",left:"calc(50% - 80px)"}},"Simulate Info"),_react.default.createElement(_index.default,{toastKey:"toast-key",toastType:"info",testId:"info-toast",open:toastOpen,message:"Some useful information",onClose:()=>setToastOpen(!1),autoHideDuration:3e3}))};_exports.InfoToast=InfoToast;const DangerToast=()=>{const[toastOpen,setToastOpen]=(0,_react.useState)(!1);return _react.default.createElement("div",{style:{height:"100vh",width:"100vw",backgroundColor:"#242424"}},_react.default.createElement("button",{onClick:()=>setToastOpen(!0),style:{position:"absolute",top:"50%",left:"calc(50% - 80px)"}},"Simulate Danger"),_react.default.createElement(_index.default,{toastKey:"toast-key",toastType:"danger",testId:"danger-toast",open:toastOpen,message:"Something has gone wrong. Please try again",onClose:()=>setToastOpen(!1),autoHideDuration:3e3}))};_exports.DangerToast=DangerToast})?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./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];arg&&(classes=appendClass(classes,parseValue(arg)))}return classes}function parseValue(arg){if("string"==typeof arg||"number"==typeof arg)return arg;if("object"!=typeof arg)return"";if(Array.isArray(arg))return classNames.apply(null,arg);if(arg.toString!==Object.prototype.toString&&!arg.toString.toString().includes("[native code]"))return arg.toString();var classes="";for(var key in arg)hasOwn.call(arg,key)&&arg[key]&&(classes=appendClass(classes,key));return classes}function appendClass(value,newClass){return newClass?value?value+" "+newClass:value+newClass:value}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__)}()}}]);
+//# sourceMappingURL=Toast-Toast-stories.9226d3b7.iframe.bundle.js.map

package/storybook-static/Toast-Toast-stories.9226d3b7.iframe.bundle.js.LICENSE.txt

@@ -0,0 +1,5 @@
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/

package/storybook-static/Toast-Toast-stories.9226d3b7.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast-Toast-stories.8c662dfd.iframe.bundle.js","mappings":";AAKA","sources":["webpack://@madie/madie-design-system/./node_modules/@babel/runtime/helpers/interopRequireDefault.js","webpack://@madie/madie-design-system/./node_modules/@mui/icons-material/Cancel.js","webpack://@madie/madie-design-system/./node_modules/@mui/icons-material/CheckCircle.js","webpack://@madie/madie-design-system/./node_modules/@mui/icons-material/Clear.js","webpack://@madie/madie-design-system/./node_modules/@mui/icons-material/Error.js","webpack://@madie/madie-design-system/./node_modules/@mui/icons-material/Info.js","webpack://@madie/madie-design-system/./node_modules/@mui/icons-material/utils/createSvgIcon.js","webpack://@madie/madie-design-system/./components/Toast/index.jsx","webpack://@madie/madie-design-system/./components/Toast/Toast.stories.js","webpack://@madie/madie-design-system/./node_modules/classnames/index.js"],"sourcesContent":["function _interopRequireDefault(e) {\n  return e && e.__esModule ? e : {\n    \"default\": e\n  };\n}\nmodule.exports = _interopRequireDefault, module.exports.__esModule = true, module.exports[\"default\"] = module.exports;","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\").default;\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)(/*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n  d: \"M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2m5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12z\"\n}), 'Cancel');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\").default;\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)(/*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n  d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8z\"\n}), 'CheckCircle');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\").default;\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)(/*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n  d: \"M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"\n}), 'Clear');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\").default;\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)(/*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n  d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-2h2zm0-4h-2V7h2z\"\n}), 'Error');","\"use strict\";\n\"use client\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\").default;\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\nvar _createSvgIcon = _interopRequireDefault(require(\"./utils/createSvgIcon\"));\nvar _jsxRuntime = require(\"react/jsx-runtime\");\nvar _default = exports.default = (0, _createSvgIcon.default)(/*#__PURE__*/(0, _jsxRuntime.jsx)(\"path\", {\n  d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2m1 15h-2v-6h2zm0-8h-2V7h2z\"\n}), 'Info');","\"use strict\";\n'use client';\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nObject.defineProperty(exports, \"default\", {\n  enumerable: true,\n  get: function () {\n    return _utils.createSvgIcon;\n  }\n});\nvar _utils = require(\"@mui/material/utils\");","import React from \"react\";\n\nimport ErrorIcon from \"@mui/icons-material/Error\"; // warning\nimport InfoIcon from \"@mui/icons-material/Info\"; // info\nimport CancelIcon from \"@mui/icons-material/Cancel\"; // error\nimport CheckCircleIcon from \"@mui/icons-material/CheckCircle\"; //success\n\nimport { IconButton, Snackbar } from \"@mui/material\";\nimport ClearIcon from \"@mui/icons-material/Clear\";\n\nimport classNames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nconst Toast = ({\n    toastType = \"warning\",\n    open = true,\n    message,\n    canClose = true,\n    onClose,\n    autoHideDuration,\n    testId,\n    toastKey,\n    toastProps, // props to pass to outer component\n    closeButtonProps, // props to pass to close button\n    ...rest\n}) => {\n    // we have four states to render for\n    const typeSelect = {\n        warning: ErrorIcon,\n        info: InfoIcon,\n        danger: CancelIcon,\n        success: CheckCircleIcon,\n    };\n    const Icon = typeSelect[toastType];\n\n    const toastClass = classNames(\"toast\", toastType);\n    const iconClass = classNames(\"alert-icon\", toastType);\n\n    return (\n        <Snackbar\n            key={toastKey ? toastKey : undefined}\n            anchorOrigin={{ vertical: \"top\", horizontal: \"center\" }}\n            autoHideDuration={autoHideDuration}\n            open={open}\n            onClose={onClose}\n            message={\n                <div className={toastClass} {...toastProps}>\n                    <Icon className={iconClass} />\n                    <div id=\"message\" data-testid={testId}>\n                        {message}\n                    </div>\n                    {canClose && (\n                        <IconButton\n                            onClick={onClose}\n                            sx={{\n                                marginLeft: \"auto\",\n                                \"&:after\": {\n                                    content: `''`,\n                                    position: \"absolute\",\n                                    left: \"0px\",\n                                    width: \"1px\",\n                                    height: \"40px\",\n                                    backgroundColor: \"#B0B0B0\",\n                                    pointerEvents: \"none\",\n                                },\n                            }}\n                            {...closeButtonProps}\n                        >\n                            <ClearIcon sx={{ color: \"#242424\" }} />\n                        </IconButton>\n                    )}\n                </div>\n            }\n            sx={{\n                overflow: \"hidden\",\n                // borderRadius: 4,\n                \"& .MuiPaper-root\": {\n                    backgroundColor: \"#fff\",\n                    padding: 0,\n                },\n                \"& .MuiSnackbar-root\": {\n                    overflow: \"hidden\",\n                    borderRadius: 4,\n                },\n                \"& .MuiSnackbarContent-message\": {\n                    padding: 0,\n                    flexGrow: 1,\n                    \".messageCont\": {\n                        display: \"flex\",\n                        flexDirection: \"row\",\n                        flexGrow: 1,\n                        justifyContent: \"space-between\",\n                        div: {\n                            display: \"flex\",\n                        },\n                    },\n                },\n            }}\n            {...rest}\n        />\n    );\n};\n\nToast.propTypes = {\n    toastType: PropTypes.string,\n    open: PropTypes.bool,\n    message: PropTypes.node,\n    canClose: PropTypes.bool,\n    onClose: PropTypes.func,\n    autoHideDuration: PropTypes.number,\n    testId: PropTypes.string,\n    toastKey: PropTypes.string,\n    toastProps: PropTypes.object,\n    closeButtonProps: PropTypes.object,\n};\n\nexport default Toast;\n","(function (global, factory) {\n  if (typeof define === \"function\" && define.amd) {\n    define([\"exports\", \"react\", \"@storybook/addon-knobs\", \"./index\"], factory);\n  } else if (typeof exports !== \"undefined\") {\n    factory(exports, require(\"react\"), require(\"@storybook/addon-knobs\"), require(\"./index\"));\n  } else {\n    var mod = {\n      exports: {}\n    };\n    factory(mod.exports, global.react, global.addonKnobs, global.index);\n    global.ToastStories = mod.exports;\n  }\n})(typeof globalThis !== \"undefined\" ? globalThis : typeof self !== \"undefined\" ? self : this, function (_exports, _react, _addonKnobs, _index) {\n  \"use strict\";\n\n  Object.defineProperty(_exports, \"__esModule\", {\n    value: true\n  });\n  _exports.default = _exports.WarningToast = _exports.SuccessToast = _exports.InfoToast = _exports.DangerToast = void 0;\n  _react = _interopRequireWildcard(_react);\n  _index = _interopRequireDefault(_index);\n  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }\n  function _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n  var _default = _exports.default = {\n    title: \"Toast\",\n    component: _index.default,\n    decorators: [_addonKnobs.withKnobs]\n  };\n  const SuccessToast = () => {\n    const [toastOpen, setToastOpen] = (0, _react.useState)(false);\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        height: \"100vh\",\n        width: \"100vw\",\n        backgroundColor: \"#242424\"\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"button\", {\n      onClick: () => setToastOpen(true),\n      style: {\n        position: \"absolute\",\n        top: \"50%\",\n        left: \"calc(50% - 80px)\"\n      }\n    }, \"Simulate Success\"), /*#__PURE__*/_react.default.createElement(_index.default, {\n      toastKey: \"toast-key\",\n      testId: \"success-toast\",\n      toastType: \"success\",\n      open: toastOpen,\n      message: \"An action has successfully been completed\",\n      onClose: () => setToastOpen(false),\n      autoHideDuration: 3000\n    }));\n  };\n  _exports.SuccessToast = SuccessToast;\n  const WarningToast = () => {\n    const [toastOpen, setToastOpen] = (0, _react.useState)(false);\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        height: \"100vh\",\n        width: \"100vw\",\n        backgroundColor: \"#242424\"\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"button\", {\n      onClick: () => setToastOpen(true),\n      style: {\n        position: \"absolute\",\n        top: \"50%\",\n        left: \"calc(50% - 80px)\"\n      }\n    }, \"Simulate Warning\"), /*#__PURE__*/_react.default.createElement(_index.default, {\n      toastKey: \"toast-key\",\n      toastType: \"warning\",\n      testId: \"warning-toast\",\n      open: toastOpen,\n      message: \"Something has gone wrong. consider fixing before continuing\",\n      onClose: () => setToastOpen(false),\n      autoHideDuration: 3000\n    }));\n  };\n  _exports.WarningToast = WarningToast;\n  const InfoToast = () => {\n    const [toastOpen, setToastOpen] = (0, _react.useState)(false);\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        height: \"100vh\",\n        width: \"100vw\",\n        backgroundColor: \"#242424\"\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"button\", {\n      onClick: () => setToastOpen(true),\n      style: {\n        position: \"absolute\",\n        top: \"50%\",\n        left: \"calc(50% - 80px)\"\n      }\n    }, \"Simulate Info\"), /*#__PURE__*/_react.default.createElement(_index.default, {\n      toastKey: \"toast-key\",\n      toastType: \"info\",\n      testId: \"info-toast\",\n      open: toastOpen,\n      message: \"Some useful information\",\n      onClose: () => setToastOpen(false),\n      autoHideDuration: 3000\n    }));\n  };\n  _exports.InfoToast = InfoToast;\n  const DangerToast = () => {\n    const [toastOpen, setToastOpen] = (0, _react.useState)(false);\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      style: {\n        height: \"100vh\",\n        width: \"100vw\",\n        backgroundColor: \"#242424\"\n      }\n    }, /*#__PURE__*/_react.default.createElement(\"button\", {\n      onClick: () => setToastOpen(true),\n      style: {\n        position: \"absolute\",\n        top: \"50%\",\n        left: \"calc(50% - 80px)\"\n      }\n    }, \"Simulate Danger\"), /*#__PURE__*/_react.default.createElement(_index.default, {\n      toastKey: \"toast-key\",\n      toastType: \"danger\",\n      testId: \"danger-toast\",\n      open: toastOpen,\n      message: \"Something has gone wrong. Please try again\",\n      onClose: () => setToastOpen(false),\n      autoHideDuration: 3000\n    }));\n  };\n  _exports.DangerToast = DangerToast;\n});","/*!\n\tCopyright (c) 2018 Jed Watson.\n\tLicensed under the MIT License (MIT), see\n\thttp://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = '';\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (arg) {\n\t\t\t\tclasses = appendClass(classes, parseValue(arg));\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction parseValue (arg) {\n\t\tif (typeof arg === 'string' || typeof arg === 'number') {\n\t\t\treturn arg;\n\t\t}\n\n\t\tif (typeof arg !== 'object') {\n\t\t\treturn '';\n\t\t}\n\n\t\tif (Array.isArray(arg)) {\n\t\t\treturn classNames.apply(null, arg);\n\t\t}\n\n\t\tif (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {\n\t\t\treturn arg.toString();\n\t\t}\n\n\t\tvar classes = '';\n\n\t\tfor (var key in arg) {\n\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\tclasses = appendClass(classes, key);\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction appendClass (value, newClass) {\n\t\tif (!newClass) {\n\t\t\treturn value;\n\t\t}\n\t\n\t\tif (value) {\n\t\t\treturn value + ' ' + newClass;\n\t\t}\n\t\n\t\treturn value + newClass;\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n"],"names":[],"sourceRoot":""}

package/storybook-static/Toggle-Toggle-stories.dabdd09d.iframe.bundle.js

@@ -0,0 +1,2 @@
+(self.webpackChunk_madie_madie_design_system=self.webpackChunk_madie_madie_design_system||[]).push([[1308],{"./components/Toggle/Toggle.jsx"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/prop-types/index.js"),__webpack_require__("./node_modules/@mui/material/index.js")],__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_propTypes,_material){"use strict";Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_react=_interopRequireWildcard(_react),_propTypes=_interopRequireDefault(_propTypes);var _excluded=["checked","className","defaultChecked","disabled","id","label","onChange"];function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=_typeof(e)&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(var _t in e)"default"!==_t&&{}.hasOwnProperty.call(e,_t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,_t))&&(i.get||i.set)?o(f,_t,i):f[_t]=e[_t]);return f})(e,t)}function ownKeys(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);r&&(o=o.filter(function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable})),t.push.apply(t,o)}return t}function _objectSpread(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{};r%2?ownKeys(Object(t),!0).forEach(function(r){_defineProperty(e,r,t[r])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):ownKeys(Object(t)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})}return e}function _defineProperty(e,r,t){return(r=_toPropertyKey(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function _toPropertyKey(t){var i=_toPrimitive(t,"string");return"symbol"==_typeof(i)?i:i+""}function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(t)}function _slicedToArray(r,e){return _arrayWithHoles(r)||_iterableToArrayLimit(r,e)||_unsupportedIterableToArray(r,e)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(r,a){if(r){if("string"==typeof r)return _arrayLikeToArray(r,a);var t={}.toString.call(r).slice(8,-1);return"Object"===t&&r.constructor&&(t=r.constructor.name),"Map"===t||"Set"===t?Array.from(r):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?_arrayLikeToArray(r,a):void 0}}function _arrayLikeToArray(r,a){(null==a||a>r.length)&&(a=r.length);for(var e=0,n=Array(a);e<a;e++)n[e]=r[e];return n}function _iterableToArrayLimit(r,l){var t=null==r?null:"undefined"!=typeof Symbol&&r[Symbol.iterator]||r["@@iterator"];if(null!=t){var e,n,i,u,a=[],f=!0,o=!1;try{if(i=(t=t.call(r)).next,0===l){if(Object(t)!==t)return;f=!1}else for(;!(f=(e=i.call(t)).done)&&(a.push(e.value),a.length!==l);f=!0);}catch(r){o=!0,n=r}finally{try{if(!f&&null!=t.return&&(u=t.return(),Object(u)!==u))return}finally{if(o)throw n}}return a}}function _arrayWithHoles(r){if(Array.isArray(r))return r}function _objectWithoutProperties(e,t){if(null==e)return{};var o,r,i=_objectWithoutPropertiesLoose(e,t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);for(r=0;r<n.length;r++)o=n[r],-1===t.indexOf(o)&&{}.propertyIsEnumerable.call(e,o)&&(i[o]=e[o])}return i}function _objectWithoutPropertiesLoose(r,e){if(null==r)return{};var t={};for(var n in r)if({}.hasOwnProperty.call(r,n)){if(-1!==e.indexOf(n))continue;t[n]=r[n]}return t}var Toggle=function Toggle(_ref){var checked=_ref.checked,className=_ref.className,defaultChecked=_ref.defaultChecked,disabled=_ref.disabled,id=_ref.id,label=_ref.label,onChange=_ref.onChange,rest=_objectWithoutProperties(_ref,_excluded),_useState2=_slicedToArray((0,_react.useState)(defaultChecked),2),uncontrolledChecked=_useState2[0],setUncontrolledChecked=_useState2[1],isControlled=void 0!==checked,isChecked=isControlled?checked:uncontrolledChecked,classes=["qpp-c-toggle",disabled&&"qpp-c-toggle--disabled",className].filter(Boolean).join(" "),handleChange=function handleChange(event){var nextChecked=event.target.checked;isControlled||setUncontrolledChecked(nextChecked),onChange(event,nextChecked)};return _react.default.createElement(_material.FormControlLabel,{className:classes,control:_react.default.createElement(_material.Switch,{checked:isChecked,disabled,id,onChange:handleChange,slotProps:{input:_objectSpread({role:"switch"},rest)}}),label,sx:{color:"#515151",textTransform:"none"}})};Toggle.propTypes={checked:_propTypes.default.bool,className:_propTypes.default.string,defaultChecked:_propTypes.default.bool,disabled:_propTypes.default.bool,id:_propTypes.default.string.isRequired,label:_propTypes.default.node,onChange:_propTypes.default.func},Toggle.defaultProps={checked:void 0,className:"",defaultChecked:!1,disabled:!1,label:null,onChange:function onChange(){return null}},_exports.default=Toggle,Toggle.__docgenInfo={description:"",methods:[],displayName:"Toggle",props:{checked:{defaultValue:{value:"undefined",computed:!0},description:"",type:{name:"bool"},required:!1},className:{defaultValue:{value:'""',computed:!1},description:"",type:{name:"string"},required:!1},defaultChecked:{defaultValue:{value:"false",computed:!1},description:"",type:{name:"bool"},required:!1},disabled:{defaultValue:{value:"false",computed:!1},description:"",type:{name:"bool"},required:!1},label:{defaultValue:{value:"null",computed:!1},description:"",type:{name:"node"},required:!1},onChange:{defaultValue:{value:"() => null",computed:!1},description:"",type:{name:"func"},required:!1},id:{description:"",type:{name:"string"},required:!0}}}},void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof __WEBPACK_AMD_DEFINE_FACTORY__?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./components/Toggle/Toggle.stories.jsx"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./components/Toggle/Toggle.jsx")],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_Toggle){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=_exports.Disabled=_exports.Default=void 0,_react=_interopRequireWildcard(_react),_Toggle=_interopRequireDefault(_Toggle),_exports.default={title:"Toggle",component:_Toggle.default};const Default=()=>{const[checked,setChecked]=(0,_react.useState)(!1);return _react.default.createElement("div",{className:"qpp-u-padding--16"},_react.default.createElement(_Toggle.default,{checked,id:"default-toggle",label:"Toggle",onChange:(event,nextChecked)=>setChecked(nextChecked)}))};_exports.Default=Default;const Disabled=()=>_react.default.createElement("div",{className:"qpp-u-padding--16"},_react.default.createElement(_Toggle.default,{defaultChecked:!0,disabled:!0,id:"disabled-toggle",label:"Toggle"}));_exports.Disabled=Disabled})?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./node_modules/prop-types/factoryWithThrowingShims.js"(module,__unused_webpack_exports,__webpack_require__){"use strict";var ReactPropTypesSecret=__webpack_require__("./node_modules/prop-types/lib/ReactPropTypesSecret.js");function emptyFunction(){}function emptyFunctionWithReset(){}emptyFunctionWithReset.resetWarningCache=emptyFunction,module.exports=function(){function shim(props,propName,componentName,location,propFullName,secret){if(secret!==ReactPropTypesSecret){var err=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw err.name="Invariant Violation",err}}function getShim(){return shim}shim.isRequired=shim;var ReactPropTypes={array:shim,bigint:shim,bool:shim,func:shim,number:shim,object:shim,string:shim,symbol:shim,any:shim,arrayOf:getShim,element:shim,elementType:shim,instanceOf:getShim,node:shim,objectOf:getShim,oneOf:getShim,oneOfType:getShim,shape:getShim,exact:getShim,checkPropTypes:emptyFunctionWithReset,resetWarningCache:emptyFunction};return ReactPropTypes.PropTypes=ReactPropTypes,ReactPropTypes}},"./node_modules/prop-types/index.js"(module,__unused_webpack_exports,__webpack_require__){module.exports=__webpack_require__("./node_modules/prop-types/factoryWithThrowingShims.js")()},"./node_modules/prop-types/lib/ReactPropTypesSecret.js"(module){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"}}]);
+//# sourceMappingURL=Toggle-Toggle-stories.dabdd09d.iframe.bundle.js.map

package/storybook-static/Toggle-Toggle-stories.dabdd09d.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle-Toggle-stories.9fa93d42.iframe.bundle.js","mappings":"AAIA","sources":["webpack://@madie/madie-design-system/./components/Toggle/Toggle.jsx","webpack://@madie/madie-design-system/./components/Toggle/Toggle.stories.jsx","webpack://@madie/madie-design-system/./node_modules/prop-types/factoryWithThrowingShims.js","webpack://@madie/madie-design-system/./node_modules/prop-types/index.js","webpack://@madie/madie-design-system/./node_modules/prop-types/lib/ReactPropTypesSecret.js"],"sourcesContent":["import React, { useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { FormControlLabel, Switch } from \"@mui/material\";\n\nconst Toggle = ({\n    checked,\n    className,\n    defaultChecked,\n    disabled,\n    id,\n    label,\n    onChange,\n    ...rest\n}) => {\n    const [uncontrolledChecked, setUncontrolledChecked] =\n        useState(defaultChecked);\n    const isControlled = checked !== undefined;\n    const isChecked = isControlled ? checked : uncontrolledChecked;\n    const classes = [\n        \"qpp-c-toggle\",\n        disabled && \"qpp-c-toggle--disabled\",\n        className,\n    ]\n        .filter(Boolean)\n        .join(\" \");\n\n    const handleChange = (event) => {\n        const nextChecked = event.target.checked;\n\n        if (!isControlled) {\n            setUncontrolledChecked(nextChecked);\n        }\n\n        onChange(event, nextChecked);\n    };\n\n    return (\n        <FormControlLabel\n            className={classes}\n            control={\n                <Switch\n                    checked={isChecked}\n                    disabled={disabled}\n                    id={id}\n                    onChange={handleChange}\n                    slotProps={{\n                        input: {\n                            role: \"switch\",\n                            ...rest,\n                        },\n                    }}\n                />\n            }\n            label={label}\n            sx={{ color: \"#515151\", textTransform: \"none\" }}\n        />\n    );\n};\n\nToggle.propTypes = {\n    checked: PropTypes.bool,\n    className: PropTypes.string,\n    defaultChecked: PropTypes.bool,\n    disabled: PropTypes.bool,\n    id: PropTypes.string.isRequired,\n    label: PropTypes.node,\n    onChange: PropTypes.func,\n};\n\nToggle.defaultProps = {\n    checked: undefined,\n    className: \"\",\n    defaultChecked: false,\n    disabled: false,\n    label: null,\n    onChange: () => null,\n};\n\nexport default Toggle;","(function (global, factory) {\n  if (typeof define === \"function\" && define.amd) {\n    define([\"exports\", \"react\", \"./Toggle\"], factory);\n  } else if (typeof exports !== \"undefined\") {\n    factory(exports, require(\"react\"), require(\"./Toggle\"));\n  } else {\n    var mod = {\n      exports: {}\n    };\n    factory(mod.exports, global.react, global.Toggle);\n    global.ToggleStories = mod.exports;\n  }\n})(typeof globalThis !== \"undefined\" ? globalThis : typeof self !== \"undefined\" ? self : this, function (_exports, _react, _Toggle) {\n  \"use strict\";\n\n  Object.defineProperty(_exports, \"__esModule\", {\n    value: true\n  });\n  _exports.default = _exports.Disabled = _exports.Default = void 0;\n  _react = _interopRequireWildcard(_react);\n  _Toggle = _interopRequireDefault(_Toggle);\n  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }\n  function _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n  var _default = _exports.default = {\n    title: \"Toggle\",\n    component: _Toggle.default\n  };\n  const Default = () => {\n    const [checked, setChecked] = (0, _react.useState)(false);\n    return /*#__PURE__*/_react.default.createElement(\"div\", {\n      className: \"qpp-u-padding--16\"\n    }, /*#__PURE__*/_react.default.createElement(_Toggle.default, {\n      checked: checked,\n      id: \"default-toggle\",\n      label: \"Toggle\",\n      onChange: (event, nextChecked) => setChecked(nextChecked)\n    }));\n  };\n  _exports.Default = Default;\n  const Disabled = () => /*#__PURE__*/_react.default.createElement(\"div\", {\n    className: \"qpp-u-padding--16\"\n  }, /*#__PURE__*/_react.default.createElement(_Toggle.default, {\n    defaultChecked: true,\n    disabled: true,\n    id: \"disabled-toggle\",\n    label: \"Toggle\"\n  }));\n  _exports.Disabled = Disabled;\n});","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';\n\nvar ReactPropTypesSecret = require('./lib/ReactPropTypesSecret');\n\nfunction emptyFunction() {}\nfunction emptyFunctionWithReset() {}\nemptyFunctionWithReset.resetWarningCache = emptyFunction;\n\nmodule.exports = function() {\n  function shim(props, propName, componentName, location, propFullName, secret) {\n    if (secret === ReactPropTypesSecret) {\n      // It is still safe when called from React.\n      return;\n    }\n    var err = new Error(\n      'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +\n      'Use PropTypes.checkPropTypes() to call them. ' +\n      'Read more at http://fb.me/use-check-prop-types'\n    );\n    err.name = 'Invariant Violation';\n    throw err;\n  };\n  shim.isRequired = shim;\n  function getShim() {\n    return shim;\n  };\n  // Important!\n  // Keep this list in sync with production version in `./factoryWithTypeCheckers.js`.\n  var ReactPropTypes = {\n    array: shim,\n    bigint: shim,\n    bool: shim,\n    func: shim,\n    number: shim,\n    object: shim,\n    string: shim,\n    symbol: shim,\n\n    any: shim,\n    arrayOf: getShim,\n    element: shim,\n    elementType: shim,\n    instanceOf: getShim,\n    node: shim,\n    objectOf: getShim,\n    oneOf: getShim,\n    oneOfType: getShim,\n    shape: getShim,\n    exact: getShim,\n\n    checkPropTypes: emptyFunctionWithReset,\n    resetWarningCache: emptyFunction\n  };\n\n  ReactPropTypes.PropTypes = ReactPropTypes;\n\n  return ReactPropTypes;\n};\n","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nif (process.env.NODE_ENV !== 'production') {\n  var ReactIs = require('react-is');\n\n  // By explicitly using `prop-types` you are opting into new development behavior.\n  // http://fb.me/prop-types-in-prod\n  var throwOnDirectAccess = true;\n  module.exports = require('./factoryWithTypeCheckers')(ReactIs.isElement, throwOnDirectAccess);\n} else {\n  // By explicitly using `prop-types` you are opting into new production behavior.\n  // http://fb.me/prop-types-in-prod\n  module.exports = require('./factoryWithThrowingShims')();\n}\n","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';\n\nvar ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';\n\nmodule.exports = ReactPropTypesSecret;\n"],"names":[],"sourceRoot":""}

package/storybook-static/Tooltip-Tooltip-stories.78bdceea.iframe.bundle.js

@@ -0,0 +1,2 @@
+(self.webpackChunk_madie_madie_design_system=self.webpackChunk_madie_madie_design_system||[]).push([[8426],{"./components/Tooltip/Tooltip.jsx"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/prop-types/index.js"),__webpack_require__("./components/Tooltip/position.js"),__webpack_require__("./node_modules/@reach/tooltip/dist/reach-tooltip.esm.js"),__webpack_require__("./node_modules/@reach/portal/dist/reach-portal.esm.js")],__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_propTypes,_position,_tooltip,_portal){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=_typeof(e)&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(var _t in e)"default"!==_t&&{}.hasOwnProperty.call(e,_t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,_t))&&(i.get||i.set)?o(f,_t,i):f[_t]=e[_t]);return f})(e,t)}function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}function _slicedToArray(r,e){return _arrayWithHoles(r)||_iterableToArrayLimit(r,e)||_unsupportedIterableToArray(r,e)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(r,a){if(r){if("string"==typeof r)return _arrayLikeToArray(r,a);var t={}.toString.call(r).slice(8,-1);return"Object"===t&&r.constructor&&(t=r.constructor.name),"Map"===t||"Set"===t?Array.from(r):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?_arrayLikeToArray(r,a):void 0}}function _arrayLikeToArray(r,a){(null==a||a>r.length)&&(a=r.length);for(var e=0,n=Array(a);e<a;e++)n[e]=r[e];return n}function _iterableToArrayLimit(r,l){var t=null==r?null:"undefined"!=typeof Symbol&&r[Symbol.iterator]||r["@@iterator"];if(null!=t){var e,n,i,u,a=[],f=!0,o=!1;try{if(i=(t=t.call(r)).next,0===l){if(Object(t)!==t)return;f=!1}else for(;!(f=(e=i.call(t)).done)&&(a.push(e.value),a.length!==l);f=!0);}catch(r){o=!0,n=r}finally{try{if(!f&&null!=t.return&&(u=t.return(),Object(u)!==u))return}finally{if(o)throw n}}return a}}function _arrayWithHoles(r){if(Array.isArray(r))return r}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_react=_interopRequireWildcard(_react),_propTypes=_interopRequireDefault(_propTypes),_position=_interopRequireWildcard(_position),_portal=_interopRequireDefault(_portal);var TEXT_COLOR="#FFF",BACKGROUND_COLOR="#333",Tooltip=function Tooltip(_ref){var children=_ref.children,label=_ref.label,ariaLabel=_ref.ariaLabel,DEBUG_STYLE=_ref.DEBUG_STYLE,_useTooltip2=_slicedToArray((0,_tooltip.useTooltip)({DEBUG_STYLE}),2),trigger=_useTooltip2[0],tooltip=_useTooltip2[1],isVisible=tooltip.isVisible,triggerRect=tooltip.triggerRect,tooltipPopupRef=(0,_react.useRef)(),triangleRef=(0,_react.useRef)();return(0,_react.useLayoutEffect)(function(){if(isVisible&&tooltipPopupRef.current&&triggerRect){var tooltipRect=tooltipPopupRef.current.getBoundingClientRect(),positionCssText=(0,_position.positionTriangle)(triggerRect,tooltipRect),cssText="\n                  position: absolute;\n                  width: 0;\n                  height: 0;\n                  ".concat(positionCssText,"\n                  border-top-color: ").concat(BACKGROUND_COLOR,";\n                  border-bottom-color: ").concat(BACKGROUND_COLOR,";\n                  z-index: 1;\n                ");triangleRef.current.style.cssText=cssText}}),_react.default.createElement(_react.default.Fragment,null,(0,_react.cloneElement)(children,trigger),_react.default.createElement(_tooltip.TooltipPopup,_extends({},tooltip,{label,ariaLabel,style:{background:BACKGROUND_COLOR,color:TEXT_COLOR},ref:tooltipPopupRef,position:_position.default})),isVisible&&_react.default.createElement(_portal.default,null,_react.default.createElement("div",{ref:triangleRef,style:{position:"absolute",width:0,height:0}})))};Tooltip.propTypes={children:_propTypes.default.node.isRequired,label:_propTypes.default.node.isRequired,ariaLabel:_propTypes.default.string,DEBUG_STYLE:_propTypes.default.bool},Tooltip.defaultProps={ariaLabel:void 0,DEBUG_STYLE:void 0},_exports.default=Tooltip,Tooltip.__docgenInfo={description:"Generic styled tooltip component.\nCorresponding styles: /styles/components/_tooltip.scss\n\nExtends implementation from @reach/tooltip:\nhttps://reacttraining.com/reach-ui/tooltip",methods:[],displayName:"Tooltip",props:{ariaLabel:{defaultValue:{value:"undefined",computed:!0},description:"",type:{name:"string"},required:!1},DEBUG_STYLE:{defaultValue:{value:"undefined",computed:!0},description:"",type:{name:"bool"},required:!1},children:{description:"",type:{name:"node"},required:!0},label:{description:"",type:{name:"node"},required:!0}}}},void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof __WEBPACK_AMD_DEFINE_FACTORY__?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./components/Tooltip/index.js"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./components/Tooltip/Tooltip.jsx")],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_Tooltip){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_Tooltip=_interopRequireDefault(_Tooltip),_exports.default=_Tooltip.default})?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./components/Tooltip/position.js"(module,exports){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports){"use strict";Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.positionTriangle=_exports.default=void 0;var OFFSET=12,TRIANGLE_SCALE_X=6,TRIANGLE_SCALE_Y=8,isDirectionUp=function isDirectionUp(triggerRect,tooltipRect){var collisions={top:triggerRect.top-tooltipRect.height<0,bottom:window.innerHeight<triggerRect.bottom+tooltipRect.height+OFFSET};return!collisions.top||collisions.bottom},positionTip=function positionTip(triggerRect,tooltipRect){if(!triggerRect||!tooltipRect)return{};var left=triggerRect.left+triggerRect.width/2-tooltipRect.width/2,maxLeft=window.innerWidth-tooltipRect.width-2,centerLeft=Math.min(Math.max(2,left),maxLeft)+window.pageXOffset,directionUp=isDirectionUp(triggerRect,tooltipRect);return{left:"".concat(centerLeft,"px"),top:"".concat(directionUp?triggerRect.top-OFFSET-tooltipRect.height+window.pageYOffset:triggerRect.top+OFFSET+triggerRect.height+window.pageYOffset,"px")}};_exports.default=positionTip,_exports.positionTriangle=function positionTriangle(triggerRect,tooltipRect){var directionUp=isDirectionUp(triggerRect,tooltipRect),triangleTop=directionUp?triggerRect.top+window.pageYOffset-OFFSET:triggerRect.bottom+window.pageYOffset+OFFSET-TRIANGLE_SCALE_Y,triangleLeft=triggerRect.left-TRIANGLE_SCALE_X+triggerRect.width/2,triangleBorder=directionUp?"border-top: ".concat(TRIANGLE_SCALE_Y,"px solid;"):"border-bottom: ".concat(TRIANGLE_SCALE_Y,"px solid;");return"\n        border-left: ".concat(TRIANGLE_SCALE_X,"px solid transparent;\n        border-right: ").concat(TRIANGLE_SCALE_X,"px solid transparent;\n        left: ").concat(triangleLeft,"px;\n        top: ").concat(triangleTop,"px;\n        ").concat(triangleBorder,"\n    ")}})?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./components/Tooltip/Tooltip.stories.js"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./components/Tooltip/index.js")],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_react,_index){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=_exports.PositionedBelowTargetTooltip=_exports.MultipleTooltip=_exports.InputElementTooltip=_exports.ExampleTooltip=_exports.AriaLabelTooltip=void 0,_react=_interopRequireDefault(_react),_index=_interopRequireDefault(_index);const offsetDecorator=storyFn=>_react.default.createElement("div",{style:{margin:"80px"}},storyFn());_exports.default={title:"Tooltip",component:_index.default};const ExampleTooltip=()=>_react.default.createElement(_index.default,{label:"FOOBAR"},_react.default.createElement("button",null,_react.default.createElement("span",null,"Tooltip Trigger")));_exports.ExampleTooltip=ExampleTooltip,ExampleTooltip.storyName="example Tooltip",ExampleTooltip.decorators=[offsetDecorator];const AriaLabelTooltip=()=>_react.default.createElement(_index.default,{label:"FOOBAR",ariaLabel:"foobar"},_react.default.createElement("button",null,_react.default.createElement("span",null,"Tooltip Trigger")));_exports.AriaLabelTooltip=AriaLabelTooltip,AriaLabelTooltip.storyName="using ariaLabel",AriaLabelTooltip.decorators=[offsetDecorator];const MultipleTooltip=()=>_react.default.createElement(_react.default.Fragment,null,_react.default.createElement(_index.default,{label:"Tooltip 1"},_react.default.createElement("button",null,_react.default.createElement("span",null,"Tooltip 1 Trigger"))),_react.default.createElement(_index.default,{label:"Tooltip 2"},_react.default.createElement("button",null,_react.default.createElement("span",null,"Tooltip 2 Trigger"))),_react.default.createElement(_index.default,{label:"Tooltip 3"},_react.default.createElement("button",null,_react.default.createElement("span",null,"Tooltip 3 Trigger"))));_exports.MultipleTooltip=MultipleTooltip,MultipleTooltip.storyName="multiple Tooltips",MultipleTooltip.decorators=[offsetDecorator];const InputElementTooltip=()=>_react.default.createElement("form",null,_react.default.createElement("label",{htmlFor:"foobar",style:{marginRight:"5px "}},"Text Input"),_react.default.createElement(_index.default,{label:"example input label tooltip"},_react.default.createElement("input",{type:"text",name:"foobar"})));_exports.InputElementTooltip=InputElementTooltip,InputElementTooltip.storyName="on text input",InputElementTooltip.decorators=[offsetDecorator];const PositionedBelowTargetTooltip=()=>_react.default.createElement(_index.default,{label:"FOOBAR"},_react.default.createElement("button",null,_react.default.createElement("span",null,"Tooltip Trigger")));_exports.PositionedBelowTargetTooltip=PositionedBelowTargetTooltip,PositionedBelowTargetTooltip.storyName="positioned below trigger"})?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./node_modules/prop-types/factoryWithThrowingShims.js"(module,__unused_webpack_exports,__webpack_require__){"use strict";var ReactPropTypesSecret=__webpack_require__("./node_modules/prop-types/lib/ReactPropTypesSecret.js");function emptyFunction(){}function emptyFunctionWithReset(){}emptyFunctionWithReset.resetWarningCache=emptyFunction,module.exports=function(){function shim(props,propName,componentName,location,propFullName,secret){if(secret!==ReactPropTypesSecret){var err=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw err.name="Invariant Violation",err}}function getShim(){return shim}shim.isRequired=shim;var ReactPropTypes={array:shim,bigint:shim,bool:shim,func:shim,number:shim,object:shim,string:shim,symbol:shim,any:shim,arrayOf:getShim,element:shim,elementType:shim,instanceOf:getShim,node:shim,objectOf:getShim,oneOf:getShim,oneOfType:getShim,shape:getShim,exact:getShim,checkPropTypes:emptyFunctionWithReset,resetWarningCache:emptyFunction};return ReactPropTypes.PropTypes=ReactPropTypes,ReactPropTypes}},"./node_modules/prop-types/index.js"(module,__unused_webpack_exports,__webpack_require__){module.exports=__webpack_require__("./node_modules/prop-types/factoryWithThrowingShims.js")()},"./node_modules/prop-types/lib/ReactPropTypesSecret.js"(module){"use strict";module.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"}}]);
+//# sourceMappingURL=Tooltip-Tooltip-stories.78bdceea.iframe.bundle.js.map

package/storybook-static/Tooltip-Tooltip-stories.78bdceea.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip-Tooltip-stories.94c4cf56.iframe.bundle.js","mappings":"AAQA","sources":["webpack://@madie/madie-design-system/./components/Tooltip/Tooltip.jsx","webpack://@madie/madie-design-system/./components/Tooltip/index.js","webpack://@madie/madie-design-system/./components/Tooltip/position.js","webpack://@madie/madie-design-system/./components/Tooltip/Tooltip.stories.js","webpack://@madie/madie-design-system/./node_modules/prop-types/factoryWithThrowingShims.js","webpack://@madie/madie-design-system/./node_modules/prop-types/index.js","webpack://@madie/madie-design-system/./node_modules/prop-types/lib/ReactPropTypesSecret.js"],"sourcesContent":["import React, { cloneElement, useLayoutEffect, useRef } from \"react\";\nimport PropTypes from \"prop-types\";\nimport positionTip, { positionTriangle } from \"./position\";\nimport { useTooltip, TooltipPopup } from \"@reach/tooltip\";\nimport Portal from \"@reach/portal\";\n\n// TODO: investigate ways to allow more styling via css? the triangle\n// positioning effect issue may need to be resolved to allow for this.\nconst TEXT_COLOR = \"#FFF\";\nconst BACKGROUND_COLOR = \"#333\";\n\n/**\n * Generic styled tooltip component.\n * Corresponding styles: /styles/components/_tooltip.scss\n *\n * Extends implementation from @reach/tooltip:\n * https://reacttraining.com/reach-ui/tooltip\n */\nconst Tooltip = ({ children, label, ariaLabel, DEBUG_STYLE }) => {\n    const [trigger, tooltip] = useTooltip({ DEBUG_STYLE });\n    const { isVisible, triggerRect } = tooltip;\n    const tooltipPopupRef = useRef();\n    const triangleRef = useRef();\n\n    useLayoutEffect(() => {\n        // For some reason, the forwardRef for the tooltipPopup points to an undefined\n        // dom element when we first render the portal containing the triangle. Using\n        // an effect here will ensure that the ref is available when applying styles.\n        // TODO: investigate and make issue for @reach-ui/tooltip?\n        if (isVisible && tooltipPopupRef.current && triggerRect) {\n            const tooltipRect = tooltipPopupRef.current.getBoundingClientRect();\n            const positionCssText = positionTriangle(triggerRect, tooltipRect);\n            const cssText = `\n                  position: absolute;\n                  width: 0;\n                  height: 0;\n                  ${positionCssText}\n                  border-top-color: ${BACKGROUND_COLOR};\n                  border-bottom-color: ${BACKGROUND_COLOR};\n                  z-index: 1;\n                `;\n            triangleRef.current.style.cssText = cssText;\n        }\n    });\n\n    return (\n        <>\n            {cloneElement(children, trigger)}\n            <TooltipPopup\n                {...tooltip}\n                label={label}\n                ariaLabel={ariaLabel}\n                style={{\n                    background: BACKGROUND_COLOR,\n                    color: TEXT_COLOR,\n                }}\n                ref={tooltipPopupRef}\n                position={positionTip}\n            />\n            {isVisible && (\n                <Portal>\n                    <div\n                        ref={triangleRef}\n                        style={{\n                            position: \"absolute\",\n                            width: 0,\n                            height: 0,\n                        }}\n                    />\n                </Portal>\n            )}\n        </>\n    );\n};\n\nTooltip.propTypes = {\n    children: PropTypes.node.isRequired,\n    label: PropTypes.node.isRequired,\n    ariaLabel: PropTypes.string,\n    DEBUG_STYLE: PropTypes.bool,\n};\n\nTooltip.defaultProps = {\n    ariaLabel: undefined,\n    DEBUG_STYLE: undefined,\n};\n\nexport default Tooltip;\n","import Tooltip from \"./Tooltip\";\n\nexport default Tooltip;\n","const OFFSET = 12; // modified from reach-ui/tooltip OFFSET value\nconst TRIANGLE_SCALE_X = 6;\nconst TRIANGLE_SCALE_Y = 8;\n\nconst isDirectionUp = (triggerRect, tooltipRect) => {\n    const collisions = {\n        top: triggerRect.top - tooltipRect.height < 0,\n        bottom:\n            window.innerHeight <\n            triggerRect.bottom + tooltipRect.height + OFFSET,\n    };\n\n    return !collisions.top || collisions.bottom;\n};\n\n// modified from @reach/tooltip default positioning function\n// positions Tooltip relative to trigger\n// https://github.com/reach/reach-ui/blob/master/packages/tooltip/src/index.tsx#L532\nconst positionTip = (triggerRect, tooltipRect) => {\n    if (!triggerRect || !tooltipRect) {\n        return {};\n    }\n\n    const triggerCenter = triggerRect.left + triggerRect.width / 2;\n    const left = triggerCenter - tooltipRect.width / 2;\n    const maxLeft = window.innerWidth - tooltipRect.width - 2;\n    const centerLeft =\n        Math.min(Math.max(2, left), maxLeft) + window.pageXOffset;\n\n    const directionUp = isDirectionUp(triggerRect, tooltipRect);\n\n    return {\n        left: `${centerLeft}px`,\n        top: directionUp\n            ? `${\n                  triggerRect.top -\n                  OFFSET -\n                  tooltipRect.height +\n                  window.pageYOffset\n              }px`\n            : `${\n                  triggerRect.top +\n                  OFFSET +\n                  triggerRect.height +\n                  window.pageYOffset\n              }px`,\n    };\n};\n\nexport default positionTip;\n\n// position triangle relative to tooltip position\n// TODO: figure out a better way to render these updates from within react\n// rendering. This method causes an additional repaint after the Tooltip\n// has been rendered. may require changes to @reach/tooltip.\nexport const positionTriangle = (triggerRect, tooltipRect) => {\n    const directionUp = isDirectionUp(triggerRect, tooltipRect);\n    const triangleTop = directionUp\n        ? triggerRect.top + window.pageYOffset - OFFSET\n        : triggerRect.bottom + window.pageYOffset + OFFSET - TRIANGLE_SCALE_Y;\n\n    const triangleLeft =\n        triggerRect.left - TRIANGLE_SCALE_X + triggerRect.width / 2;\n\n    const triangleBorder = directionUp\n        ? `border-top: ${TRIANGLE_SCALE_Y}px solid;`\n        : `border-bottom: ${TRIANGLE_SCALE_Y}px solid;`;\n\n    return `\n        border-left: ${TRIANGLE_SCALE_X}px solid transparent;\n        border-right: ${TRIANGLE_SCALE_X}px solid transparent;\n        left: ${triangleLeft}px;\n        top: ${triangleTop}px;\n        ${triangleBorder}\n    `;\n};\n","(function (global, factory) {\n  if (typeof define === \"function\" && define.amd) {\n    define([\"exports\", \"react\", \"./index\"], factory);\n  } else if (typeof exports !== \"undefined\") {\n    factory(exports, require(\"react\"), require(\"./index\"));\n  } else {\n    var mod = {\n      exports: {}\n    };\n    factory(mod.exports, global.react, global.index);\n    global.TooltipStories = mod.exports;\n  }\n})(typeof globalThis !== \"undefined\" ? globalThis : typeof self !== \"undefined\" ? self : this, function (_exports, _react, _index) {\n  \"use strict\";\n\n  Object.defineProperty(_exports, \"__esModule\", {\n    value: true\n  });\n  _exports.default = _exports.PositionedBelowTargetTooltip = _exports.MultipleTooltip = _exports.InputElementTooltip = _exports.ExampleTooltip = _exports.AriaLabelTooltip = void 0;\n  _react = _interopRequireDefault(_react);\n  _index = _interopRequireDefault(_index);\n  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }\n  const offsetDecorator = storyFn => /*#__PURE__*/_react.default.createElement(\"div\", {\n    style: {\n      margin: \"80px\"\n    }\n  }, storyFn());\n  var _default = _exports.default = {\n    title: \"Tooltip\",\n    component: _index.default\n  };\n  const ExampleTooltip = () => /*#__PURE__*/_react.default.createElement(_index.default, {\n    label: \"FOOBAR\"\n  }, /*#__PURE__*/_react.default.createElement(\"button\", null, /*#__PURE__*/_react.default.createElement(\"span\", null, \"Tooltip Trigger\")));\n  _exports.ExampleTooltip = ExampleTooltip;\n  ExampleTooltip.storyName = \"example Tooltip\";\n  ExampleTooltip.decorators = [offsetDecorator];\n  const AriaLabelTooltip = () => /*#__PURE__*/_react.default.createElement(_index.default, {\n    label: \"FOOBAR\",\n    ariaLabel: \"foobar\"\n  }, /*#__PURE__*/_react.default.createElement(\"button\", null, /*#__PURE__*/_react.default.createElement(\"span\", null, \"Tooltip Trigger\")));\n  _exports.AriaLabelTooltip = AriaLabelTooltip;\n  AriaLabelTooltip.storyName = \"using ariaLabel\";\n  AriaLabelTooltip.decorators = [offsetDecorator];\n  const MultipleTooltip = () => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_index.default, {\n    label: \"Tooltip 1\"\n  }, /*#__PURE__*/_react.default.createElement(\"button\", null, /*#__PURE__*/_react.default.createElement(\"span\", null, \"Tooltip 1 Trigger\"))), /*#__PURE__*/_react.default.createElement(_index.default, {\n    label: \"Tooltip 2\"\n  }, /*#__PURE__*/_react.default.createElement(\"button\", null, /*#__PURE__*/_react.default.createElement(\"span\", null, \"Tooltip 2 Trigger\"))), /*#__PURE__*/_react.default.createElement(_index.default, {\n    label: \"Tooltip 3\"\n  }, /*#__PURE__*/_react.default.createElement(\"button\", null, /*#__PURE__*/_react.default.createElement(\"span\", null, \"Tooltip 3 Trigger\"))));\n  _exports.MultipleTooltip = MultipleTooltip;\n  MultipleTooltip.storyName = \"multiple Tooltips\";\n  MultipleTooltip.decorators = [offsetDecorator];\n  const InputElementTooltip = () => /*#__PURE__*/_react.default.createElement(\"form\", null, /*#__PURE__*/_react.default.createElement(\"label\", {\n    htmlFor: \"foobar\",\n    style: {\n      marginRight: \"5px \"\n    }\n  }, \"Text Input\"), /*#__PURE__*/_react.default.createElement(_index.default, {\n    label: \"example input label tooltip\"\n  }, /*#__PURE__*/_react.default.createElement(\"input\", {\n    type: \"text\",\n    name: \"foobar\"\n  })));\n  _exports.InputElementTooltip = InputElementTooltip;\n  InputElementTooltip.storyName = \"on text input\";\n  InputElementTooltip.decorators = [offsetDecorator];\n  const PositionedBelowTargetTooltip = () => /*#__PURE__*/_react.default.createElement(_index.default, {\n    label: \"FOOBAR\"\n  }, /*#__PURE__*/_react.default.createElement(\"button\", null, /*#__PURE__*/_react.default.createElement(\"span\", null, \"Tooltip Trigger\")));\n  _exports.PositionedBelowTargetTooltip = PositionedBelowTargetTooltip;\n  PositionedBelowTargetTooltip.storyName = \"positioned below trigger\";\n});","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';\n\nvar ReactPropTypesSecret = require('./lib/ReactPropTypesSecret');\n\nfunction emptyFunction() {}\nfunction emptyFunctionWithReset() {}\nemptyFunctionWithReset.resetWarningCache = emptyFunction;\n\nmodule.exports = function() {\n  function shim(props, propName, componentName, location, propFullName, secret) {\n    if (secret === ReactPropTypesSecret) {\n      // It is still safe when called from React.\n      return;\n    }\n    var err = new Error(\n      'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +\n      'Use PropTypes.checkPropTypes() to call them. ' +\n      'Read more at http://fb.me/use-check-prop-types'\n    );\n    err.name = 'Invariant Violation';\n    throw err;\n  };\n  shim.isRequired = shim;\n  function getShim() {\n    return shim;\n  };\n  // Important!\n  // Keep this list in sync with production version in `./factoryWithTypeCheckers.js`.\n  var ReactPropTypes = {\n    array: shim,\n    bigint: shim,\n    bool: shim,\n    func: shim,\n    number: shim,\n    object: shim,\n    string: shim,\n    symbol: shim,\n\n    any: shim,\n    arrayOf: getShim,\n    element: shim,\n    elementType: shim,\n    instanceOf: getShim,\n    node: shim,\n    objectOf: getShim,\n    oneOf: getShim,\n    oneOfType: getShim,\n    shape: getShim,\n    exact: getShim,\n\n    checkPropTypes: emptyFunctionWithReset,\n    resetWarningCache: emptyFunction\n  };\n\n  ReactPropTypes.PropTypes = ReactPropTypes;\n\n  return ReactPropTypes;\n};\n","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nif (process.env.NODE_ENV !== 'production') {\n  var ReactIs = require('react-is');\n\n  // By explicitly using `prop-types` you are opting into new development behavior.\n  // http://fb.me/prop-types-in-prod\n  var throwOnDirectAccess = true;\n  module.exports = require('./factoryWithTypeCheckers')(ReactIs.isElement, throwOnDirectAccess);\n} else {\n  // By explicitly using `prop-types` you are opting into new production behavior.\n  // http://fb.me/prop-types-in-prod\n  module.exports = require('./factoryWithThrowingShims')();\n}\n","/**\n * Copyright (c) 2013-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';\n\nvar ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';\n\nmodule.exports = ReactPropTypesSecret;\n"],"names":[],"sourceRoot":""}

package/storybook-static/TruncateText-TruncateText-stories.a5188e85.iframe.bundle.js

@@ -0,0 +1,2 @@
+(self.webpackChunk_madie_madie_design_system=self.webpackChunk_madie_madie_design_system||[]).push([[7466],{"./components/TruncateText/index.js"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/@mui/material/index.js"),__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/lodash/lodash.js"),__webpack_require__("./node_modules/prop-types/index.js")],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,_material,_react,_lodash,_propTypes){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=_typeof(e)&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(var _t in e)"default"!==_t&&{}.hasOwnProperty.call(e,_t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,_t))&&(i.get||i.set)?o(f,_t,i):f[_t]=e[_t]);return f})(e,t)}function _slicedToArray(r,e){return _arrayWithHoles(r)||_iterableToArrayLimit(r,e)||_unsupportedIterableToArray(r,e)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(r,a){if(r){if("string"==typeof r)return _arrayLikeToArray(r,a);var t={}.toString.call(r).slice(8,-1);return"Object"===t&&r.constructor&&(t=r.constructor.name),"Map"===t||"Set"===t?Array.from(r):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?_arrayLikeToArray(r,a):void 0}}function _arrayLikeToArray(r,a){(null==a||a>r.length)&&(a=r.length);for(var e=0,n=Array(a);e<a;e++)n[e]=r[e];return n}function _iterableToArrayLimit(r,l){var t=null==r?null:"undefined"!=typeof Symbol&&r[Symbol.iterator]||r["@@iterator"];if(null!=t){var e,n,i,u,a=[],f=!0,o=!1;try{if(i=(t=t.call(r)).next,0===l){if(Object(t)!==t)return;f=!1}else for(;!(f=(e=i.call(t)).done)&&(a.push(e.value),a.length!==l);f=!0);}catch(r){o=!0,n=r}finally{try{if(!f&&null!=t.return&&(u=t.return(),Object(u)!==u))return}finally{if(o)throw n}}return a}}function _arrayWithHoles(r){if(Array.isArray(r))return r}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_react=_interopRequireWildcard(_react),_lodash=_interopRequireDefault(_lodash),_propTypes=_interopRequireDefault(_propTypes);var TruncateText=function TruncateText(_ref){var text=_ref.text,_ref$maxLength=_ref.maxLength,maxLength=void 0===_ref$maxLength?120:_ref$maxLength,dataTestId=_ref.dataTestId,_ref$fontSize=_ref.fontSize,fontSize=void 0===_ref$fontSize?"1rem":_ref$fontSize,_useState2=_slicedToArray((0,_react.useState)(!1),2),isExpanded=_useState2[0],setIsExpanded=_useState2[1];if(!text||""===_lodash.default.trim(text))return null;var toggleExpanded=function toggleExpanded(){return setIsExpanded(function(prev){return!prev})},displayedText=isExpanded?text:_lodash.default.slice(text,0,maxLength);return _react.default.createElement("div",{"data-testid":"".concat(dataTestId,"-content"),style:{fontSize}},_react.default.createElement("span",null,displayedText),text.length>maxLength&&_react.default.createElement(_material.IconButton,{onClick:toggleExpanded,"data-testid":"".concat(dataTestId,"-toggle-button"),color:"primary",sx:{marginLeft:"5px",padding:"0",cursor:"pointer",textDecoration:"underline",fontSize:"inherit"}},isExpanded?"Show less":"Show more"))};TruncateText.propTypes={text:_propTypes.default.string,maxLength:_propTypes.default.number,dataTestId:_propTypes.default.string,fontSize:_propTypes.default.string},_exports.default=TruncateText,TruncateText.__docgenInfo={description:"",methods:[],displayName:"TruncateText",props:{maxLength:{defaultValue:{value:"120",computed:!1},description:"",type:{name:"number"},required:!1},fontSize:{defaultValue:{value:'"1rem"',computed:!1},description:"",type:{name:"string"},required:!1},text:{description:"",type:{name:"string"},required:!1},dataTestId:{description:"",type:{name:"string"},required:!1}}}})?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)},"./components/TruncateText/TruncateText.stories.js"(module,exports,__webpack_require__){var __WEBPACK_AMD_DEFINE_FACTORY__,__WEBPACK_AMD_DEFINE_ARRAY__,__WEBPACK_AMD_DEFINE_RESULT__;"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self&&self,__WEBPACK_AMD_DEFINE_ARRAY__=[exports,__webpack_require__("./node_modules/react/index.js"),__webpack_require__("./node_modules/@storybook/addon-knobs/dist/index.js"),__webpack_require__("./components/TruncateText/index.js")],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=function(_exports,React,_addonKnobs,_index){"use strict";function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=_exports.TruncatedText=_exports.FullText=void 0,React=_interopRequireWildcard(React),_index=_interopRequireDefault(_index),_exports.default={title:"Truncate Text",component:_index.default,decorators:[_addonKnobs.withKnobs]};const FullText=()=>React.createElement(_index.default,{text:"Addressing Social Needs in the Inpatient Setting Part 4 of 4 Housing",maxLength:120,dataTestId:"measure-comments"});_exports.FullText=FullText;const TruncatedText=()=>React.createElement(_index.default,{text:"Addressing Social Needs in the Inpatient Setting Part 4 of 4 Housing Domain Addressing Social Needs in the Inpatient Setting Part 4 of 4 Housing Domain",maxLength:60,dataTestId:"measure-comments",fontSize:"1rem"});_exports.TruncatedText=TruncatedText})?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)}}]);
+//# sourceMappingURL=TruncateText-TruncateText-stories.a5188e85.iframe.bundle.js.map

package/storybook-static/TruncateText-TruncateText-stories.a5188e85.iframe.bundle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TruncateText-TruncateText-stories.c2b22787.iframe.bundle.js","mappings":"AAKA","sources":["webpack://@madie/madie-design-system/./components/TruncateText/index.js","webpack://@madie/madie-design-system/./components/TruncateText/TruncateText.stories.js"],"sourcesContent":["import { IconButton } from \"@mui/material\";\nimport React, { useState } from \"react\";\nimport _ from \"lodash\";\nimport PropTypes from \"prop-types\";\n\nconst TruncateText = ({\n    text,\n    maxLength = 120,\n    dataTestId,\n    fontSize = \"1rem\",\n}) => {\n    const [isExpanded, setIsExpanded] = useState(false);\n\n    if (!text || _.trim(text) === \"\") {\n        return null;\n    }\n\n    const toggleExpanded = () => setIsExpanded((prev) => !prev);\n\n    const displayedText = isExpanded ? text : _.slice(text, 0, maxLength);\n\n    return (\n        <div data-testid={`${dataTestId}-content`} style={{ fontSize }}>\n            <span>{displayedText}</span>\n            {text.length > maxLength && (\n                <IconButton\n                    onClick={toggleExpanded}\n                    data-testid={`${dataTestId}-toggle-button`}\n                    color=\"primary\"\n                    sx={{\n                        marginLeft: \"5px\",\n                        padding: \"0\",\n                        cursor: \"pointer\",\n                        textDecoration: \"underline\",\n                        fontSize: \"inherit\",\n                    }}\n                >\n                    {isExpanded ? \"Show less\" : \"Show more\"}\n                </IconButton>\n            )}\n        </div>\n    );\n};\n\nTruncateText.propTypes = {\n    text: PropTypes.string,\n    maxLength: PropTypes.number,\n    dataTestId: PropTypes.string,\n    fontSize: PropTypes.string,\n};\n\nexport default TruncateText;\n","(function (global, factory) {\n  if (typeof define === \"function\" && define.amd) {\n    define([\"exports\", \"react\", \"@storybook/addon-knobs\", \"./index\"], factory);\n  } else if (typeof exports !== \"undefined\") {\n    factory(exports, require(\"react\"), require(\"@storybook/addon-knobs\"), require(\"./index\"));\n  } else {\n    var mod = {\n      exports: {}\n    };\n    factory(mod.exports, global.react, global.addonKnobs, global.index);\n    global.TruncateTextStories = mod.exports;\n  }\n})(typeof globalThis !== \"undefined\" ? globalThis : typeof self !== \"undefined\" ? self : this, function (_exports, React, _addonKnobs, _index) {\n  \"use strict\";\n\n  Object.defineProperty(_exports, \"__esModule\", {\n    value: true\n  });\n  _exports.default = _exports.TruncatedText = _exports.FullText = void 0;\n  React = _interopRequireWildcard(React);\n  _index = _interopRequireDefault(_index);\n  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }\n  function _interopRequireWildcard(e, t) { if (\"function\" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || \"object\" != typeof e && \"function\" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) \"default\" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }\n  var _default = _exports.default = {\n    title: \"Truncate Text\",\n    component: _index.default,\n    decorators: [_addonKnobs.withKnobs]\n  };\n  const FullText = () => /*#__PURE__*/React.createElement(_index.default, {\n    text: \"Addressing Social Needs in the Inpatient Setting Part 4 of 4 Housing\",\n    maxLength: 120,\n    dataTestId: \"measure-comments\"\n  });\n  _exports.FullText = FullText;\n  const TruncatedText = () => /*#__PURE__*/React.createElement(_index.default, {\n    text: \"Addressing Social Needs in the Inpatient Setting Part 4 of 4 Housing Domain Addressing Social Needs in the Inpatient Setting Part 4 of 4 Housing Domain\",\n    maxLength: 60,\n    dataTestId: \"measure-comments\",\n    fontSize: \"1rem\"\n  });\n  _exports.TruncatedText = TruncatedText;\n});"],"names":[],"sourceRoot":""}