sag_components 1.0.7 → 1.0.8

package/storybook-static/55.d0744d52.iframe.bundle.js.LICENSE.txt

@@ -1,26 +1,26 @@
-/**
- * @license React
- * react-jsx-runtime.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-/**
- * @mui/styled-engine v5.12.3
- *
- * @license MIT
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-/** @license React v16.13.1
- * react-is.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
+/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * @mui/styled-engine v5.12.3
+ *
+ * @license MIT
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.13.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */

package/storybook-static/Dropdown-stories.825dde1a.iframe.bundle.js

@@ -1,8 +1,8 @@
-"use strict";(self.webpackChunksag_storybook=self.webpackChunksag_storybook||[]).push([[935],{"./src/stories/Dropdown.stories.jsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{LargeRoundWithoutIcons:function(){return LargeRoundWithoutIcons},LargeSquareWithIcons:function(){return LargeSquareWithIcons},MultiSelectLarge:function(){return MultiSelectLarge},MultiSelectSmall:function(){return MultiSelectSmall},MultiSelectWithIcons:function(){return MultiSelectWithIcons},SearchIcon:function(){return SearchIcon},SmallRound:function(){return SmallRound},SmallSquare:function(){return SmallSquare},UpDownArrowIcon:function(){return UpDownArrowIcon},__namedExportsOrder:function(){return __namedExportsOrder},default:function(){return Dropdown_stories}});var react=__webpack_require__("./node_modules/react/index.js");const DropdownContainer=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js").ZP.div`
-  width: ${props=>props.width};  
-  text-align: left;  
-  position: relative; 
-  align-items: center;
-  justify-content: center;
-`;var Autocomplete=__webpack_require__("./node_modules/@mui/material/Autocomplete/Autocomplete.js"),TextField=__webpack_require__("./node_modules/@mui/material/TextField/TextField.js"),Checkbox=__webpack_require__("./node_modules/@mui/material/Checkbox/Checkbox.js"),InputAdornment=__webpack_require__("./node_modules/@mui/material/InputAdornment/InputAdornment.js"),CheckBoxOutlineBlank=__webpack_require__("./node_modules/@mui/icons-material/CheckBoxOutlineBlank.js"),CheckBox=__webpack_require__("./node_modules/@mui/icons-material/CheckBox.js"),Search=__webpack_require__("./node_modules/@mui/icons-material/Search.js"),ArrowDropDown=__webpack_require__("./node_modules/@mui/icons-material/ArrowDropDown.js"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const icon=(0,jsx_runtime.jsx)(CheckBoxOutlineBlank.Z,{fontSize:"small"}),checkedIcon=(0,jsx_runtime.jsx)(CheckBox.Z,{fontSize:"small"}),Dropdown=({width:width,size:size,text:text,shape:shape,placeHolder:placeHolder,multiSelect:multiSelect,limitTagsOnMultiSelect:limitTagsOnMultiSelect,showPopupIcon:showPopupIcon,showSearchIcon:showSearchIcon,options:options,onChange:onChange,onInputChange:onInputChange})=>{const[currentInputValue,setCurrentInputValue]=(0,react.useState)(null),[currentOption,setCurrentOption]=(0,react.useState)(null);(0,react.useEffect)((()=>{const delayDebounceFn=setTimeout((()=>{onInputChange(currentInputValue)}),1e3);return()=>clearTimeout(delayDebounceFn)}),[currentInputValue]);const getTextFieldStyle=()=>"round"===shape?{"& .MuiOutlinedInput-root":{borderRadius:"50px",legend:{marginLeft:"30px"}},"& .MuiAutocomplete-inputRoot":{paddingLeft:"20px !important",borderRadius:"50px"},"& .MuiInputLabel-outlined":{paddingLeft:"20px"},"& .MuiInputLabel-shrink":{marginLeft:"20px",paddingLeft:"10px",paddingRight:0,background:"white"}}:null,onInputChangeHandler=(event,newInputValue)=>{setCurrentInputValue({syntheticBaseEvent:event,inputValue:newInputValue})},onChangeHandler=(event,newValue)=>{setCurrentOption(newValue),onChange(event,newValue)};return(0,jsx_runtime.jsx)(DropdownContainer,{width:width,children:multiSelect?(0,jsx_runtime.jsx)(Autocomplete.Z,{onChange:(event,newValue)=>{onChangeHandler(event,newValue)},onInputChange:(event,newInputValue)=>{onInputChangeHandler(event,newInputValue)},multiple:!0,limitTags:limitTagsOnMultiSelect,size:size,id:"checkboxes-tags",options:options,disableCloseOnSelect:!0,getOptionLabel:option=>option.label,popupIcon:showPopupIcon?(0,jsx_runtime.jsx)(ArrowDropDown.Z,{}):null,renderOption:(props,option,{selected:selected})=>(0,jsx_runtime.jsxs)("li",{...props,children:[(0,jsx_runtime.jsx)(Checkbox.Z,{icon:icon,checkedIcon:checkedIcon,style:{marginRight:8},checked:selected}),option.label]}),style:{width:width},renderInput:params=>showSearchIcon&&(!currentOption||currentOption&&0===currentOption.length)?(0,jsx_runtime.jsx)(TextField.Z,{...params,label:text,size:size,sx:getTextFieldStyle(),placeholder:placeHolder,InputProps:{...params.InputProps,startAdornment:(0,jsx_runtime.jsx)(InputAdornment.Z,{position:"start",children:(0,jsx_runtime.jsx)(Search.Z,{fontSize:"medium"})})}}):(0,jsx_runtime.jsx)(TextField.Z,{...params,label:text,size:size,sx:getTextFieldStyle(),placeholder:placeHolder})}):(0,jsx_runtime.jsx)(Autocomplete.Z,{onChange:(event,newValue)=>{onChangeHandler(event,newValue)},onInputChange:(event,newInputValue)=>{onInputChangeHandler(event,newInputValue)},disablePortal:!0,id:"combo-box",options:options,sx:{width:width},popupIcon:showPopupIcon?(0,jsx_runtime.jsx)(ArrowDropDown.Z,{}):null,forcePopupIcon:"auto",renderInput:params=>(0,jsx_runtime.jsx)(TextField.Z,{...params,label:text,size:size,sx:getTextFieldStyle(),placeholder:placeHolder,InputProps:{...params.InputProps,startAdornment:showSearchIcon?(0,jsx_runtime.jsx)(InputAdornment.Z,{position:"start",children:(0,jsx_runtime.jsx)(Search.Z,{fontSize:"medium"})}):null}})})})};Dropdown.displayName="Dropdown";const options=[{id:0,label:"Shufersal"},{id:1,label:"EPC"},{id:2,label:"Food Lion"},{id:3,label:"Hannaford"},{id:4,label:"Giant Food"},{id:5,label:"The Giant Company"},{id:6,label:"Stop&Shop"},{id:7,label:"Price Chopper"},{id:8,label:"South Eastern Grocers"}];var Dropdown_stories={parameters:{storySource:{source:'import React from "react";\nimport { Dropdown } from "./Dropdown";\nconst options = [{\n  id: 0,\n  label: "Shufersal"\n}, {\n  id: 1,\n  label: "EPC"\n}, {\n  id: 2,\n  label: "Food Lion"\n}, {\n  id: 3,\n  label: "Hannaford"\n}, {\n  id: 4,\n  label: "Giant Food"\n}, {\n  id: 5,\n  label: "The Giant Company"\n}, {\n  id: 6,\n  label: "Stop&Shop"\n}, {\n  id: 7,\n  label: "Price Chopper"\n}, {\n  id: 8,\n  label: "South Eastern Grocers"\n}];\n\n// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction\nexport default {\n  title: "SAG BI/Dropdown",\n  component: Dropdown,\n  tags: ["autodocs"],\n  argTypes: {\n    width: {\n      control: {\n        type: "number"\n      },\n      description: "width of the input field",\n      defaultValue: 300\n    },\n    size: {\n      control: {\n        type: "radio"\n      },\n      options: ["small", "large"],\n      description: "size: small/large"\n    },\n    text: {\n      name: "text",\n      control: {\n        type: "text"\n      },\n      description: "text inside of the input field",\n      defaultValue: \'Search...\'\n    },\n    placeHolder: {\n      name: "placeHolder",\n      control: {\n        type: "text"\n      },\n      description: "notify the user how to type a text",\n      defaultValue: "Type..."\n    },\n    multiSelect: {\n      name: "multiSelect",\n      // control: { type: "boolean",                \n      //            },\n      control: false,\n      description: "true/false - allows multi select - (switch multiSelect / singleSelect is disabled in this story)"\n    },\n    limitTagsOnMultiSelect: {\n      name: "limitTagsOnMultiSelect",\n      control: {\n        type: "number"\n      },\n      description: "limit noumber displayed tags on multi select when not focused"\n    },\n    options: {\n      description: "array [] of objects: {id: string1 , label: string2 } to fill dropdown options "\n    },\n    shape: {\n      control: {\n        type: "radio"\n      },\n      options: ["round", "square"],\n      description: "shape: round/square"\n    },\n    showPopupIcon: {\n      name: "showPopupIcon",\n      control: {\n        type: "boolean"\n      },\n      description: "show/hide popup (up/down arrow) icon"\n    },\n    showSearchIcon: {\n      name: "showSearchIcon",\n      control: {\n        type: "boolean"\n      },\n      description: "show/hide search icon "\n    },\n    onChange: {\n      action: "onChange",\n      description: "returns an option (object) selected by the user"\n    },\n    onInputChange: {\n      action: "onInputChange",\n      description: "returns a value (string) displayed in the textbox"\n    }\n  }\n};\nconst Template = args => <Dropdown {...args} />;\nexport const SmallSquare = Template.bind({});\nSmallSquare.args = {\n  width: 300,\n  size: "small",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type...",\n  shape: "square",\n  showPopupIcon: false,\n  showSearchIcon: false,\n  options: options\n};\nexport const SmallRound = Template.bind({});\nSmallRound.args = {\n  width: 300,\n  size: "small",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type...",\n  shape: "round",\n  showPopupIcon: false,\n  showSearchIcon: false,\n  options: options\n};\nexport const UpDownArrowIcon = Template.bind({});\nUpDownArrowIcon.args = {\n  width: 300,\n  size: "small",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type...",\n  shape: "round",\n  showPopupIcon: true,\n  showSearchIcon: false,\n  options: options\n};\nexport const SearchIcon = Template.bind({});\nSearchIcon.args = {\n  width: 300,\n  size: "small",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type...",\n  shape: "round",\n  showPopupIcon: false,\n  showSearchIcon: true,\n  options: options\n};\nexport const MultiSelectSmall = Template.bind({});\nMultiSelectSmall.args = {\n  width: 400,\n  size: "small",\n  text: "Retailer",\n  multiSelect: true,\n  limitTagsOnMultiSelect: 2,\n  placeHolder: "Type...",\n  shape: "square",\n  showPopupIcon: false,\n  showSearchIcon: false,\n  options: options\n};\nexport const MultiSelectLarge = Template.bind({});\nMultiSelectLarge.args = {\n  width: 500,\n  size: "large",\n  text: "Retailer",\n  multiSelect: true,\n  limitTagsOnMultiSelect: 2,\n  placeHolder: "Type...",\n  shape: "round",\n  showPopupIcon: false,\n  showSearchIcon: false,\n  options: options\n};\nexport const MultiSelectWithIcons = Template.bind({});\nMultiSelectWithIcons.args = {\n  width: 500,\n  size: "large",\n  text: "Retailer",\n  multiSelect: true,\n  limitTagsOnMultiSelect: 2,\n  placeHolder: "Type...",\n  shape: "square",\n  showPopupIcon: true,\n  showSearchIcon: true,\n  options: options\n};\nexport const LargeRoundWithoutIcons = Template.bind({});\nLargeRoundWithoutIcons.args = {\n  width: 400,\n  size: "large",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type part of name...",\n  shape: "round",\n  showPopupIcon: false,\n  showSearchIcon: false,\n  options: options\n};\nexport const LargeSquareWithIcons = Template.bind({});\nLargeSquareWithIcons.args = {\n  width: 400,\n  size: "large",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type part of name...",\n  shape: "square",\n  showPopupIcon: true,\n  showSearchIcon: true,\n  options: options\n};\nSmallSquare.parameters = {\n  ...SmallSquare.parameters,\n  docs: {\n    ...SmallSquare.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...SmallSquare.parameters?.docs?.source\n    }\n  }\n};\nSmallRound.parameters = {\n  ...SmallRound.parameters,\n  docs: {\n    ...SmallRound.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...SmallRound.parameters?.docs?.source\n    }\n  }\n};\nUpDownArrowIcon.parameters = {\n  ...UpDownArrowIcon.parameters,\n  docs: {\n    ...UpDownArrowIcon.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...UpDownArrowIcon.parameters?.docs?.source\n    }\n  }\n};\nSearchIcon.parameters = {\n  ...SearchIcon.parameters,\n  docs: {\n    ...SearchIcon.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...SearchIcon.parameters?.docs?.source\n    }\n  }\n};\nMultiSelectSmall.parameters = {\n  ...MultiSelectSmall.parameters,\n  docs: {\n    ...MultiSelectSmall.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...MultiSelectSmall.parameters?.docs?.source\n    }\n  }\n};\nMultiSelectLarge.parameters = {\n  ...MultiSelectLarge.parameters,\n  docs: {\n    ...MultiSelectLarge.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...MultiSelectLarge.parameters?.docs?.source\n    }\n  }\n};\nMultiSelectWithIcons.parameters = {\n  ...MultiSelectWithIcons.parameters,\n  docs: {\n    ...MultiSelectWithIcons.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...MultiSelectWithIcons.parameters?.docs?.source\n    }\n  }\n};\nLargeRoundWithoutIcons.parameters = {\n  ...LargeRoundWithoutIcons.parameters,\n  docs: {\n    ...LargeRoundWithoutIcons.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...LargeRoundWithoutIcons.parameters?.docs?.source\n    }\n  }\n};\nLargeSquareWithIcons.parameters = {\n  ...LargeSquareWithIcons.parameters,\n  docs: {\n    ...LargeSquareWithIcons.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...LargeSquareWithIcons.parameters?.docs?.source\n    }\n  }\n};',locationsMap:{"small-square":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"small-round":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"up-down-arrow-icon":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"search-icon":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"multi-select-small":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"multi-select-large":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"multi-select-with-icons":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"large-round-without-icons":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"large-square-with-icons":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}}}}},title:"SAG BI/Dropdown",component:Dropdown,tags:["autodocs"],argTypes:{width:{control:{type:"number"},description:"width of the input field",defaultValue:300},size:{control:{type:"radio"},options:["small","large"],description:"size: small/large"},text:{name:"text",control:{type:"text"},description:"text inside of the input field",defaultValue:"Search..."},placeHolder:{name:"placeHolder",control:{type:"text"},description:"notify the user how to type a text",defaultValue:"Type..."},multiSelect:{name:"multiSelect",control:!1,description:"true/false - allows multi select - (switch multiSelect / singleSelect is disabled in this story)"},limitTagsOnMultiSelect:{name:"limitTagsOnMultiSelect",control:{type:"number"},description:"limit noumber displayed tags on multi select when not focused"},options:{description:"array [] of objects: {id: string1 , label: string2 } to fill dropdown options "},shape:{control:{type:"radio"},options:["round","square"],description:"shape: round/square"},showPopupIcon:{name:"showPopupIcon",control:{type:"boolean"},description:"show/hide popup (up/down arrow) icon"},showSearchIcon:{name:"showSearchIcon",control:{type:"boolean"},description:"show/hide search icon "},onChange:{action:"onChange",description:"returns an option (object) selected by the user"},onInputChange:{action:"onInputChange",description:"returns a value (string) displayed in the textbox"}}};const Template=args=>(0,jsx_runtime.jsx)(Dropdown,{...args});Template.displayName="Template";const SmallSquare=Template.bind({});SmallSquare.args={width:300,size:"small",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type...",shape:"square",showPopupIcon:!1,showSearchIcon:!1,options:options};const SmallRound=Template.bind({});SmallRound.args={width:300,size:"small",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type...",shape:"round",showPopupIcon:!1,showSearchIcon:!1,options:options};const UpDownArrowIcon=Template.bind({});UpDownArrowIcon.args={width:300,size:"small",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type...",shape:"round",showPopupIcon:!0,showSearchIcon:!1,options:options};const SearchIcon=Template.bind({});SearchIcon.args={width:300,size:"small",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type...",shape:"round",showPopupIcon:!1,showSearchIcon:!0,options:options};const MultiSelectSmall=Template.bind({});MultiSelectSmall.args={width:400,size:"small",text:"Retailer",multiSelect:!0,limitTagsOnMultiSelect:2,placeHolder:"Type...",shape:"square",showPopupIcon:!1,showSearchIcon:!1,options:options};const MultiSelectLarge=Template.bind({});MultiSelectLarge.args={width:500,size:"large",text:"Retailer",multiSelect:!0,limitTagsOnMultiSelect:2,placeHolder:"Type...",shape:"round",showPopupIcon:!1,showSearchIcon:!1,options:options};const MultiSelectWithIcons=Template.bind({});MultiSelectWithIcons.args={width:500,size:"large",text:"Retailer",multiSelect:!0,limitTagsOnMultiSelect:2,placeHolder:"Type...",shape:"square",showPopupIcon:!0,showSearchIcon:!0,options:options};const LargeRoundWithoutIcons=Template.bind({});LargeRoundWithoutIcons.args={width:400,size:"large",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type part of name...",shape:"round",showPopupIcon:!1,showSearchIcon:!1,options:options};const LargeSquareWithIcons=Template.bind({});LargeSquareWithIcons.args={width:400,size:"large",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type part of name...",shape:"square",showPopupIcon:!0,showSearchIcon:!0,options:options},SmallSquare.parameters={...SmallSquare.parameters,docs:{...SmallSquare.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...SmallSquare.parameters?.docs?.source}}},SmallRound.parameters={...SmallRound.parameters,docs:{...SmallRound.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...SmallRound.parameters?.docs?.source}}},UpDownArrowIcon.parameters={...UpDownArrowIcon.parameters,docs:{...UpDownArrowIcon.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...UpDownArrowIcon.parameters?.docs?.source}}},SearchIcon.parameters={...SearchIcon.parameters,docs:{...SearchIcon.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...SearchIcon.parameters?.docs?.source}}},MultiSelectSmall.parameters={...MultiSelectSmall.parameters,docs:{...MultiSelectSmall.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...MultiSelectSmall.parameters?.docs?.source}}},MultiSelectLarge.parameters={...MultiSelectLarge.parameters,docs:{...MultiSelectLarge.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...MultiSelectLarge.parameters?.docs?.source}}},MultiSelectWithIcons.parameters={...MultiSelectWithIcons.parameters,docs:{...MultiSelectWithIcons.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...MultiSelectWithIcons.parameters?.docs?.source}}},LargeRoundWithoutIcons.parameters={...LargeRoundWithoutIcons.parameters,docs:{...LargeRoundWithoutIcons.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...LargeRoundWithoutIcons.parameters?.docs?.source}}},LargeSquareWithIcons.parameters={...LargeSquareWithIcons.parameters,docs:{...LargeSquareWithIcons.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...LargeSquareWithIcons.parameters?.docs?.source}}};const __namedExportsOrder=["SmallSquare","SmallRound","UpDownArrowIcon","SearchIcon","MultiSelectSmall","MultiSelectLarge","MultiSelectWithIcons","LargeRoundWithoutIcons","LargeSquareWithIcons"]}}]);
+"use strict";(self.webpackChunksag_storybook=self.webpackChunksag_storybook||[]).push([[935],{"./src/stories/Dropdown.stories.jsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{LargeRoundWithoutIcons:function(){return LargeRoundWithoutIcons},LargeSquareWithIcons:function(){return LargeSquareWithIcons},MultiSelectLarge:function(){return MultiSelectLarge},MultiSelectSmall:function(){return MultiSelectSmall},MultiSelectWithIcons:function(){return MultiSelectWithIcons},SearchIcon:function(){return SearchIcon},SmallRound:function(){return SmallRound},SmallSquare:function(){return SmallSquare},UpDownArrowIcon:function(){return UpDownArrowIcon},__namedExportsOrder:function(){return __namedExportsOrder},default:function(){return Dropdown_stories}});var react=__webpack_require__("./node_modules/react/index.js");const DropdownContainer=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js").ZP.div`
+  width: ${props=>props.width};  
+  text-align: left;  
+  position: relative; 
+  align-items: center;
+  justify-content: center;
+`;var Autocomplete=__webpack_require__("./node_modules/@mui/material/Autocomplete/Autocomplete.js"),TextField=__webpack_require__("./node_modules/@mui/material/TextField/TextField.js"),Checkbox=__webpack_require__("./node_modules/@mui/material/Checkbox/Checkbox.js"),InputAdornment=__webpack_require__("./node_modules/@mui/material/InputAdornment/InputAdornment.js"),CheckBoxOutlineBlank=__webpack_require__("./node_modules/@mui/icons-material/CheckBoxOutlineBlank.js"),CheckBox=__webpack_require__("./node_modules/@mui/icons-material/CheckBox.js"),Search=__webpack_require__("./node_modules/@mui/icons-material/Search.js"),ArrowDropDown=__webpack_require__("./node_modules/@mui/icons-material/ArrowDropDown.js"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const icon=(0,jsx_runtime.jsx)(CheckBoxOutlineBlank.Z,{fontSize:"small"}),checkedIcon=(0,jsx_runtime.jsx)(CheckBox.Z,{fontSize:"small"}),Dropdown=({width:width,size:size,text:text,shape:shape,placeHolder:placeHolder,multiSelect:multiSelect,limitTagsOnMultiSelect:limitTagsOnMultiSelect,showPopupIcon:showPopupIcon,showSearchIcon:showSearchIcon,options:options,onChange:onChange,onInputChange:onInputChange})=>{const[currentInputValue,setCurrentInputValue]=(0,react.useState)(null),[currentOption,setCurrentOption]=(0,react.useState)(null);(0,react.useEffect)((()=>{const delayDebounceFn=setTimeout((()=>{onInputChange(currentInputValue)}),1e3);return()=>clearTimeout(delayDebounceFn)}),[currentInputValue]);const getTextFieldStyle=()=>"round"===shape?{"& .MuiOutlinedInput-root":{borderRadius:"50px",legend:{marginLeft:"30px"}},"& .MuiAutocomplete-inputRoot":{paddingLeft:"20px !important",borderRadius:"50px"},"& .MuiInputLabel-outlined":{paddingLeft:"20px"},"& .MuiInputLabel-shrink":{marginLeft:"20px",paddingLeft:"10px",paddingRight:0,background:"white"}}:null,onInputChangeHandler=(event,newInputValue)=>{setCurrentInputValue({syntheticBaseEvent:event,inputValue:newInputValue})},onChangeHandler=(event,newValue)=>{setCurrentOption(newValue),onChange(event,newValue)};return(0,jsx_runtime.jsx)(DropdownContainer,{width:width,children:multiSelect?(0,jsx_runtime.jsx)(Autocomplete.Z,{onChange:(event,newValue)=>{onChangeHandler(event,newValue)},onInputChange:(event,newInputValue)=>{onInputChangeHandler(event,newInputValue)},multiple:!0,limitTags:limitTagsOnMultiSelect,size:size,id:"checkboxes-tags",options:options,disableCloseOnSelect:!0,getOptionLabel:option=>option.label,popupIcon:showPopupIcon?(0,jsx_runtime.jsx)(ArrowDropDown.Z,{}):null,renderOption:(props,option,{selected:selected})=>(0,jsx_runtime.jsxs)("li",{...props,children:[(0,jsx_runtime.jsx)(Checkbox.Z,{icon:icon,checkedIcon:checkedIcon,style:{marginRight:8},checked:selected}),option.label]}),style:{width:width},renderInput:params=>showSearchIcon&&(!currentOption||currentOption&&0===currentOption.length)?(0,jsx_runtime.jsx)(TextField.Z,{...params,label:text,size:size,sx:getTextFieldStyle(),placeholder:placeHolder,InputProps:{...params.InputProps,startAdornment:(0,jsx_runtime.jsx)(InputAdornment.Z,{position:"start",children:(0,jsx_runtime.jsx)(Search.Z,{fontSize:"medium"})})}}):(0,jsx_runtime.jsx)(TextField.Z,{...params,label:text,size:size,sx:getTextFieldStyle(),placeholder:placeHolder})}):(0,jsx_runtime.jsx)(Autocomplete.Z,{onChange:(event,newValue)=>{onChangeHandler(event,newValue)},onInputChange:(event,newInputValue)=>{onInputChangeHandler(event,newInputValue)},disablePortal:!0,id:"combo-box",options:options,sx:{width:width},popupIcon:showPopupIcon?(0,jsx_runtime.jsx)(ArrowDropDown.Z,{}):null,forcePopupIcon:"auto",renderInput:params=>(0,jsx_runtime.jsx)(TextField.Z,{...params,label:text,size:size,sx:getTextFieldStyle(),placeholder:placeHolder,InputProps:{...params.InputProps,startAdornment:showSearchIcon?(0,jsx_runtime.jsx)(InputAdornment.Z,{position:"start",children:(0,jsx_runtime.jsx)(Search.Z,{fontSize:"medium"})}):null}})})})};Dropdown.displayName="Dropdown";const options=[{id:0,label:"Shufersal"},{id:1,label:"EPC"},{id:2,label:"Food Lion"},{id:3,label:"Hannaford"},{id:4,label:"Giant Food"},{id:5,label:"The Giant Company"},{id:6,label:"Stop&Shop"},{id:7,label:"Price Chopper"},{id:8,label:"South Eastern Grocers"}];var Dropdown_stories={parameters:{storySource:{source:'import React from "react";\nimport { Dropdown } from "./Dropdown";\nconst options = [{\n  id: 0,\n  label: "Shufersal"\n}, {\n  id: 1,\n  label: "EPC"\n}, {\n  id: 2,\n  label: "Food Lion"\n}, {\n  id: 3,\n  label: "Hannaford"\n}, {\n  id: 4,\n  label: "Giant Food"\n}, {\n  id: 5,\n  label: "The Giant Company"\n}, {\n  id: 6,\n  label: "Stop&Shop"\n}, {\n  id: 7,\n  label: "Price Chopper"\n}, {\n  id: 8,\n  label: "South Eastern Grocers"\n}];\n\n// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction\nexport default {\n  title: "SAG BI/Dropdown",\n  component: Dropdown,\n  tags: ["autodocs"],\n  argTypes: {\n    width: {\n      control: {\n        type: "number"\n      },\n      description: "width of the input field",\n      defaultValue: 300\n    },\n    size: {\n      control: {\n        type: "radio"\n      },\n      options: ["small", "large"],\n      description: "size: small/large"\n    },\n    text: {\n      name: "text",\n      control: {\n        type: "text"\n      },\n      description: "text inside of the input field",\n      defaultValue: \'Search...\'\n    },\n    placeHolder: {\n      name: "placeHolder",\n      control: {\n        type: "text"\n      },\n      description: "notify the user how to type a text",\n      defaultValue: "Type..."\n    },\n    multiSelect: {\n      name: "multiSelect",\n      // control: { type: "boolean",                \n      //            },\n      control: false,\n      description: "true/false - allows multi select - (switch multiSelect / singleSelect is disabled in this story)"\n    },\n    limitTagsOnMultiSelect: {\n      name: "limitTagsOnMultiSelect",\n      control: {\n        type: "number"\n      },\n      description: "limit noumber displayed tags on multi select when not focused"\n    },\n    options: {\n      description: "array [] of objects: {id: string1 , label: string2 } to fill dropdown options "\n    },\n    shape: {\n      control: {\n        type: "radio"\n      },\n      options: ["round", "square"],\n      description: "shape: round/square"\n    },\n    showPopupIcon: {\n      name: "showPopupIcon",\n      control: {\n        type: "boolean"\n      },\n      description: "show/hide popup (up/down arrow) icon"\n    },\n    showSearchIcon: {\n      name: "showSearchIcon",\n      control: {\n        type: "boolean"\n      },\n      description: "show/hide search icon "\n    },\n    onChange: {\n      action: "onChange",\n      description: "returns an option (object) selected by the user"\n    },\n    onInputChange: {\n      action: "onInputChange",\n      description: "returns a value (string) displayed in the textbox"\n    }\n  }\n};\nconst Template = args => <Dropdown {...args} />;\nexport const SmallSquare = Template.bind({});\nSmallSquare.args = {\n  width: 300,\n  size: "small",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type...",\n  shape: "square",\n  showPopupIcon: false,\n  showSearchIcon: false,\n  options: options\n};\nexport const SmallRound = Template.bind({});\nSmallRound.args = {\n  width: 300,\n  size: "small",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type...",\n  shape: "round",\n  showPopupIcon: false,\n  showSearchIcon: false,\n  options: options\n};\nexport const UpDownArrowIcon = Template.bind({});\nUpDownArrowIcon.args = {\n  width: 300,\n  size: "small",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type...",\n  shape: "round",\n  showPopupIcon: true,\n  showSearchIcon: false,\n  options: options\n};\nexport const SearchIcon = Template.bind({});\nSearchIcon.args = {\n  width: 300,\n  size: "small",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type...",\n  shape: "round",\n  showPopupIcon: false,\n  showSearchIcon: true,\n  options: options\n};\nexport const MultiSelectSmall = Template.bind({});\nMultiSelectSmall.args = {\n  width: 400,\n  size: "small",\n  text: "Retailer",\n  multiSelect: true,\n  limitTagsOnMultiSelect: 2,\n  placeHolder: "Type...",\n  shape: "square",\n  showPopupIcon: false,\n  showSearchIcon: false,\n  options: options\n};\nexport const MultiSelectLarge = Template.bind({});\nMultiSelectLarge.args = {\n  width: 500,\n  size: "large",\n  text: "Retailer",\n  multiSelect: true,\n  limitTagsOnMultiSelect: 2,\n  placeHolder: "Type...",\n  shape: "round",\n  showPopupIcon: false,\n  showSearchIcon: false,\n  options: options\n};\nexport const MultiSelectWithIcons = Template.bind({});\nMultiSelectWithIcons.args = {\n  width: 500,\n  size: "large",\n  text: "Retailer",\n  multiSelect: true,\n  limitTagsOnMultiSelect: 2,\n  placeHolder: "Type...",\n  shape: "square",\n  showPopupIcon: true,\n  showSearchIcon: true,\n  options: options\n};\nexport const LargeRoundWithoutIcons = Template.bind({});\nLargeRoundWithoutIcons.args = {\n  width: 400,\n  size: "large",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type part of name...",\n  shape: "round",\n  showPopupIcon: false,\n  showSearchIcon: false,\n  options: options\n};\nexport const LargeSquareWithIcons = Template.bind({});\nLargeSquareWithIcons.args = {\n  width: 400,\n  size: "large",\n  text: "Retailer",\n  multiSelect: false,\n  limitTagsOnMultiSelect: 0,\n  placeHolder: "Type part of name...",\n  shape: "square",\n  showPopupIcon: true,\n  showSearchIcon: true,\n  options: options\n};\nSmallSquare.parameters = {\n  ...SmallSquare.parameters,\n  docs: {\n    ...SmallSquare.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...SmallSquare.parameters?.docs?.source\n    }\n  }\n};\nSmallRound.parameters = {\n  ...SmallRound.parameters,\n  docs: {\n    ...SmallRound.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...SmallRound.parameters?.docs?.source\n    }\n  }\n};\nUpDownArrowIcon.parameters = {\n  ...UpDownArrowIcon.parameters,\n  docs: {\n    ...UpDownArrowIcon.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...UpDownArrowIcon.parameters?.docs?.source\n    }\n  }\n};\nSearchIcon.parameters = {\n  ...SearchIcon.parameters,\n  docs: {\n    ...SearchIcon.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...SearchIcon.parameters?.docs?.source\n    }\n  }\n};\nMultiSelectSmall.parameters = {\n  ...MultiSelectSmall.parameters,\n  docs: {\n    ...MultiSelectSmall.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...MultiSelectSmall.parameters?.docs?.source\n    }\n  }\n};\nMultiSelectLarge.parameters = {\n  ...MultiSelectLarge.parameters,\n  docs: {\n    ...MultiSelectLarge.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...MultiSelectLarge.parameters?.docs?.source\n    }\n  }\n};\nMultiSelectWithIcons.parameters = {\n  ...MultiSelectWithIcons.parameters,\n  docs: {\n    ...MultiSelectWithIcons.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...MultiSelectWithIcons.parameters?.docs?.source\n    }\n  }\n};\nLargeRoundWithoutIcons.parameters = {\n  ...LargeRoundWithoutIcons.parameters,\n  docs: {\n    ...LargeRoundWithoutIcons.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...LargeRoundWithoutIcons.parameters?.docs?.source\n    }\n  }\n};\nLargeSquareWithIcons.parameters = {\n  ...LargeSquareWithIcons.parameters,\n  docs: {\n    ...LargeSquareWithIcons.parameters?.docs,\n    source: {\n      originalSource: "args => <Dropdown {...args} />",\n      ...LargeSquareWithIcons.parameters?.docs?.source\n    }\n  }\n};',locationsMap:{"small-square":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"small-round":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"up-down-arrow-icon":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"search-icon":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"multi-select-small":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"multi-select-large":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"multi-select-with-icons":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"large-round-without-icons":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}},"large-square-with-icons":{startLoc:{col:17,line:116},endLoc:{col:47,line:116},startBody:{col:17,line:116},endBody:{col:47,line:116}}}}},title:"SAG BI/Dropdown",component:Dropdown,tags:["autodocs"],argTypes:{width:{control:{type:"number"},description:"width of the input field",defaultValue:300},size:{control:{type:"radio"},options:["small","large"],description:"size: small/large"},text:{name:"text",control:{type:"text"},description:"text inside of the input field",defaultValue:"Search..."},placeHolder:{name:"placeHolder",control:{type:"text"},description:"notify the user how to type a text",defaultValue:"Type..."},multiSelect:{name:"multiSelect",control:!1,description:"true/false - allows multi select - (switch multiSelect / singleSelect is disabled in this story)"},limitTagsOnMultiSelect:{name:"limitTagsOnMultiSelect",control:{type:"number"},description:"limit noumber displayed tags on multi select when not focused"},options:{description:"array [] of objects: {id: string1 , label: string2 } to fill dropdown options "},shape:{control:{type:"radio"},options:["round","square"],description:"shape: round/square"},showPopupIcon:{name:"showPopupIcon",control:{type:"boolean"},description:"show/hide popup (up/down arrow) icon"},showSearchIcon:{name:"showSearchIcon",control:{type:"boolean"},description:"show/hide search icon "},onChange:{action:"onChange",description:"returns an option (object) selected by the user"},onInputChange:{action:"onInputChange",description:"returns a value (string) displayed in the textbox"}}};const Template=args=>(0,jsx_runtime.jsx)(Dropdown,{...args});Template.displayName="Template";const SmallSquare=Template.bind({});SmallSquare.args={width:300,size:"small",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type...",shape:"square",showPopupIcon:!1,showSearchIcon:!1,options:options};const SmallRound=Template.bind({});SmallRound.args={width:300,size:"small",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type...",shape:"round",showPopupIcon:!1,showSearchIcon:!1,options:options};const UpDownArrowIcon=Template.bind({});UpDownArrowIcon.args={width:300,size:"small",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type...",shape:"round",showPopupIcon:!0,showSearchIcon:!1,options:options};const SearchIcon=Template.bind({});SearchIcon.args={width:300,size:"small",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type...",shape:"round",showPopupIcon:!1,showSearchIcon:!0,options:options};const MultiSelectSmall=Template.bind({});MultiSelectSmall.args={width:400,size:"small",text:"Retailer",multiSelect:!0,limitTagsOnMultiSelect:2,placeHolder:"Type...",shape:"square",showPopupIcon:!1,showSearchIcon:!1,options:options};const MultiSelectLarge=Template.bind({});MultiSelectLarge.args={width:500,size:"large",text:"Retailer",multiSelect:!0,limitTagsOnMultiSelect:2,placeHolder:"Type...",shape:"round",showPopupIcon:!1,showSearchIcon:!1,options:options};const MultiSelectWithIcons=Template.bind({});MultiSelectWithIcons.args={width:500,size:"large",text:"Retailer",multiSelect:!0,limitTagsOnMultiSelect:2,placeHolder:"Type...",shape:"square",showPopupIcon:!0,showSearchIcon:!0,options:options};const LargeRoundWithoutIcons=Template.bind({});LargeRoundWithoutIcons.args={width:400,size:"large",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type part of name...",shape:"round",showPopupIcon:!1,showSearchIcon:!1,options:options};const LargeSquareWithIcons=Template.bind({});LargeSquareWithIcons.args={width:400,size:"large",text:"Retailer",multiSelect:!1,limitTagsOnMultiSelect:0,placeHolder:"Type part of name...",shape:"square",showPopupIcon:!0,showSearchIcon:!0,options:options},SmallSquare.parameters={...SmallSquare.parameters,docs:{...SmallSquare.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...SmallSquare.parameters?.docs?.source}}},SmallRound.parameters={...SmallRound.parameters,docs:{...SmallRound.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...SmallRound.parameters?.docs?.source}}},UpDownArrowIcon.parameters={...UpDownArrowIcon.parameters,docs:{...UpDownArrowIcon.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...UpDownArrowIcon.parameters?.docs?.source}}},SearchIcon.parameters={...SearchIcon.parameters,docs:{...SearchIcon.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...SearchIcon.parameters?.docs?.source}}},MultiSelectSmall.parameters={...MultiSelectSmall.parameters,docs:{...MultiSelectSmall.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...MultiSelectSmall.parameters?.docs?.source}}},MultiSelectLarge.parameters={...MultiSelectLarge.parameters,docs:{...MultiSelectLarge.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...MultiSelectLarge.parameters?.docs?.source}}},MultiSelectWithIcons.parameters={...MultiSelectWithIcons.parameters,docs:{...MultiSelectWithIcons.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...MultiSelectWithIcons.parameters?.docs?.source}}},LargeRoundWithoutIcons.parameters={...LargeRoundWithoutIcons.parameters,docs:{...LargeRoundWithoutIcons.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...LargeRoundWithoutIcons.parameters?.docs?.source}}},LargeSquareWithIcons.parameters={...LargeSquareWithIcons.parameters,docs:{...LargeSquareWithIcons.parameters?.docs,source:{originalSource:"args => <Dropdown {...args} />",...LargeSquareWithIcons.parameters?.docs?.source}}};const __namedExportsOrder=["SmallSquare","SmallRound","UpDownArrowIcon","SearchIcon","MultiSelectSmall","MultiSelectLarge","MultiSelectWithIcons","LargeRoundWithoutIcons","LargeSquareWithIcons"]}}]);
 //# sourceMappingURL=Dropdown-stories.825dde1a.iframe.bundle.js.map

package/storybook-static/Introduction-mdx.f8264230.iframe.bundle.js

@@ -1,2 +1,2 @@
-/*! For license information please see Introduction-mdx.f8264230.iframe.bundle.js.LICENSE.txt */
+/*! For license information please see Introduction-mdx.f8264230.iframe.bundle.js.LICENSE.txt */
 "use strict";(self.webpackChunksag_storybook=self.webpackChunksag_storybook||[]).push([[281],{"./node_modules/@mdx-js/react/lib/index.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.d(__webpack_exports__,{NF:function(){return withMDXComponents},Zo:function(){return MDXProvider},ah:function(){return useMDXComponents},pC:function(){return MDXContext}});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js");const MDXContext=react__WEBPACK_IMPORTED_MODULE_0__.createContext({});function withMDXComponents(Component){return function boundMDXComponent(props){const allComponents=useMDXComponents(props.components);return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component,{...props,allComponents:allComponents})}}function useMDXComponents(components){const contextComponents=react__WEBPACK_IMPORTED_MODULE_0__.useContext(MDXContext);return react__WEBPACK_IMPORTED_MODULE_0__.useMemo((()=>"function"==typeof components?components(contextComponents):{...contextComponents,...components}),[contextComponents,components])}const emptyObject={};function MDXProvider({components:components,children:children,disableParentContext:disableParentContext}){let allComponents;return allComponents=disableParentContext?"function"==typeof components?components({}):components||emptyObject:useMDXComponents(components),react__WEBPACK_IMPORTED_MODULE_0__.createElement(MDXContext.Provider,{value:allComponents},children)}},"./src/stories/Introduction.mdx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:function(){return Introduction}});__webpack_require__("./node_modules/react/index.js");var jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js"),lib=__webpack_require__("./node_modules/@mdx-js/react/lib/index.js"),dist=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs");__webpack_require__.p,__webpack_require__.p,__webpack_require__.p,__webpack_require__.p,__webpack_require__.p,__webpack_require__.p,__webpack_require__.p,__webpack_require__.p;function _createMdxContent(props){const _components=Object.assign({h1:"h1"},(0,lib.ah)(),props.components);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(dist.h_,{title:"SAG/Introduction"}),"\n",(0,jsx_runtime.jsx)("style",{children:"\n    .subheading {\n      --mediumdark: '#999999';\n      font-weight: 700;\n      font-size: 13px;\n      color: #999;\n      letter-spacing: 6px;\n      line-height: 24px;\n      text-transform: uppercase;\n      margin-bottom: 12px;\n      margin-top: 40px;\n    }\n\n    .link-list {\n      display: grid;\n      grid-template-columns: 1fr;\n      grid-template-rows: 1fr 1fr;\n      row-gap: 10px;\n    }\n\n    @media (min-width: 620px) {\n      .link-list {\n        row-gap: 20px;\n        column-gap: 20px;\n        grid-template-columns: 1fr 1fr;\n      }\n    }\n\n    @media all and (-ms-high-contrast:none) {\n    .link-list {\n        display: -ms-grid;\n        -ms-grid-columns: 1fr 1fr;\n        -ms-grid-rows: 1fr 1fr;\n      }\n    }\n\n    .link-item {\n      display: block;\n      padding: 20px;\n      border: 1px solid #00000010;\n      border-radius: 5px;\n      transition: background 150ms ease-out, border 150ms ease-out, transform 150ms ease-out;\n      color: #333333;\n      display: flex;\n      align-items: flex-start;\n    }\n\n    .link-item:hover {\n      border-color: #1EA7FD50;\n      transform: translate3d(0, -3px, 0);\n      box-shadow: rgba(0, 0, 0, 0.08) 0 3px 10px 0;\n    }\n\n    .link-item:active {\n      border-color: #1EA7FD;\n      transform: translate3d(0, 0, 0);\n    }\n\n    .link-item strong {\n      font-weight: 700;\n      display: block;\n      margin-bottom: 2px;\n    }\n\n    .link-item img {\n      height: 40px;\n      width: 40px;\n      margin-right: 15px;\n      flex: none;\n    }\n\n    .link-item span,\n    .link-item p {\n      margin: 0;\n      font-size: 14px;\n      line-height: 20px;\n    }\n\n    .tip {\n      display: inline-block;\n      border-radius: 1em;\n      font-size: 11px;\n      line-height: 12px;\n      font-weight: 700;\n      background: #E7FDD8;\n      color: #66BF3C;\n      padding: 4px 12px;\n      margin-right: 10px;\n      vertical-align: top;\n    }\n\n    .tip-wrapper {\n      font-size: 13px;\n      line-height: 20px;\n      margin-top: 40px;\n      margin-bottom: 40px;\n    }\n\n    .tip-wrapper code {\n      font-size: 12px;\n      display: inline-block;\n    }\n  "}),"\n",(0,jsx_runtime.jsx)(_components.h1,{id:"welcome-to-sagramata-storybook",children:"Welcome to Sagramata Storybook"})]})}var Introduction=function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.ah)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,Object.assign({},props,{children:(0,jsx_runtime.jsx)(_createMdxContent,props)})):_createMdxContent(props)}},"./node_modules/react/cjs/react-jsx-runtime.production.min.js":function(__unused_webpack_module,exports,__webpack_require__){var f=__webpack_require__("./node_modules/react/index.js"),k=Symbol.for("react.element"),l=Symbol.for("react.fragment"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};function q(c,a,g){var b,d={},e=null,h=null;for(b in void 0!==g&&(e=""+g),void 0!==a.key&&(e=""+a.key),void 0!==a.ref&&(h=a.ref),a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}exports.Fragment=l,exports.jsx=q,exports.jsxs=q},"./node_modules/react/jsx-runtime.js":function(module,__unused_webpack_exports,__webpack_require__){module.exports=__webpack_require__("./node_modules/react/cjs/react-jsx-runtime.production.min.js")}}]);

package/storybook-static/Introduction-mdx.f8264230.iframe.bundle.js.LICENSE.txt

@@ -1,9 +1,9 @@
-/**
- * @license React
- * react-jsx-runtime.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
+/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */

package/storybook-static/OneColumnContainer-stories.65049871.iframe.bundle.js

@@ -1,36 +1,36 @@
-/*! For license information please see OneColumnContainer-stories.65049871.iframe.bundle.js.LICENSE.txt */
-"use strict";(self.webpackChunksag_storybook=self.webpackChunksag_storybook||[]).push([[510],{"./node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.d(__webpack_exports__,{Z:function(){return isPropValid}});var _emotion_memoize__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@emotion/memoize/dist/emotion-memoize.esm.js"),reactPropsRegex=/^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/,isPropValid=(0,_emotion_memoize__WEBPACK_IMPORTED_MODULE_0__.Z)((function(prop){return reactPropsRegex.test(prop)||111===prop.charCodeAt(0)&&110===prop.charCodeAt(1)&&prop.charCodeAt(2)<91}))},"./node_modules/@emotion/memoize/dist/emotion-memoize.esm.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){function memoize(fn){var cache=Object.create(null);return function(arg){return void 0===cache[arg]&&(cache[arg]=fn(arg)),cache[arg]}}__webpack_require__.d(__webpack_exports__,{Z:function(){return memoize}})},"./src/stories/OneColumnContainer.stories.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Primary:function(){return Primary},__namedExportsOrder:function(){return __namedExportsOrder},default:function(){return OneColumnContainer_stories}});var react=__webpack_require__("./node_modules/react/index.js"),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js");const StyledContainer=styled_components_browser_esm.ZP.div`
-  width: ${props=>props.width};
-  height: ${props=>props.height};
-  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; 
-  display: flex;
-  position: relative;
-  border-radius: 10px;
-  align-items: center;
-  justify-content: center;
-  overflow: hidden;
-`,InfoTextContainer=styled_components_browser_esm.ZP.div`
-  width: ${props=>props.width};
-  height: ${props=>props.height};
-  align-items: center;
-  display: flex;
-  visibility: ${props=>props.clicked?"visible":"hidden"};
-  text-align: center;
-  justify-content: center;
-  background: rgba(16, 16, 16, .6);
-`,InfoTextLabel=styled_components_browser_esm.ZP.div`
-  align-items: center;
-  text-align: center;
-  color: white;
-  margin: 10px;
-  justify-content: center;
-`,IconContainer=styled_components_browser_esm.ZP.div`
-  width: 15px;
-  height: 15px;
-  position: absolute;
-  margin-top:10px;
-  margin-right:10px;
-  top: 0;
-  right: 0;
-`;var jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const InfoIcon=({clicked:clicked})=>(0,jsx_runtime.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:clicked?"white":"black",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"feather feather-info",children:[(0,jsx_runtime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,jsx_runtime.jsx)("line",{x1:"12",y1:"16",x2:"12",y2:"12"}),(0,jsx_runtime.jsx)("line",{x1:"12",y1:"8",x2:"12",y2:"8"})]});InfoIcon.displayName="InfoIcon";const OneColumnContainer=({width:width,height:height,infoText:infoText,...props})=>{const[clicked,setClicked]=(0,react.useState)(!1);return(0,jsx_runtime.jsxs)(StyledContainer,{width:width,height:height,children:[(0,jsx_runtime.jsx)(InfoTextContainer,{clicked:clicked,width:width,height:height,children:(0,jsx_runtime.jsx)(InfoTextLabel,{children:infoText})}),(0,jsx_runtime.jsx)(IconContainer,{onClick:()=>{setClicked(!clicked)},children:(0,jsx_runtime.jsx)(InfoIcon,{clicked:clicked})})]})};OneColumnContainer.displayName="OneColumnContainer",OneColumnContainer.propTypes={},OneColumnContainer.defaultProps={};var OneColumnContainer_stories={parameters:{storySource:{source:'import { OneColumnContainer } from \'./OneColumnContainer\';\n\n// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction\nexport default {\n  title: \'Sag BI/OneColumnContainer\',\n  component: OneColumnContainer,\n  tags: [\'autodocs\']\n};\n\n// More on writing stories with args: https://storybook.js.org/docs/react/writing-stories/args\nexport const Primary = {\n  args: {\n    infoText: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s",\n    width: "250px",\n    height: "250px"\n  }\n};\nPrimary.parameters = {\n  ...Primary.parameters,\n  docs: {\n    ...Primary.parameters?.docs,\n    source: {\n      originalSource: "{\\n  args: {\\n    infoText: \\"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s\\",\\n    width: \\"250px\\",\\n    height: \\"250px\\"\\n  }\\n}",\n      ...Primary.parameters?.docs?.source\n    }\n  }\n};',locationsMap:{primary:{startLoc:{col:23,line:11},endLoc:{col:1,line:17},startBody:{col:23,line:11},endBody:{col:1,line:17}}}}},title:"Sag BI/OneColumnContainer",component:OneColumnContainer,tags:["autodocs"]};const Primary={args:{infoText:"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s",width:"250px",height:"250px"}};Primary.parameters={...Primary.parameters,docs:{...Primary.parameters?.docs,source:{originalSource:'{\n  args: {\n    infoText: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s",\n    width: "250px",\n    height: "250px"\n  }\n}',...Primary.parameters?.docs?.source}}};const __namedExportsOrder=["Primary"]},"./node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js":function(module,__unused_webpack_exports,__webpack_require__){var reactIs=__webpack_require__("./node_modules/hoist-non-react-statics/node_modules/react-is/index.js"),REACT_STATICS={childContextTypes:!0,contextType:!0,contextTypes:!0,defaultProps:!0,displayName:!0,getDefaultProps:!0,getDerivedStateFromError:!0,getDerivedStateFromProps:!0,mixins:!0,propTypes:!0,type:!0},KNOWN_STATICS={name:!0,length:!0,prototype:!0,caller:!0,callee:!0,arguments:!0,arity:!0},MEMO_STATICS={$$typeof:!0,compare:!0,defaultProps:!0,displayName:!0,propTypes:!0,type:!0},TYPE_STATICS={};function getStatics(component){return reactIs.isMemo(component)?MEMO_STATICS:TYPE_STATICS[component.$$typeof]||REACT_STATICS}TYPE_STATICS[reactIs.ForwardRef]={$$typeof:!0,render:!0,defaultProps:!0,displayName:!0,propTypes:!0},TYPE_STATICS[reactIs.Memo]=MEMO_STATICS;var defineProperty=Object.defineProperty,getOwnPropertyNames=Object.getOwnPropertyNames,getOwnPropertySymbols=Object.getOwnPropertySymbols,getOwnPropertyDescriptor=Object.getOwnPropertyDescriptor,getPrototypeOf=Object.getPrototypeOf,objectPrototype=Object.prototype;module.exports=function hoistNonReactStatics(targetComponent,sourceComponent,blacklist){if("string"!=typeof sourceComponent){if(objectPrototype){var inheritedComponent=getPrototypeOf(sourceComponent);inheritedComponent&&inheritedComponent!==objectPrototype&&hoistNonReactStatics(targetComponent,inheritedComponent,blacklist)}var keys=getOwnPropertyNames(sourceComponent);getOwnPropertySymbols&&(keys=keys.concat(getOwnPropertySymbols(sourceComponent)));for(var targetStatics=getStatics(targetComponent),sourceStatics=getStatics(sourceComponent),i=0;i<keys.length;++i){var key=keys[i];if(!(KNOWN_STATICS[key]||blacklist&&blacklist[key]||sourceStatics&&sourceStatics[key]||targetStatics&&targetStatics[key])){var descriptor=getOwnPropertyDescriptor(sourceComponent,key);try{defineProperty(targetComponent,key,descriptor)}catch(e){}}}}return targetComponent}},"./node_modules/hoist-non-react-statics/node_modules/react-is/cjs/react-is.production.min.js":function(__unused_webpack_module,exports){var b="function"==typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;function z(a){if("object"==typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}exports.AsyncMode=l,exports.ConcurrentMode=m,exports.ContextConsumer=k,exports.ContextProvider=h,exports.Element=c,exports.ForwardRef=n,exports.Fragment=e,exports.Lazy=t,exports.Memo=r,exports.Portal=d,exports.Profiler=g,exports.StrictMode=f,exports.Suspense=p,exports.isAsyncMode=function(a){return A(a)||z(a)===l},exports.isConcurrentMode=A,exports.isContextConsumer=function(a){return z(a)===k},exports.isContextProvider=function(a){return z(a)===h},exports.isElement=function(a){return"object"==typeof a&&null!==a&&a.$$typeof===c},exports.isForwardRef=function(a){return z(a)===n},exports.isFragment=function(a){return z(a)===e},exports.isLazy=function(a){return z(a)===t},exports.isMemo=function(a){return z(a)===r},exports.isPortal=function(a){return z(a)===d},exports.isProfiler=function(a){return z(a)===g},exports.isStrictMode=function(a){return z(a)===f},exports.isSuspense=function(a){return z(a)===p},exports.isValidElementType=function(a){return"string"==typeof a||"function"==typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"==typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)},exports.typeOf=z},"./node_modules/hoist-non-react-statics/node_modules/react-is/index.js":function(module,__unused_webpack_exports,__webpack_require__){module.exports=__webpack_require__("./node_modules/hoist-non-react-statics/node_modules/react-is/cjs/react-is.production.min.js")},"./node_modules/react/cjs/react-jsx-runtime.production.min.js":function(__unused_webpack_module,exports,__webpack_require__){var f=__webpack_require__("./node_modules/react/index.js"),k=Symbol.for("react.element"),l=Symbol.for("react.fragment"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};function q(c,a,g){var b,d={},e=null,h=null;for(b in void 0!==g&&(e=""+g),void 0!==a.key&&(e=""+a.key),void 0!==a.ref&&(h=a.ref),a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}exports.Fragment=l,exports.jsx=q,exports.jsxs=q},"./node_modules/react/jsx-runtime.js":function(module,__unused_webpack_exports,__webpack_require__){module.exports=__webpack_require__("./node_modules/react/cjs/react-jsx-runtime.production.min.js")}}]);
+/*! For license information please see OneColumnContainer-stories.65049871.iframe.bundle.js.LICENSE.txt */
+"use strict";(self.webpackChunksag_storybook=self.webpackChunksag_storybook||[]).push([[510],{"./node_modules/@emotion/is-prop-valid/dist/emotion-is-prop-valid.esm.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.d(__webpack_exports__,{Z:function(){return isPropValid}});var _emotion_memoize__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@emotion/memoize/dist/emotion-memoize.esm.js"),reactPropsRegex=/^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/,isPropValid=(0,_emotion_memoize__WEBPACK_IMPORTED_MODULE_0__.Z)((function(prop){return reactPropsRegex.test(prop)||111===prop.charCodeAt(0)&&110===prop.charCodeAt(1)&&prop.charCodeAt(2)<91}))},"./node_modules/@emotion/memoize/dist/emotion-memoize.esm.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){function memoize(fn){var cache=Object.create(null);return function(arg){return void 0===cache[arg]&&(cache[arg]=fn(arg)),cache[arg]}}__webpack_require__.d(__webpack_exports__,{Z:function(){return memoize}})},"./src/stories/OneColumnContainer.stories.js":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Primary:function(){return Primary},__namedExportsOrder:function(){return __namedExportsOrder},default:function(){return OneColumnContainer_stories}});var react=__webpack_require__("./node_modules/react/index.js"),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js");const StyledContainer=styled_components_browser_esm.ZP.div`
+  width: ${props=>props.width};
+  height: ${props=>props.height};
+  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; 
+  display: flex;
+  position: relative;
+  border-radius: 10px;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+`,InfoTextContainer=styled_components_browser_esm.ZP.div`
+  width: ${props=>props.width};
+  height: ${props=>props.height};
+  align-items: center;
+  display: flex;
+  visibility: ${props=>props.clicked?"visible":"hidden"};
+  text-align: center;
+  justify-content: center;
+  background: rgba(16, 16, 16, .6);
+`,InfoTextLabel=styled_components_browser_esm.ZP.div`
+  align-items: center;
+  text-align: center;
+  color: white;
+  margin: 10px;
+  justify-content: center;
+`,IconContainer=styled_components_browser_esm.ZP.div`
+  width: 15px;
+  height: 15px;
+  position: absolute;
+  margin-top:10px;
+  margin-right:10px;
+  top: 0;
+  right: 0;
+`;var jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const InfoIcon=({clicked:clicked})=>(0,jsx_runtime.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:clicked?"white":"black",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"feather feather-info",children:[(0,jsx_runtime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,jsx_runtime.jsx)("line",{x1:"12",y1:"16",x2:"12",y2:"12"}),(0,jsx_runtime.jsx)("line",{x1:"12",y1:"8",x2:"12",y2:"8"})]});InfoIcon.displayName="InfoIcon";const OneColumnContainer=({width:width,height:height,infoText:infoText,...props})=>{const[clicked,setClicked]=(0,react.useState)(!1);return(0,jsx_runtime.jsxs)(StyledContainer,{width:width,height:height,children:[(0,jsx_runtime.jsx)(InfoTextContainer,{clicked:clicked,width:width,height:height,children:(0,jsx_runtime.jsx)(InfoTextLabel,{children:infoText})}),(0,jsx_runtime.jsx)(IconContainer,{onClick:()=>{setClicked(!clicked)},children:(0,jsx_runtime.jsx)(InfoIcon,{clicked:clicked})})]})};OneColumnContainer.displayName="OneColumnContainer",OneColumnContainer.propTypes={},OneColumnContainer.defaultProps={};var OneColumnContainer_stories={parameters:{storySource:{source:'import { OneColumnContainer } from \'./OneColumnContainer\';\n\n// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction\nexport default {\n  title: \'Sag BI/OneColumnContainer\',\n  component: OneColumnContainer,\n  tags: [\'autodocs\']\n};\n\n// More on writing stories with args: https://storybook.js.org/docs/react/writing-stories/args\nexport const Primary = {\n  args: {\n    infoText: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s",\n    width: "250px",\n    height: "250px"\n  }\n};\nPrimary.parameters = {\n  ...Primary.parameters,\n  docs: {\n    ...Primary.parameters?.docs,\n    source: {\n      originalSource: "{\\n  args: {\\n    infoText: \\"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s\\",\\n    width: \\"250px\\",\\n    height: \\"250px\\"\\n  }\\n}",\n      ...Primary.parameters?.docs?.source\n    }\n  }\n};',locationsMap:{primary:{startLoc:{col:23,line:11},endLoc:{col:1,line:17},startBody:{col:23,line:11},endBody:{col:1,line:17}}}}},title:"Sag BI/OneColumnContainer",component:OneColumnContainer,tags:["autodocs"]};const Primary={args:{infoText:"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s",width:"250px",height:"250px"}};Primary.parameters={...Primary.parameters,docs:{...Primary.parameters?.docs,source:{originalSource:'{\n  args: {\n    infoText: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s",\n    width: "250px",\n    height: "250px"\n  }\n}',...Primary.parameters?.docs?.source}}};const __namedExportsOrder=["Primary"]},"./node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js":function(module,__unused_webpack_exports,__webpack_require__){var reactIs=__webpack_require__("./node_modules/hoist-non-react-statics/node_modules/react-is/index.js"),REACT_STATICS={childContextTypes:!0,contextType:!0,contextTypes:!0,defaultProps:!0,displayName:!0,getDefaultProps:!0,getDerivedStateFromError:!0,getDerivedStateFromProps:!0,mixins:!0,propTypes:!0,type:!0},KNOWN_STATICS={name:!0,length:!0,prototype:!0,caller:!0,callee:!0,arguments:!0,arity:!0},MEMO_STATICS={$$typeof:!0,compare:!0,defaultProps:!0,displayName:!0,propTypes:!0,type:!0},TYPE_STATICS={};function getStatics(component){return reactIs.isMemo(component)?MEMO_STATICS:TYPE_STATICS[component.$$typeof]||REACT_STATICS}TYPE_STATICS[reactIs.ForwardRef]={$$typeof:!0,render:!0,defaultProps:!0,displayName:!0,propTypes:!0},TYPE_STATICS[reactIs.Memo]=MEMO_STATICS;var defineProperty=Object.defineProperty,getOwnPropertyNames=Object.getOwnPropertyNames,getOwnPropertySymbols=Object.getOwnPropertySymbols,getOwnPropertyDescriptor=Object.getOwnPropertyDescriptor,getPrototypeOf=Object.getPrototypeOf,objectPrototype=Object.prototype;module.exports=function hoistNonReactStatics(targetComponent,sourceComponent,blacklist){if("string"!=typeof sourceComponent){if(objectPrototype){var inheritedComponent=getPrototypeOf(sourceComponent);inheritedComponent&&inheritedComponent!==objectPrototype&&hoistNonReactStatics(targetComponent,inheritedComponent,blacklist)}var keys=getOwnPropertyNames(sourceComponent);getOwnPropertySymbols&&(keys=keys.concat(getOwnPropertySymbols(sourceComponent)));for(var targetStatics=getStatics(targetComponent),sourceStatics=getStatics(sourceComponent),i=0;i<keys.length;++i){var key=keys[i];if(!(KNOWN_STATICS[key]||blacklist&&blacklist[key]||sourceStatics&&sourceStatics[key]||targetStatics&&targetStatics[key])){var descriptor=getOwnPropertyDescriptor(sourceComponent,key);try{defineProperty(targetComponent,key,descriptor)}catch(e){}}}}return targetComponent}},"./node_modules/hoist-non-react-statics/node_modules/react-is/cjs/react-is.production.min.js":function(__unused_webpack_module,exports){var b="function"==typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;function z(a){if("object"==typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}exports.AsyncMode=l,exports.ConcurrentMode=m,exports.ContextConsumer=k,exports.ContextProvider=h,exports.Element=c,exports.ForwardRef=n,exports.Fragment=e,exports.Lazy=t,exports.Memo=r,exports.Portal=d,exports.Profiler=g,exports.StrictMode=f,exports.Suspense=p,exports.isAsyncMode=function(a){return A(a)||z(a)===l},exports.isConcurrentMode=A,exports.isContextConsumer=function(a){return z(a)===k},exports.isContextProvider=function(a){return z(a)===h},exports.isElement=function(a){return"object"==typeof a&&null!==a&&a.$$typeof===c},exports.isForwardRef=function(a){return z(a)===n},exports.isFragment=function(a){return z(a)===e},exports.isLazy=function(a){return z(a)===t},exports.isMemo=function(a){return z(a)===r},exports.isPortal=function(a){return z(a)===d},exports.isProfiler=function(a){return z(a)===g},exports.isStrictMode=function(a){return z(a)===f},exports.isSuspense=function(a){return z(a)===p},exports.isValidElementType=function(a){return"string"==typeof a||"function"==typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"==typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)},exports.typeOf=z},"./node_modules/hoist-non-react-statics/node_modules/react-is/index.js":function(module,__unused_webpack_exports,__webpack_require__){module.exports=__webpack_require__("./node_modules/hoist-non-react-statics/node_modules/react-is/cjs/react-is.production.min.js")},"./node_modules/react/cjs/react-jsx-runtime.production.min.js":function(__unused_webpack_module,exports,__webpack_require__){var f=__webpack_require__("./node_modules/react/index.js"),k=Symbol.for("react.element"),l=Symbol.for("react.fragment"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};function q(c,a,g){var b,d={},e=null,h=null;for(b in void 0!==g&&(e=""+g),void 0!==a.key&&(e=""+a.key),void 0!==a.ref&&(h=a.ref),a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}exports.Fragment=l,exports.jsx=q,exports.jsxs=q},"./node_modules/react/jsx-runtime.js":function(module,__unused_webpack_exports,__webpack_require__){module.exports=__webpack_require__("./node_modules/react/cjs/react-jsx-runtime.production.min.js")}}]);
 //# sourceMappingURL=OneColumnContainer-stories.65049871.iframe.bundle.js.map

package/storybook-static/OneColumnContainer-stories.65049871.iframe.bundle.js.LICENSE.txt

@@ -1,18 +1,18 @@
-/**
- * @license React
- * react-jsx-runtime.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-/** @license React v16.13.1
- * react-is.production.min.js
- *
- * Copyright (c) Facebook, Inc. and its affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
+/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** @license React v16.13.1
+ * react-is.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */

package/storybook-static/favicon.svg

@@ -1,7 +1,7 @@
-<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="164" height="164">
-  <svg width="164" height="164" viewBox="0 0 164 164" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M22.467 147.762 17.5 15.402a8.062 8.062 0 0 1 7.553-8.35L137.637.016a8.061 8.061 0 0 1 8.565 8.047v144.23a8.063 8.063 0 0 1-8.424 8.054l-107.615-4.833a8.062 8.062 0 0 1-7.695-7.752Z" fill="#FF4785"></path>
-    <path fill-rule="evenodd" clip-rule="evenodd" d="m128.785.57-15.495.968-.755 18.172a1.203 1.203 0 0 0 1.928 1.008l7.06-5.354 5.962 4.697a1.202 1.202 0 0 0 1.946-.987L128.785.569Zm-12.059 60.856c-2.836 2.203-23.965 3.707-23.965.57.447-11.969-4.912-12.494-7.889-12.494-2.828 0-7.59.855-7.59 7.267 0 6.534 6.96 10.223 15.13 14.553 11.607 6.15 25.654 13.594 25.654 32.326 0 17.953-14.588 27.871-33.194 27.871-19.201 0-35.981-7.769-34.086-34.702.744-3.163 25.156-2.411 25.156 0-.298 11.114 2.232 14.383 8.633 14.383 4.912 0 7.144-2.708 7.144-7.267 0-6.9-7.252-10.973-15.595-15.657C64.827 81.933 51.53 74.468 51.53 57.34c0-17.098 11.76-28.497 32.747-28.497 20.988 0 32.449 11.224 32.449 32.584Z" fill="#fff"></path>
-  </svg>
-  <style>@media (prefers-color-scheme: light) { :root { filter: none; } }</style>
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="164" height="164">
+  <svg width="164" height="164" viewBox="0 0 164 164" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M22.467 147.762 17.5 15.402a8.062 8.062 0 0 1 7.553-8.35L137.637.016a8.061 8.061 0 0 1 8.565 8.047v144.23a8.063 8.063 0 0 1-8.424 8.054l-107.615-4.833a8.062 8.062 0 0 1-7.695-7.752Z" fill="#FF4785"></path>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="m128.785.57-15.495.968-.755 18.172a1.203 1.203 0 0 0 1.928 1.008l7.06-5.354 5.962 4.697a1.202 1.202 0 0 0 1.946-.987L128.785.569Zm-12.059 60.856c-2.836 2.203-23.965 3.707-23.965.57.447-11.969-4.912-12.494-7.889-12.494-2.828 0-7.59.855-7.59 7.267 0 6.534 6.96 10.223 15.13 14.553 11.607 6.15 25.654 13.594 25.654 32.326 0 17.953-14.588 27.871-33.194 27.871-19.201 0-35.981-7.769-34.086-34.702.744-3.163 25.156-2.411 25.156 0-.298 11.114 2.232 14.383 8.633 14.383 4.912 0 7.144-2.708 7.144-7.267 0-6.9-7.252-10.973-15.595-15.657C64.827 81.933 51.53 74.468 51.53 57.34c0-17.098 11.76-28.497 32.747-28.497 20.988 0 32.449 11.224 32.449 32.584Z" fill="#fff"></path>
+  </svg>
+  <style>@media (prefers-color-scheme: light) { :root { filter: none; } }</style>
 </svg>