freemium-ui 2.0.49 → 2.0.51

package/storybook-static/stories-Toast-stories.5446eb58.iframe.bundle.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkfreemium_ui=self.webpackChunkfreemium_ui||[]).push([[77960],{"./src/stories/Toast.stories.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Primary:()=>Primary,UseToasts:()=>UseToasts,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_components_Button__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/components/Button/index.ts"),_components_Toast_ToastContext__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/components/Toast/ToastContext.ts"),_components_Toast_ToastItem__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/components/Toast/ToastItem.tsx"),_components_Toast_use_toasts__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/components/Toast/use-toasts.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/react/jsx-runtime.js");const __WEBPACK_DEFAULT_EXPORT__={title:"Components/Toast",component:_components_Toast_ToastItem__WEBPACK_IMPORTED_MODULE_3__.z,parameters:{layout:"centered"},tags:["autodocs"],argTypes:{}};let count=1;const PrimaryStory=props=>{var _React$useContext,_props$type2,_props$delay2;const{addToast}=null!==(_React$useContext=react__WEBPACK_IMPORTED_MODULE_0__.useContext(_components_Toast_ToastContext__WEBPACK_IMPORTED_MODULE_2__.$))&&void 0!==_React$useContext?_React$useContext:{};return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",gap:"16px"},children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_Button__WEBPACK_IMPORTED_MODULE_1__.$,{style:{width:"fit-content"},onClick:()=>{addToast({text:"Toast - Ticket properties updated. Check audit-logs for more details - ".concat(count++),type:"success",delay:1e4}),setTimeout((()=>{addToast({text:"Toast - Ticket properties updated. Check audit-logs for more details - ".concat(count++),type:"error",delay:1e4}),setTimeout((()=>{addToast({text:"Toast - Ticket properties updated. Check audit-logs for more details - ".concat(count++),type:"warning",delay:1e4}),setTimeout((()=>{addToast({text:"Toast - Ticket properties updated. Check audit-logs for more details - ".concat(count++),type:"error",delay:1e4})}),1e3)}),1e3)}),1e3)},children:"Random"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_Button__WEBPACK_IMPORTED_MODULE_1__.$,{style:{width:"fit-content"},onClick:()=>{var _props$text,_props$type,_props$delay;addToast({text:null!==(_props$text=props.text)&&void 0!==_props$text?_props$text:"",type:null!==(_props$type=props.type)&&void 0!==_props$type?_props$type:"success",delay:null!==(_props$delay=props.delay)&&void 0!==_props$delay?_props$delay:30})},children:"Open ".concat(null!==(_props$type2=props.type)&&void 0!==_props$type2?_props$type2:"success"," toast (").concat((null!==(_props$delay2=props.delay)&&void 0!==_props$delay2?_props$delay2:3e3)/1e3,"s)")}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("code",{children:JSON.stringify(props,null,"\t")})]})},Primary={render:function Render(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(PrimaryStory,{delay:props.delay,type:props.type,text:props.text})},args:{id:"1",text:"Title 1",type:"success",delay:3e3,index:0}},UseToastsStory=props=>{var _props$type4,_props$delay4;const[,setToast]=(0,_components_Toast_use_toasts__WEBPACK_IMPORTED_MODULE_4__.Y)();return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",gap:"16px"},children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_components_Button__WEBPACK_IMPORTED_MODULE_1__.$,{style:{width:"fit-content"},onClick:()=>{var _props$text2,_props$type3,_props$delay3;setToast({text:null!==(_props$text2=props.text)&&void 0!==_props$text2?_props$text2:"",type:null!==(_props$type3=props.type)&&void 0!==_props$type3?_props$type3:"success",delay:null!==(_props$delay3=props.delay)&&void 0!==_props$delay3?_props$delay3:30,showProgress:props.showProgress,fixed:props.fixed})},children:"Open ".concat(null!==(_props$type4=props.type)&&void 0!==_props$type4?_props$type4:"success"," toast (").concat((null!==(_props$delay4=props.delay)&&void 0!==_props$delay4?_props$delay4:3e3)/1e3,"s)")}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("code",{children:JSON.stringify(props,null,"\t")})]})},UseToasts={render:function Render(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(UseToastsStory,{...props})},args:{id:"1",text:"Title 1",type:"success",delay:3e3,index:0,showProgress:!0,fixed:!1}},__namedExportsOrder=["Primary","UseToasts"];Primary.parameters={...Primary.parameters,docs:{...Primary.parameters?.docs,source:{originalSource:"{\n  render: function Render(props) {\n    return <PrimaryStory delay={props.delay} type={props.type} text={props.text} />;\n  },\n  args: {\n    id: '1',\n    text: 'Title 1',\n    type: 'success',\n    delay: 3000,\n    index: 0\n  }\n}",...Primary.parameters?.docs?.source}}},UseToasts.parameters={...UseToasts.parameters,docs:{...UseToasts.parameters?.docs,source:{originalSource:"{\n  render: function Render(props) {\n    return <UseToastsStory {...props} />;\n  },\n  args: {\n    id: '1',\n    text: 'Title 1',\n    type: 'success',\n    delay: 3000,\n    index: 0,\n    showProgress: true,\n    fixed: false\n  }\n}",...UseToasts.parameters?.docs?.source}}}},"./src/components/Button/Button.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>Button_Button});var react=__webpack_require__("./node_modules/react/index.js"),taggedTemplateLiteral=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js"),styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js");const ButtonSizeMap={large:{height:"45px",size:"16px"},mini:{height:"24px",size:"12px"},normal:{height:"32px",size:"14px"}};var _templateObject;const StyledButton=styled_components_browser_esm.Ay.button(_templateObject||(_templateObject=(0,taggedTemplateLiteral.A)(["\n  direction: ",";\n  font-weight: ",";\n  font-family: ",";\n  border-radius: 4px;\n  display: ",";\n  border: 1px solid\n    ",";\n  background: linear-gradient(\n    180deg,\n    ","\n      2.56%,\n    ","\n      95.75%\n  );\n  color: ",";\n  height: ",";\n  line-height: 1.3;\n  font-size: ",";\n  cursor: ",";\n  white-space: nowrap;\n  padding: 0 12px;\n  &:hover {\n    background: ",";\n  }\n  &:active {\n    background: ",";\n    border-color: ",";\n  }\n  &:disabled {\n    color: ",";\n    border-color: ",";\n    background: linear-gradient(\n      180deg,\n      ","\n        4.39%,\n      ","\n        94.46%\n    );\n  }\n"])),(_ref=>{let{theme}=_ref;return theme.direction}),(_ref2=>{let{theme}=_ref2;return theme.typography.fontWeight["semi-bold"]}),(_ref3=>{let{theme}=_ref3;return theme.typography.fontFamily}),(_ref4=>{let{$inline}=_ref4;return $inline?"inline-block":"block"}),(_ref5=>{let{theme,variant}=_ref5;return theme.components.button[variant].borderColor}),(_ref6=>{let{theme,variant}=_ref6;return theme.components.button[variant].backgroundFrom}),(_ref7=>{let{theme,variant}=_ref7;return theme.components.button[variant].backgroundTo}),(_ref8=>{let{theme,variant}=_ref8;return theme.components.button[variant].color}),(_ref9=>{let{size}=_ref9;return ButtonSizeMap[size].height}),(_ref10=>{let{size}=_ref10;return ButtonSizeMap[size].size}),(_ref11=>{let{disabled}=_ref11;return disabled?"not-allowed":"pointer"}),(_ref12=>{let{theme,variant}=_ref12;return theme.components.button[variant].hoverColor}),(_ref13=>{let{theme,variant}=_ref13;return theme.components.button[variant].activeBackgroundColor}),(_ref14=>{let{theme,variant}=_ref14;return theme.components.button[variant].activeBorderColor}),(_ref15=>{let{theme,variant}=_ref15;return theme.components.button[variant].disabledColor}),(_ref16=>{let{theme,variant}=_ref16;return theme.components.button[variant].disabledBorderColor}),(_ref17=>{let{theme,variant}=_ref17;return theme.components.button[variant].disabledBackgroundFrom}),(_ref18=>{let{theme,variant}=_ref18;return theme.components.button[variant].disabledBackgroundTo}));var jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const Button=react.forwardRef(((_ref,forwardedRef)=>{let{size="normal",variant="primary",children="",loading=!1,inline=!0,...props}=_ref;return react.useEffect((()=>{"string"==typeof children||props["aria-label"]||console.warn("The `aria-label` prop is required when the children of the Button are not a string. This is to ensure that assistive technologies can announce the content of the button. Please provide a valid `aria-describedby` prop to the Button component.")}),[]),(0,jsx_runtime.jsx)(StyledButton,{size,variant,$inline:inline,disabled:props.disabled||loading,"aria-disabled":props.disabled||loading,"aria-label":"string"==typeof children?children:void 0,role:"button",...props,ref:forwardedRef,children:loading?(0,jsx_runtime.jsx)(Loader,{}):children})})),Loader=()=>(0,jsx_runtime.jsx)(jsx_runtime.Fragment,{children:"..."}),Button_Button=Button;try{Button.displayName="Button",Button.__docgenInfo={description:"Button displays a button on the user interface and enables performing specific actions based on the button type. The button’s label can be a text, icon, or both.",displayName:"Button",props:{size:{defaultValue:{value:"normal"},description:"The size of the button",name:"size",required:!1,type:{name:"enum",value:[{value:'"large"'},{value:'"mini"'},{value:'"normal"'}]}},variant:{defaultValue:{value:"primary"},description:"The variant of the button",name:"variant",required:!1,type:{name:"enum",value:[{value:'"primary"'},{value:'"secondary"'},{value:'"link"'},{value:'"danger"'}]}},children:{defaultValue:{value:""},description:"The children to be displayed in the button",name:"children",required:!1,type:{name:"ReactNode"}},loading:{defaultValue:{value:"false"},description:"Whether the button is loading",name:"loading",required:!1,type:{name:"boolean"}},inline:{defaultValue:{value:"true"},description:"Whether the button is inline",name:"inline",required:!1,type:{name:"boolean"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Button/Button.tsx#Button"]={docgenInfo:Button.__docgenInfo,name:"Button",path:"src/components/Button/Button.tsx#Button"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Button/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{$:()=>_Button__WEBPACK_IMPORTED_MODULE_0__.A});var _Button__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/components/Button/Button.tsx")}}]);

package/storybook-static/stories-Toggle-stories.4799c618.iframe.bundle.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkfreemium_ui=self.webpackChunkfreemium_ui||[]).push([[54107],{"./node_modules/@radix-ui/react-use-previous/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{Z:()=>$010c2913dbd2fe3d$export$5cae361ad82dce8b});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js");function $010c2913dbd2fe3d$export$5cae361ad82dce8b(value){const ref=(0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)({value,previous:value});return(0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)((()=>(ref.current.value!==value&&(ref.current.previous=ref.current.value,ref.current.value=value),ref.current.previous)),[value])}},"./node_modules/@radix-ui/react-use-size/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{X:()=>$db6c3485150b8e66$export$1ab7ae714698c4b8});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_radix_ui_react_use_layout_effect__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@radix-ui/react-use-layout-effect/dist/index.mjs");function $db6c3485150b8e66$export$1ab7ae714698c4b8(element){const[size,setSize]=(0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(void 0);return(0,_radix_ui_react_use_layout_effect__WEBPACK_IMPORTED_MODULE_1__.N)((()=>{if(element){setSize({width:element.offsetWidth,height:element.offsetHeight});const resizeObserver=new ResizeObserver((entries=>{if(!Array.isArray(entries))return;if(!entries.length)return;const entry=entries[0];let width,height;if("borderBoxSize"in entry){const borderSizeEntry=entry.borderBoxSize,borderSize=Array.isArray(borderSizeEntry)?borderSizeEntry[0]:borderSizeEntry;width=borderSize.inlineSize,height=borderSize.blockSize}else width=element.offsetWidth,height=element.offsetHeight;setSize({width,height})}));return resizeObserver.observe(element,{box:"border-box"}),()=>resizeObserver.unobserve(element)}setSize(void 0)}),[element]),size}},"./src/stories/Toggle.stories.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Bottom:()=>Bottom,__namedExportsOrder:()=>__namedExportsOrder,default:()=>Toggle_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"),Cross=__webpack_require__("./src/components/Icons/Cross.tsx"),TickIcon=__webpack_require__("./src/components/Icons/TickIcon.tsx");const TickIconMap={sm:{width:6,height:4.3},md:{width:8,height:5.73},lg:{width:10,height:7.16}},CrossIconMap={sm:{width:4.5,height:4.5},md:{width:6,height:6},lg:{width:8,height:8}};var taggedTemplateLiteral=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js"),esm_extends=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/extends.js"),dist=__webpack_require__("./node_modules/@radix-ui/primitive/dist/index.mjs"),react_compose_refs_dist=__webpack_require__("./node_modules/@radix-ui/react-compose-refs/dist/index.mjs"),react_context_dist=__webpack_require__("./node_modules/@radix-ui/react-context/dist/index.mjs"),react_use_controllable_state_dist=__webpack_require__("./node_modules/@radix-ui/react-use-controllable-state/dist/index.mjs"),react_use_previous_dist=__webpack_require__("./node_modules/@radix-ui/react-use-previous/dist/index.mjs"),react_use_size_dist=__webpack_require__("./node_modules/@radix-ui/react-use-size/dist/index.mjs"),react_primitive_dist=__webpack_require__("./node_modules/@radix-ui/react-primitive/dist/index.mjs");const[$6be4966fd9bbc698$var$createSwitchContext,$6be4966fd9bbc698$export$cf7f5f17f69cbd43]=(0,react_context_dist.A)("Switch"),[$6be4966fd9bbc698$var$SwitchProvider,$6be4966fd9bbc698$var$useSwitchContext]=$6be4966fd9bbc698$var$createSwitchContext("Switch"),$6be4966fd9bbc698$export$b5d5cf8927ab7262=(0,react.forwardRef)(((props,forwardedRef)=>{const{__scopeSwitch,name,checked:checkedProp,defaultChecked,required,disabled,value="on",onCheckedChange,...switchProps}=props,[button,setButton]=(0,react.useState)(null),composedRefs=(0,react_compose_refs_dist.s)(forwardedRef,(node=>setButton(node))),hasConsumerStoppedPropagationRef=(0,react.useRef)(!1),isFormControl=!button||Boolean(button.closest("form")),[checked=!1,setChecked]=(0,react_use_controllable_state_dist.i)({prop:checkedProp,defaultProp:defaultChecked,onChange:onCheckedChange});return(0,react.createElement)($6be4966fd9bbc698$var$SwitchProvider,{scope:__scopeSwitch,checked,disabled},(0,react.createElement)(react_primitive_dist.sG.button,(0,esm_extends.A)({type:"button",role:"switch","aria-checked":checked,"aria-required":required,"data-state":$6be4966fd9bbc698$var$getState(checked),"data-disabled":disabled?"":void 0,disabled,value},switchProps,{ref:composedRefs,onClick:(0,dist.m)(props.onClick,(event=>{setChecked((prevChecked=>!prevChecked)),isFormControl&&(hasConsumerStoppedPropagationRef.current=event.isPropagationStopped(),hasConsumerStoppedPropagationRef.current||event.stopPropagation())}))})),isFormControl&&(0,react.createElement)($6be4966fd9bbc698$var$BubbleInput,{control:button,bubbles:!hasConsumerStoppedPropagationRef.current,name,value,checked,required,disabled,style:{transform:"translateX(-100%)"}}))})),$6be4966fd9bbc698$export$4d07bf653ea69106=(0,react.forwardRef)(((props,forwardedRef)=>{const{__scopeSwitch,...thumbProps}=props,context=$6be4966fd9bbc698$var$useSwitchContext("SwitchThumb",__scopeSwitch);return(0,react.createElement)(react_primitive_dist.sG.span,(0,esm_extends.A)({"data-state":$6be4966fd9bbc698$var$getState(context.checked),"data-disabled":context.disabled?"":void 0},thumbProps,{ref:forwardedRef}))})),$6be4966fd9bbc698$var$BubbleInput=props=>{const{control,checked,bubbles=!0,...inputProps}=props,ref=(0,react.useRef)(null),prevChecked=(0,react_use_previous_dist.Z)(checked),controlSize=(0,react_use_size_dist.X)(control);return(0,react.useEffect)((()=>{const input=ref.current,inputProto=window.HTMLInputElement.prototype,setChecked=Object.getOwnPropertyDescriptor(inputProto,"checked").set;if(prevChecked!==checked&&setChecked){const event=new Event("click",{bubbles});setChecked.call(input,checked),input.dispatchEvent(event)}}),[prevChecked,checked,bubbles]),(0,react.createElement)("input",(0,esm_extends.A)({type:"checkbox","aria-hidden":!0,defaultChecked:checked},inputProps,{tabIndex:-1,ref,style:{...props.style,...controlSize,position:"absolute",pointerEvents:"none",opacity:0,margin:0}}))};function $6be4966fd9bbc698$var$getState(checked){return checked?"checked":"unchecked"}const $6be4966fd9bbc698$export$be92b6f5f03c0fe9=$6be4966fd9bbc698$export$b5d5cf8927ab7262,$6be4966fd9bbc698$export$6521433ed15a34db=$6be4966fd9bbc698$export$4d07bf653ea69106;var _templateObject,_templateObject2;const VariantMapping={sm:{width:28,height:12,thumb:16,offTransform:[-2,-2],onTransform:[14,-2]},md:{width:36,height:16,thumb:20,offTransform:[-2,-2],onTransform:[18,-2]},lg:{width:44,height:20,thumb:24,offTransform:[-2,-2],onTransform:[22,-2]}},StyledSwitchRoot=(0,styled_components_browser_esm.Ay)($6be4966fd9bbc698$export$be92b6f5f03c0fe9)(_templateObject||(_templateObject=(0,taggedTemplateLiteral.A)(["\n  margin: 0;\n  padding: 0;\n  outline: 0;\n  border: none;\n  position: relative;\n  width: ","px;\n  height: ","px;\n  border-radius: ","px;\n  &[data-disabled] {\n    opacity: 0.5;\n  }\n  &[data-state='unchecked'] {\n    background-color: ",";\n    &:focus {\n      span {\n        box-shadow: 0 0 0 1px ",";\n      }\n    }\n  }\n  &[data-state='checked'] {\n    background-color: ",";\n    &:focus {\n      span {\n        box-shadow: 0 0 0 1px ",";\n      }\n    }\n  }\n"])),(_ref=>{let{size}=_ref;return VariantMapping[size].width}),(_ref2=>{let{size}=_ref2;return VariantMapping[size].height}),(_ref3=>{let{size}=_ref3;return VariantMapping[size].height/2}),(_ref4=>{let{theme}=_ref4;return theme.colors.border.hover}),(_ref5=>{let{theme}=_ref5;return theme.colors.border.hover}),(_ref6=>{let{theme}=_ref6;return theme.colors.common.accent}),(_ref7=>{let{theme}=_ref7;return theme.colors.border.active})),StyledThumbRoot=(0,styled_components_browser_esm.Ay)($6be4966fd9bbc698$export$6521433ed15a34db)(_templateObject2||(_templateObject2=(0,taggedTemplateLiteral.A)(["\n  display: grid;\n  place-content: center;\n  width: ","px;\n  height: ","px;\n  border-radius: 50%;\n  background-color: ",";\n  transition: transform 100ms;\n  transform: translate(\n    ","\n  );\n  will-change: transform;\n  overflow: hidden;\n  &[data-state='unchecked']:not([data-disabled]) {\n    &:hover {\n      box-shadow: 0 0 0 3px ","30;\n    }\n  }\n  &[data-state='unchecked'] {\n    border: 1px solid ",";\n    svg.toggle-on {\n      display: none;\n    }\n  }\n  &[data-state='checked']:not([data-disabled]) {\n    &:hover {\n      box-shadow: 0 0 0 3px ","30;\n    }\n  }\n  &[data-state='checked'] {\n    transform: translate(\n      ","\n    );\n    border: 1px solid ",";\n    svg.toggle-off {\n      display: none;\n    }\n  }\n"])),(_ref8=>{let{size}=_ref8;return VariantMapping[size].thumb}),(_ref9=>{let{size}=_ref9;return VariantMapping[size].thumb}),(_ref10=>{let{theme}=_ref10;return theme.colors.common.white}),(_ref11=>{let{theme,size}=_ref11;return("ltr"===theme.direction?VariantMapping[size].offTransform:VariantMapping[size].onTransform).map((v=>"".concat(v,"px"))).join(",")}),(_ref12=>{let{theme}=_ref12;return theme.colors.border.hover}),(_ref13=>{let{theme}=_ref13;return theme.colors.border.hover}),(_ref14=>{let{theme}=_ref14;return theme.colors.border.active}),(_ref15=>{let{theme,size}=_ref15;return("ltr"===theme.direction?VariantMapping[size].onTransform:VariantMapping[size].offTransform).map((v=>"".concat(v,"px"))).join(",")}),(_ref16=>{let{theme}=_ref16;return theme.colors.common.accent}));var jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const Toggle=_ref=>{let{handleChange,hasIcon=!1,on,isErrored,isRequired,size="md",thumbProps,...rest}=_ref;const theme=(0,styled_components_browser_esm.DP)();return(0,jsx_runtime.jsx)(StyledSwitchRoot,{checked:on,onCheckedChange:checked=>{null==handleChange||handleChange(checked)},required:isRequired,"aria-required":isRequired,size,...rest,children:(0,jsx_runtime.jsxs)(StyledThumbRoot,{...thumbProps,size,children:[hasIcon&&(0,jsx_runtime.jsx)(TickIcon.A,{fill:theme.colors.common.accent,className:"toggle-on",...TickIconMap[size]}),hasIcon&&(0,jsx_runtime.jsx)(Cross.A,{fill:theme.colors.text.primary,className:"toggle-off",...CrossIconMap[size]})]})})},Toggle_Toggle=Toggle;try{Toggle.displayName="Toggle",Toggle.__docgenInfo={description:"Toggle component is used to show a toggle to the user. It is used to show a switch to the user. It can be used to show a switch to the user.",displayName:"Toggle",props:{on:{defaultValue:null,description:"The position of the tooltip",name:"on",required:!1,type:{name:"boolean"}},handleChange:{defaultValue:null,description:"",name:"handleChange",required:!1,type:{name:"((on: boolean) => void)"}},size:{defaultValue:{value:"md"},description:"Is the button inline",name:"size",required:!1,type:{name:"enum",value:[{value:'"sm"'},{value:'"md"'},{value:'"lg"'}]}},hasIcon:{defaultValue:{value:"false"},description:"Is hasIcon enabled?",name:"hasIcon",required:!1,type:{name:"boolean"}},thumbProps:{defaultValue:null,description:"",name:"thumbProps",required:!1,type:{name:"HTMLAttributes<HTMLSpanElement>"}},isRequired:{defaultValue:null,description:"Is this a required field?",name:"isRequired",required:!1,type:{name:"boolean"}},isErrored:{defaultValue:null,description:"Is this a error field?",name:"isErrored",required:!1,type:{name:"boolean"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Toggle/Toggle.tsx#Toggle"]={docgenInfo:Toggle.__docgenInfo,name:"Toggle",path:"src/components/Toggle/Toggle.tsx#Toggle"})}catch(__react_docgen_typescript_loader_error){}const Toggle_stories={title:"Components/Toggle",component:Toggle_Toggle,parameters:{layout:"centered"},tags:["autodocs"],argTypes:{disabled:{control:"boolean"}}},Bottom={render:props=>(0,jsx_runtime.jsx)(Toggle_Toggle,{...props}),args:{hasIcon:!1,size:"md",disabled:!1}},__namedExportsOrder=["Bottom"];Bottom.parameters={...Bottom.parameters,docs:{...Bottom.parameters?.docs,source:{originalSource:"{\n  render: props => <Toggle {...props} />,\n  args: {\n    hasIcon: false,\n    size: 'md',\n    disabled: false\n  }\n}",...Bottom.parameters?.docs?.source}}}}}]);

package/storybook-static/stories-Tooltip-stories.80fa3278.iframe.bundle.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkfreemium_ui=self.webpackChunkfreemium_ui||[]).push([[9656],{"./node_modules/@radix-ui/react-id/dist/index.mjs":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{var react__WEBPACK_IMPORTED_MODULE_0___namespace_cache;__webpack_require__.d(__webpack_exports__,{B:()=>$1746a345f3d73bb7$export$f680877a34711e37});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js"),_radix_ui_react_use_layout_effect__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/@radix-ui/react-use-layout-effect/dist/index.mjs");const $1746a345f3d73bb7$var$useReactId=(react__WEBPACK_IMPORTED_MODULE_0___namespace_cache||(react__WEBPACK_IMPORTED_MODULE_0___namespace_cache=__webpack_require__.t(react__WEBPACK_IMPORTED_MODULE_0__,2)))["useId".toString()]||(()=>{});let $1746a345f3d73bb7$var$count=0;function $1746a345f3d73bb7$export$f680877a34711e37(deterministicId){const[id,setId]=react__WEBPACK_IMPORTED_MODULE_0__.useState($1746a345f3d73bb7$var$useReactId());return(0,_radix_ui_react_use_layout_effect__WEBPACK_IMPORTED_MODULE_1__.N)((()=>{deterministicId||setId((reactId=>null!=reactId?reactId:String($1746a345f3d73bb7$var$count++)))}),[deterministicId]),deterministicId||(id?`radix-${id}`:"")}},"./src/stories/Tooltip.stories.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Bottom:()=>Bottom,__namedExportsOrder:()=>__namedExportsOrder,default:()=>Tooltip_stories});var react=__webpack_require__("./node_modules/react/index.js"),styles=__webpack_require__("./src/styles/index.ts"),taggedTemplateLiteral=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js"),esm_extends=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/extends.js"),dist=__webpack_require__("./node_modules/@radix-ui/primitive/dist/index.mjs"),react_compose_refs_dist=__webpack_require__("./node_modules/@radix-ui/react-compose-refs/dist/index.mjs"),react_context_dist=__webpack_require__("./node_modules/@radix-ui/react-context/dist/index.mjs"),react_dismissable_layer_dist=__webpack_require__("./node_modules/@radix-ui/react-dismissable-layer/dist/index.mjs"),react_id_dist=__webpack_require__("./node_modules/@radix-ui/react-id/dist/index.mjs"),react_popper_dist=__webpack_require__("./node_modules/@radix-ui/react-popper/dist/index.mjs"),react_portal_dist=__webpack_require__("./node_modules/@radix-ui/react-portal/dist/index.mjs"),react_presence_dist=__webpack_require__("./node_modules/@radix-ui/react-presence/dist/index.mjs"),react_primitive_dist=__webpack_require__("./node_modules/@radix-ui/react-primitive/dist/index.mjs"),react_slot_dist=__webpack_require__("./node_modules/@radix-ui/react-slot/dist/index.mjs"),react_use_controllable_state_dist=__webpack_require__("./node_modules/@radix-ui/react-use-controllable-state/dist/index.mjs"),react_visually_hidden_dist=__webpack_require__("./node_modules/@radix-ui/react-visually-hidden/dist/index.mjs");const[$a093c7e1ec25a057$var$createTooltipContext,$a093c7e1ec25a057$export$1c540a2224f0d865]=(0,react_context_dist.A)("Tooltip",[react_popper_dist.Bk]),$a093c7e1ec25a057$var$usePopperScope=(0,react_popper_dist.Bk)(),$a093c7e1ec25a057$var$DEFAULT_DELAY_DURATION=700,[$a093c7e1ec25a057$var$TooltipProviderContextProvider,$a093c7e1ec25a057$var$useTooltipProviderContext]=$a093c7e1ec25a057$var$createTooltipContext("TooltipProvider"),$a093c7e1ec25a057$export$f78649fb9ca566b8=props=>{const{__scopeTooltip,delayDuration=$a093c7e1ec25a057$var$DEFAULT_DELAY_DURATION,skipDelayDuration=300,disableHoverableContent=!1,children}=props,[isOpenDelayed,setIsOpenDelayed]=(0,react.useState)(!0),isPointerInTransitRef=(0,react.useRef)(!1),skipDelayTimerRef=(0,react.useRef)(0);return(0,react.useEffect)((()=>{const skipDelayTimer=skipDelayTimerRef.current;return()=>window.clearTimeout(skipDelayTimer)}),[]),(0,react.createElement)($a093c7e1ec25a057$var$TooltipProviderContextProvider,{scope:__scopeTooltip,isOpenDelayed,delayDuration,onOpen:(0,react.useCallback)((()=>{window.clearTimeout(skipDelayTimerRef.current),setIsOpenDelayed(!1)}),[]),onClose:(0,react.useCallback)((()=>{window.clearTimeout(skipDelayTimerRef.current),skipDelayTimerRef.current=window.setTimeout((()=>setIsOpenDelayed(!0)),skipDelayDuration)}),[skipDelayDuration]),isPointerInTransitRef,onPointerInTransitChange:(0,react.useCallback)((inTransit=>{isPointerInTransitRef.current=inTransit}),[]),disableHoverableContent},children)},[$a093c7e1ec25a057$var$TooltipContextProvider,$a093c7e1ec25a057$var$useTooltipContext]=$a093c7e1ec25a057$var$createTooltipContext("Tooltip"),$a093c7e1ec25a057$export$28c660c63b792dea=props=>{const{__scopeTooltip,children,open:openProp,defaultOpen=!1,onOpenChange,disableHoverableContent:disableHoverableContentProp,delayDuration:delayDurationProp}=props,providerContext=$a093c7e1ec25a057$var$useTooltipProviderContext("Tooltip",props.__scopeTooltip),popperScope=$a093c7e1ec25a057$var$usePopperScope(__scopeTooltip),[trigger,setTrigger]=(0,react.useState)(null),contentId=(0,react_id_dist.B)(),openTimerRef=(0,react.useRef)(0),disableHoverableContent=null!=disableHoverableContentProp?disableHoverableContentProp:providerContext.disableHoverableContent,delayDuration=null!=delayDurationProp?delayDurationProp:providerContext.delayDuration,wasOpenDelayedRef=(0,react.useRef)(!1),[open1=!1,setOpen]=(0,react_use_controllable_state_dist.i)({prop:openProp,defaultProp:defaultOpen,onChange:open=>{open?(providerContext.onOpen(),document.dispatchEvent(new CustomEvent("tooltip.open"))):providerContext.onClose(),null==onOpenChange||onOpenChange(open)}}),stateAttribute=(0,react.useMemo)((()=>open1?wasOpenDelayedRef.current?"delayed-open":"instant-open":"closed"),[open1]),handleOpen=(0,react.useCallback)((()=>{window.clearTimeout(openTimerRef.current),wasOpenDelayedRef.current=!1,setOpen(!0)}),[setOpen]),handleClose=(0,react.useCallback)((()=>{window.clearTimeout(openTimerRef.current),setOpen(!1)}),[setOpen]),handleDelayedOpen=(0,react.useCallback)((()=>{window.clearTimeout(openTimerRef.current),openTimerRef.current=window.setTimeout((()=>{wasOpenDelayedRef.current=!0,setOpen(!0)}),delayDuration)}),[delayDuration,setOpen]);return(0,react.useEffect)((()=>()=>window.clearTimeout(openTimerRef.current)),[]),(0,react.createElement)(react_popper_dist.bL,popperScope,(0,react.createElement)($a093c7e1ec25a057$var$TooltipContextProvider,{scope:__scopeTooltip,contentId,open:open1,stateAttribute,trigger,onTriggerChange:setTrigger,onTriggerEnter:(0,react.useCallback)((()=>{providerContext.isOpenDelayed?handleDelayedOpen():handleOpen()}),[providerContext.isOpenDelayed,handleDelayedOpen,handleOpen]),onTriggerLeave:(0,react.useCallback)((()=>{disableHoverableContent?handleClose():window.clearTimeout(openTimerRef.current)}),[handleClose,disableHoverableContent]),onOpen:handleOpen,onClose:handleClose,disableHoverableContent},children))},$a093c7e1ec25a057$export$8c610744efcf8a1d=(0,react.forwardRef)(((props,forwardedRef)=>{const{__scopeTooltip,...triggerProps}=props,context=$a093c7e1ec25a057$var$useTooltipContext("TooltipTrigger",__scopeTooltip),providerContext=$a093c7e1ec25a057$var$useTooltipProviderContext("TooltipTrigger",__scopeTooltip),popperScope=$a093c7e1ec25a057$var$usePopperScope(__scopeTooltip),ref=(0,react.useRef)(null),composedRefs=(0,react_compose_refs_dist.s)(forwardedRef,ref,context.onTriggerChange),isPointerDownRef=(0,react.useRef)(!1),hasPointerMoveOpenedRef=(0,react.useRef)(!1),handlePointerUp=(0,react.useCallback)((()=>isPointerDownRef.current=!1),[]);return(0,react.useEffect)((()=>()=>document.removeEventListener("pointerup",handlePointerUp)),[handlePointerUp]),(0,react.createElement)(react_popper_dist.Mz,(0,esm_extends.A)({asChild:!0},popperScope),(0,react.createElement)(react_primitive_dist.sG.button,(0,esm_extends.A)({"aria-describedby":context.open?context.contentId:void 0,"data-state":context.stateAttribute},triggerProps,{ref:composedRefs,onPointerMove:(0,dist.m)(props.onPointerMove,(event=>{"touch"!==event.pointerType&&(hasPointerMoveOpenedRef.current||providerContext.isPointerInTransitRef.current||(context.onTriggerEnter(),hasPointerMoveOpenedRef.current=!0))})),onPointerLeave:(0,dist.m)(props.onPointerLeave,(()=>{context.onTriggerLeave(),hasPointerMoveOpenedRef.current=!1})),onPointerDown:(0,dist.m)(props.onPointerDown,(()=>{isPointerDownRef.current=!0,document.addEventListener("pointerup",handlePointerUp,{once:!0})})),onFocus:(0,dist.m)(props.onFocus,(()=>{isPointerDownRef.current||context.onOpen()})),onBlur:(0,dist.m)(props.onBlur,context.onClose),onClick:(0,dist.m)(props.onClick,context.onClose)})))})),[$a093c7e1ec25a057$var$PortalProvider,$a093c7e1ec25a057$var$usePortalContext]=$a093c7e1ec25a057$var$createTooltipContext("TooltipPortal",{forceMount:void 0}),$a093c7e1ec25a057$export$7b36b8f925ab7497=props=>{const{__scopeTooltip,forceMount,children,container}=props,context=$a093c7e1ec25a057$var$useTooltipContext("TooltipPortal",__scopeTooltip);return(0,react.createElement)($a093c7e1ec25a057$var$PortalProvider,{scope:__scopeTooltip,forceMount},(0,react.createElement)(react_presence_dist.C,{present:forceMount||context.open},(0,react.createElement)(react_portal_dist.Z,{asChild:!0,container},children)))},$a093c7e1ec25a057$export$e9003e2be37ec060=(0,react.forwardRef)(((props,forwardedRef)=>{const portalContext=$a093c7e1ec25a057$var$usePortalContext("TooltipContent",props.__scopeTooltip),{forceMount=portalContext.forceMount,side="top",...contentProps}=props,context=$a093c7e1ec25a057$var$useTooltipContext("TooltipContent",props.__scopeTooltip);return(0,react.createElement)(react_presence_dist.C,{present:forceMount||context.open},context.disableHoverableContent?(0,react.createElement)($a093c7e1ec25a057$var$TooltipContentImpl,(0,esm_extends.A)({side},contentProps,{ref:forwardedRef})):(0,react.createElement)($a093c7e1ec25a057$var$TooltipContentHoverable,(0,esm_extends.A)({side},contentProps,{ref:forwardedRef})))})),$a093c7e1ec25a057$var$TooltipContentHoverable=(0,react.forwardRef)(((props,forwardedRef)=>{const context=$a093c7e1ec25a057$var$useTooltipContext("TooltipContent",props.__scopeTooltip),providerContext=$a093c7e1ec25a057$var$useTooltipProviderContext("TooltipContent",props.__scopeTooltip),ref=(0,react.useRef)(null),composedRefs=(0,react_compose_refs_dist.s)(forwardedRef,ref),[pointerGraceArea,setPointerGraceArea]=(0,react.useState)(null),{trigger,onClose}=context,content=ref.current,{onPointerInTransitChange}=providerContext,handleRemoveGraceArea=(0,react.useCallback)((()=>{setPointerGraceArea(null),onPointerInTransitChange(!1)}),[onPointerInTransitChange]),handleCreateGraceArea=(0,react.useCallback)(((event,hoverTarget)=>{const currentTarget=event.currentTarget,exitPoint={x:event.clientX,y:event.clientY},paddedExitPoints=function $a093c7e1ec25a057$var$getPaddedExitPoints(exitPoint,exitSide,padding=5){const paddedExitPoints=[];switch(exitSide){case"top":paddedExitPoints.push({x:exitPoint.x-padding,y:exitPoint.y+padding},{x:exitPoint.x+padding,y:exitPoint.y+padding});break;case"bottom":paddedExitPoints.push({x:exitPoint.x-padding,y:exitPoint.y-padding},{x:exitPoint.x+padding,y:exitPoint.y-padding});break;case"left":paddedExitPoints.push({x:exitPoint.x+padding,y:exitPoint.y-padding},{x:exitPoint.x+padding,y:exitPoint.y+padding});break;case"right":paddedExitPoints.push({x:exitPoint.x-padding,y:exitPoint.y-padding},{x:exitPoint.x-padding,y:exitPoint.y+padding})}return paddedExitPoints}(exitPoint,function $a093c7e1ec25a057$var$getExitSideFromRect(point,rect){const top=Math.abs(rect.top-point.y),bottom=Math.abs(rect.bottom-point.y),right=Math.abs(rect.right-point.x),left=Math.abs(rect.left-point.x);switch(Math.min(top,bottom,right,left)){case left:return"left";case right:return"right";case top:return"top";case bottom:return"bottom";default:throw new Error("unreachable")}}(exitPoint,currentTarget.getBoundingClientRect())),graceArea=function $a093c7e1ec25a057$var$getHull(points){const newPoints=points.slice();return newPoints.sort(((a,b)=>a.x<b.x?-1:a.x>b.x?1:a.y<b.y?-1:a.y>b.y?1:0)),function $a093c7e1ec25a057$var$getHullPresorted(points){if(points.length<=1)return points.slice();const upperHull=[];for(let i=0;i<points.length;i++){const p=points[i];for(;upperHull.length>=2;){const q=upperHull[upperHull.length-1],r=upperHull[upperHull.length-2];if(!((q.x-r.x)*(p.y-r.y)>=(q.y-r.y)*(p.x-r.x)))break;upperHull.pop()}upperHull.push(p)}upperHull.pop();const lowerHull=[];for(let i1=points.length-1;i1>=0;i1--){const p=points[i1];for(;lowerHull.length>=2;){const q=lowerHull[lowerHull.length-1],r=lowerHull[lowerHull.length-2];if(!((q.x-r.x)*(p.y-r.y)>=(q.y-r.y)*(p.x-r.x)))break;lowerHull.pop()}lowerHull.push(p)}return lowerHull.pop(),1===upperHull.length&&1===lowerHull.length&&upperHull[0].x===lowerHull[0].x&&upperHull[0].y===lowerHull[0].y?upperHull:upperHull.concat(lowerHull)}(newPoints)}([...paddedExitPoints,...function $a093c7e1ec25a057$var$getPointsFromRect(rect){const{top,right,bottom,left}=rect;return[{x:left,y:top},{x:right,y:top},{x:right,y:bottom},{x:left,y:bottom}]}(hoverTarget.getBoundingClientRect())]);setPointerGraceArea(graceArea),onPointerInTransitChange(!0)}),[onPointerInTransitChange]);return(0,react.useEffect)((()=>()=>handleRemoveGraceArea()),[handleRemoveGraceArea]),(0,react.useEffect)((()=>{if(trigger&&content){const handleTriggerLeave=event=>handleCreateGraceArea(event,content),handleContentLeave=event=>handleCreateGraceArea(event,trigger);return trigger.addEventListener("pointerleave",handleTriggerLeave),content.addEventListener("pointerleave",handleContentLeave),()=>{trigger.removeEventListener("pointerleave",handleTriggerLeave),content.removeEventListener("pointerleave",handleContentLeave)}}}),[trigger,content,handleCreateGraceArea,handleRemoveGraceArea]),(0,react.useEffect)((()=>{if(pointerGraceArea){const handleTrackPointerGrace=event=>{const target=event.target,pointerPosition={x:event.clientX,y:event.clientY},hasEnteredTarget=(null==trigger?void 0:trigger.contains(target))||(null==content?void 0:content.contains(target)),isPointerOutsideGraceArea=!function $a093c7e1ec25a057$var$isPointInPolygon(point,polygon){const{x,y}=point;let inside=!1;for(let i=0,j=polygon.length-1;i<polygon.length;j=i++){const xi=polygon[i].x,yi=polygon[i].y,xj=polygon[j].x,yj=polygon[j].y;yi>y!=yj>y&&x<(xj-xi)*(y-yi)/(yj-yi)+xi&&(inside=!inside)}return inside}(pointerPosition,pointerGraceArea);hasEnteredTarget?handleRemoveGraceArea():isPointerOutsideGraceArea&&(handleRemoveGraceArea(),onClose())};return document.addEventListener("pointermove",handleTrackPointerGrace),()=>document.removeEventListener("pointermove",handleTrackPointerGrace)}}),[trigger,content,pointerGraceArea,onClose,handleRemoveGraceArea]),(0,react.createElement)($a093c7e1ec25a057$var$TooltipContentImpl,(0,esm_extends.A)({},props,{ref:composedRefs}))})),[$a093c7e1ec25a057$var$VisuallyHiddenContentContextProvider,$a093c7e1ec25a057$var$useVisuallyHiddenContentContext]=$a093c7e1ec25a057$var$createTooltipContext("Tooltip",{isInside:!1}),$a093c7e1ec25a057$var$TooltipContentImpl=(0,react.forwardRef)(((props,forwardedRef)=>{const{__scopeTooltip,children,"aria-label":ariaLabel,onEscapeKeyDown,onPointerDownOutside,...contentProps}=props,context=$a093c7e1ec25a057$var$useTooltipContext("TooltipContent",__scopeTooltip),popperScope=$a093c7e1ec25a057$var$usePopperScope(__scopeTooltip),{onClose}=context;return(0,react.useEffect)((()=>(document.addEventListener("tooltip.open",onClose),()=>document.removeEventListener("tooltip.open",onClose))),[onClose]),(0,react.useEffect)((()=>{if(context.trigger){const handleScroll=event=>{const target=event.target;null!=target&&target.contains(context.trigger)&&onClose()};return window.addEventListener("scroll",handleScroll,{capture:!0}),()=>window.removeEventListener("scroll",handleScroll,{capture:!0})}}),[context.trigger,onClose]),(0,react.createElement)(react_dismissable_layer_dist.qW,{asChild:!0,disableOutsidePointerEvents:!1,onEscapeKeyDown,onPointerDownOutside,onFocusOutside:event=>event.preventDefault(),onDismiss:onClose},(0,react.createElement)(react_popper_dist.UC,(0,esm_extends.A)({"data-state":context.stateAttribute},popperScope,contentProps,{ref:forwardedRef,style:{...contentProps.style,"--radix-tooltip-content-transform-origin":"var(--radix-popper-transform-origin)","--radix-tooltip-content-available-width":"var(--radix-popper-available-width)","--radix-tooltip-content-available-height":"var(--radix-popper-available-height)","--radix-tooltip-trigger-width":"var(--radix-popper-anchor-width)","--radix-tooltip-trigger-height":"var(--radix-popper-anchor-height)"}}),(0,react.createElement)(react_slot_dist.xV,null,children),(0,react.createElement)($a093c7e1ec25a057$var$VisuallyHiddenContentContextProvider,{scope:__scopeTooltip,isInside:!0},(0,react.createElement)(react_visually_hidden_dist.b,{id:context.contentId,role:"tooltip"},ariaLabel||children))))})),$a093c7e1ec25a057$export$c27ee0ad710f7559=(0,react.forwardRef)(((props,forwardedRef)=>{const{__scopeTooltip,...arrowProps}=props,popperScope=$a093c7e1ec25a057$var$usePopperScope(__scopeTooltip);return $a093c7e1ec25a057$var$useVisuallyHiddenContentContext("TooltipArrow",__scopeTooltip).isInside?null:(0,react.createElement)(react_popper_dist.i3,(0,esm_extends.A)({},popperScope,arrowProps,{ref:forwardedRef}))}));const $a093c7e1ec25a057$export$2881499e37b75b9a=$a093c7e1ec25a057$export$f78649fb9ca566b8,$a093c7e1ec25a057$export$be92b6f5f03c0fe9=$a093c7e1ec25a057$export$28c660c63b792dea,$a093c7e1ec25a057$export$41fb9f06171c75f4=$a093c7e1ec25a057$export$8c610744efcf8a1d,$a093c7e1ec25a057$export$602eac185826482c=$a093c7e1ec25a057$export$7b36b8f925ab7497,$a093c7e1ec25a057$export$7c6e2c02157bb7d2=$a093c7e1ec25a057$export$e9003e2be37ec060,$a093c7e1ec25a057$export$21b07c8f274aebd5=$a093c7e1ec25a057$export$c27ee0ad710f7559;var _templateObject,_templateObject2,_templateObject3,_templateObject4,_templateObject5,_templateObject6,styled_components_browser_esm=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),keyframes=__webpack_require__("./src/styles/keyframes.ts");const TooltipArrow=(0,styled_components_browser_esm.Ay)($a093c7e1ec25a057$export$21b07c8f274aebd5)(_templateObject||(_templateObject=(0,taggedTemplateLiteral.A)(["\n  fill: ",";\n"])),(_ref=>{let{theme}=_ref;return theme.colors.fill.inverse})),TooltipContent=(0,styled_components_browser_esm.Ay)($a093c7e1ec25a057$export$7c6e2c02157bb7d2)(_templateObject2||(_templateObject2=(0,taggedTemplateLiteral.A)(["\n  font-family: ",";\n  font-size: ",";\n  font-weight: ",";\n  line-height: ",";\n  color: ",";\n  background-color: ",";\n  border-radius: 4px;\n  padding: 2px 8px;\n  user-select: none;\n  animation-duration: ",";\n  animation-timing-function: ",";\n  will-change: transform, opacity;\n  &[data-state='instant-open'][data-side='top'],\n  &[data-state='delayed-open'][data-side='top'] {\n    animation-name: ",";\n  }\n  &[data-state='instant-open'][data-side='right'],\n  &[data-state='delayed-open'][data-side='right'] {\n    animation-name: ",";\n  }\n  &[data-state='instant-open'][data-side='bottom'],\n  &[data-state='delayed-open'][data-side='bottom'] {\n    animation-name: ",";\n  }\n  &[data-state='instant-open'][data-side='left'],\n  &[data-state='delayed-open'][data-side='left'] {\n    animation-name: ",";\n  }\n  &[data-state='closed'] {\n    animation-name: ",";\n  }\n"])),(_ref2=>{let{theme}=_ref2;return theme.typography.fontFamily}),(_ref3=>{let{theme}=_ref3;return theme.typography.secondary.fontSize}),(_ref4=>{let{theme}=_ref4;return theme.typography.fontWeight["semi-bold"]}),(_ref5=>{let{theme}=_ref5;return theme.typography.secondary.lineHeight}),(_ref6=>{let{theme}=_ref6;return theme.colors.text.inverse}),(_ref7=>{let{theme}=_ref7;return theme.colors.fill.inverse}),(_ref8=>{let{theme}=_ref8;return theme.transitions.duration.standard}),(_ref9=>{let{theme}=_ref9;return theme.transitions.easing.easeIn}),keyframes.zl,keyframes.wy,keyframes.cc,keyframes.hF,keyframes.Xn),TooltipProvider=(0,styled_components_browser_esm.Ay)($a093c7e1ec25a057$export$2881499e37b75b9a)(_templateObject3||(_templateObject3=(0,taggedTemplateLiteral.A)([""]))),TooltipRoot=(0,styled_components_browser_esm.Ay)($a093c7e1ec25a057$export$be92b6f5f03c0fe9)(_templateObject4||(_templateObject4=(0,taggedTemplateLiteral.A)([""]))),TooltipTrigger=(0,styled_components_browser_esm.Ay)($a093c7e1ec25a057$export$41fb9f06171c75f4)(_templateObject5||(_templateObject5=(0,taggedTemplateLiteral.A)(["\n  color: inherit;\n"]))),TooltipPortal=(0,styled_components_browser_esm.Ay)($a093c7e1ec25a057$export$602eac185826482c)(_templateObject6||(_templateObject6=(0,taggedTemplateLiteral.A)([""])));var jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const Tooltip=_ref=>{let{position="bottom",label,html,style={},children,className="",disabled=!1,delay=300,arrow=!0,providerProps,rootProps}=_ref;const theme=(0,styled_components_browser_esm.DP)(),[side="bottom",align="center"]=position.split("-");return(0,jsx_runtime.jsx)(TooltipProvider,{delayDuration:delay,...providerProps,children:(0,jsx_runtime.jsxs)(TooltipRoot,{...rootProps,open:!disabled&&void 0,children:[(0,jsx_runtime.jsx)(TooltipTrigger,{className:"TooltipTrigger",asChild:!0,"aria-label":"string"==typeof children?children:"TooltipTrigger",type:"button",children:(0,jsx_runtime.jsx)(styles.Yk,{className,type:"button",children})}),(0,jsx_runtime.jsx)(TooltipPortal,{children:(0,jsx_runtime.jsxs)(TooltipContent,{forceMount:!0,"data-tooltip-content":!0,className:"TooltipContent",style,sideOffset:5,"aria-disabled":disabled,"aria-live":"polite",side,align,dir:theme.direction,children:[label?(0,jsx_runtime.jsx)(jsx_runtime.Fragment,{children:label}):(0,jsx_runtime.jsx)(jsx_runtime.Fragment,{children:html}),arrow&&(0,jsx_runtime.jsx)(TooltipArrow,{})]})})]})})},Tooltip_Tooltip=Tooltip;try{Tooltip.displayName="Tooltip",Tooltip.__docgenInfo={description:"Tooltip component is used to show a tooltip to the user.\nIt is used to show additional information or actions.\nIt can be used to show a hint, a warning, or any other content.",displayName:"Tooltip",props:{html:{defaultValue:null,description:"HTML to be rendered in the tooltip",name:"html",required:!1,type:{name:"ReactElement<any, string | JSXElementConstructor<any>>"}},label:{defaultValue:null,description:"String to be rendered in the tooltip",name:"label",required:!1,type:{name:"string"}},position:{defaultValue:{value:"bottom"},description:"The position of the tooltip",name:"position",required:!1,type:{name:"enum",value:[{value:'"top"'},{value:'"top-start"'},{value:'"top-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"bottom-end"'},{value:'"left"'},{value:'"left-start"'},{value:'"left-end"'},{value:'"right"'},{value:'"right-start"'},{value:'"right-end"'}]}},delay:{defaultValue:{value:"300"},description:"",name:"delay",required:!1,type:{name:"number"}},arrow:{defaultValue:{value:"true"},description:"Whether to show the arrow,",name:"arrow",required:!1,type:{name:"boolean"}},disabled:{defaultValue:{value:"false"},description:"Whether disabled select",name:"disabled",required:!1,type:{name:"boolean"}},className:{defaultValue:{value:""},description:"Class name of tooltip",name:"className",required:!1,type:{name:"string"}},style:{defaultValue:{value:"{}"},description:"",name:"style",required:!1,type:{name:"CSSProperties"}},replaceChild:{defaultValue:null,description:"The children or label",name:"replaceChild",required:!1,type:{name:"boolean"}},tabIndex:{defaultValue:null,description:"",name:"tabIndex",required:!1,type:{name:"number"}},providerProps:{defaultValue:null,description:"",name:"providerProps",required:!1,type:{name:"TooltipProviderProps"}},rootProps:{defaultValue:null,description:"",name:"rootProps",required:!1,type:{name:"TooltipProps"}},arrowProps:{defaultValue:null,description:"",name:"arrowProps",required:!1,type:{name:"TooltipArrowProps"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Tooltip/Tooltip.tsx#Tooltip"]={docgenInfo:Tooltip.__docgenInfo,name:"Tooltip",path:"src/components/Tooltip/Tooltip.tsx#Tooltip"})}catch(__react_docgen_typescript_loader_error){}var globalStyles=__webpack_require__("./src/styles/globalStyles.ts");const Tooltip_stories={title:"Components/Tooltip",component:Tooltip_Tooltip,parameters:{layout:"centered"},tags:["autodocs"],argTypes:{disabled:{control:"boolean"}}},Bottom={render:props=>(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(Tooltip_Tooltip,{...props,children:"Hover"}),(0,jsx_runtime.jsx)(globalStyles.A,{})]}),args:{position:"bottom",label:"This is a small tooltip"}},__namedExportsOrder=["Bottom"];Bottom.parameters={...Bottom.parameters,docs:{...Bottom.parameters?.docs,source:{originalSource:"{\n  render: props => <>\n      <Tooltip {...props}>Hover</Tooltip>\n      <FreemiumUIGlobalStyles />\n    </>,\n  args: {\n    position: 'bottom',\n    label: 'This is a small tooltip'\n  }\n}",...Bottom.parameters?.docs?.source}}}},"./src/styles/globalStyles.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var _templateObject,_Users_basembulingam_Files_Code_Repo_freemium_ui_node_modules_babel_runtime_helpers_esm_taggedTemplateLiteral_js__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js"),styled_components__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js"),_themes__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/themes/index.ts");const __WEBPACK_DEFAULT_EXPORT__=(0,styled_components__WEBPACK_IMPORTED_MODULE_1__.DU)(_templateObject||(_templateObject=(0,_Users_basembulingam_Files_Code_Repo_freemium_ui_node_modules_babel_runtime_helpers_esm_taggedTemplateLiteral_js__WEBPACK_IMPORTED_MODULE_2__.A)(["\n\ndiv:has( > div[data-tooltip-content]){\n    z-index: "," !important;\n}\n\ndiv:has( > div[data-popover-content]){\n    z-index: "," !important;\n}\n\n    "])),(_ref=>{let{theme}=_ref;return theme.zIndex.tooltip||_themes__WEBPACK_IMPORTED_MODULE_0__.Mu.tooltip}),(_ref2=>{let{theme}=_ref2;return theme.zIndex.popover||_themes__WEBPACK_IMPORTED_MODULE_0__.Mu.popover}))}}]);

package/storybook-static/stories-Typography-mdx.bb2eab85.iframe.bundle.js

@@ -0,0 +1 @@
+(self.webpackChunkfreemium_ui=self.webpackChunkfreemium_ui||[]).push([[72602],{"./node_modules/@mdx-js/react/lib/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.d(__webpack_exports__,{R:()=>useMDXComponents,x:()=>MDXProvider});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/react/index.js");const emptyComponents={},MDXContext=react__WEBPACK_IMPORTED_MODULE_0__.createContext(emptyComponents);function useMDXComponents(components){const contextComponents=react__WEBPACK_IMPORTED_MODULE_0__.useContext(MDXContext);return react__WEBPACK_IMPORTED_MODULE_0__.useMemo((function(){return"function"==typeof components?components(contextComponents):{...contextComponents,...components}}),[contextComponents,components])}function MDXProvider(properties){let allComponents;return allComponents=properties.disableParentContext?"function"==typeof properties.components?properties.components(emptyComponents):properties.components||emptyComponents:useMDXComponents(properties.components),react__WEBPACK_IMPORTED_MODULE_0__.createElement(MDXContext.Provider,{value:allComponents},properties.children)}},"./src/stories/Typography.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{SampleText:()=>SampleText,default:()=>MDXContent,typography:()=>typography});__webpack_require__("./node_modules/react/index.js");var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/react/jsx-runtime.js"),_Users_basembulingam_Files_Code_Repo_freemium_ui_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim_mjs__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@mdx-js/react/lib/index.js"),_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@storybook/blocks/dist/index.mjs");const typography={type:{primary:"-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol'"},weight:{regular:"400",bold:"700",extrabold:"800",black:"900"},size:{s1:12,s2:14,s3:16,m1:20,m2:24,m3:28,l1:32,l2:40,l3:48}},SampleText="Lorem ipsum dolor sit amet, consectetur adipiscing elit.";function _createMdxContent(props){const _components={h1:"h1",p:"p",strong:"strong",...(0,_Users_basembulingam_Files_Code_Repo_freemium_ui_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim_mjs__WEBPACK_IMPORTED_MODULE_2__.R)(),...props.components};return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.W8,{title:"Typography"}),"\n","\n","\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h1,{id:"typography",children:"Typography"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.p,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.strong,{children:"Font:"})," SF Pro"]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.p,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.strong,{children:"Weights:"})," 400(regular), 700(bold), 800(extrabold), 900(black)"]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.F7,{fontSizes:[Number(typography.size.s1),Number(typography.size.s2),Number(typography.size.s3),Number(typography.size.m1),Number(typography.size.m2),Number(typography.size.m3),Number(typography.size.l1),Number(typography.size.l2),Number(typography.size.l3)],fontWeight:typography.weight.black,sampleText:SampleText,fontFamily:typography.type.primary})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={...(0,_Users_basembulingam_Files_Code_Repo_freemium_ui_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim_mjs__WEBPACK_IMPORTED_MODULE_2__.R)(),...props.components};return MDXLayout?(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(MDXLayout,{...props,children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_createMdxContent,{...props})}):_createMdxContent(props)}},"./node_modules/@storybook/core/dist/components sync recursive":module=>{function webpackEmptyContext(req){var e=new Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}webpackEmptyContext.keys=()=>[],webpackEmptyContext.resolve=webpackEmptyContext,webpackEmptyContext.id="./node_modules/@storybook/core/dist/components sync recursive",module.exports=webpackEmptyContext},"./node_modules/@storybook/core/dist/theming sync recursive":module=>{function webpackEmptyContext(req){var e=new Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}webpackEmptyContext.keys=()=>[],webpackEmptyContext.resolve=webpackEmptyContext,webpackEmptyContext.id="./node_modules/@storybook/core/dist/theming sync recursive",module.exports=webpackEmptyContext},"./node_modules/memoizerific sync recursive":module=>{function webpackEmptyContext(req){var e=new Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}webpackEmptyContext.keys=()=>[],webpackEmptyContext.resolve=webpackEmptyContext,webpackEmptyContext.id="./node_modules/memoizerific sync recursive",module.exports=webpackEmptyContext}}]);

package/storybook-static/stories-Typography-stories.e336a0f7.iframe.bundle.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkfreemium_ui=self.webpackChunkfreemium_ui||[]).push([[85244],{"./src/stories/Typography.stories.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Caption:()=>Caption,Heading:()=>Heading,Heading1:()=>Heading1,Heading2:()=>Heading2,Heading3:()=>Heading3,Heading4:()=>Heading4,Primary:()=>Primary,Secondary:()=>Secondary,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});const __WEBPACK_DEFAULT_EXPORT__={title:"Components/Typography",component:__webpack_require__("./src/components/Typography/index.ts").o,parameters:{layout:"centered"},tags:["autodocs"],argTypes:{}},Primary={args:{children:"Primary text",variant:"primary",weight:"regular"}},Secondary={args:{children:"Secondary text",variant:"secondary",weight:"regular"}},Heading={args:{children:"Heading text",variant:"heading",weight:"regular"}},Heading4={args:{children:"Heading text",variant:"heading4",weight:"regular"}},Heading3={args:{children:"Heading text",variant:"heading3",weight:"regular"}},Heading2={args:{children:"Heading text",variant:"heading2",weight:"regular"}},Heading1={args:{children:"Heading text",variant:"heading1",weight:"regular"}},Caption={args:{children:"Caption text",variant:"caption",weight:"regular"}},__namedExportsOrder=["Primary","Secondary","Heading","Heading4","Heading3","Heading2","Heading1","Caption"];Primary.parameters={...Primary.parameters,docs:{...Primary.parameters?.docs,source:{originalSource:"{\n  args: {\n    children: 'Primary text',\n    variant: 'primary',\n    weight: 'regular'\n  }\n}",...Primary.parameters?.docs?.source}}},Secondary.parameters={...Secondary.parameters,docs:{...Secondary.parameters?.docs,source:{originalSource:"{\n  args: {\n    children: 'Secondary text',\n    variant: 'secondary',\n    weight: 'regular'\n  }\n}",...Secondary.parameters?.docs?.source}}},Heading.parameters={...Heading.parameters,docs:{...Heading.parameters?.docs,source:{originalSource:"{\n  args: {\n    children: 'Heading text',\n    variant: 'heading',\n    weight: 'regular'\n  }\n}",...Heading.parameters?.docs?.source}}},Heading4.parameters={...Heading4.parameters,docs:{...Heading4.parameters?.docs,source:{originalSource:"{\n  args: {\n    children: 'Heading text',\n    variant: 'heading4',\n    weight: 'regular'\n  }\n}",...Heading4.parameters?.docs?.source}}},Heading3.parameters={...Heading3.parameters,docs:{...Heading3.parameters?.docs,source:{originalSource:"{\n  args: {\n    children: 'Heading text',\n    variant: 'heading3',\n    weight: 'regular'\n  }\n}",...Heading3.parameters?.docs?.source}}},Heading2.parameters={...Heading2.parameters,docs:{...Heading2.parameters?.docs,source:{originalSource:"{\n  args: {\n    children: 'Heading text',\n    variant: 'heading2',\n    weight: 'regular'\n  }\n}",...Heading2.parameters?.docs?.source}}},Heading1.parameters={...Heading1.parameters,docs:{...Heading1.parameters?.docs,source:{originalSource:"{\n  args: {\n    children: 'Heading text',\n    variant: 'heading1',\n    weight: 'regular'\n  }\n}",...Heading1.parameters?.docs?.source}}},Caption.parameters={...Caption.parameters,docs:{...Caption.parameters?.docs,source:{originalSource:"{\n  args: {\n    children: 'Caption text',\n    variant: 'caption',\n    weight: 'regular'\n  }\n}",...Caption.parameters?.docs?.source}}}},"./src/components/Typography/index.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{o:()=>Typography_Typography});var _templateObject,react=__webpack_require__("./node_modules/react/index.js"),taggedTemplateLiteral=__webpack_require__("./node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteral.js");const StyledTypography=__webpack_require__("./node_modules/styled-components/dist/styled-components.browser.esm.js").Ay.span(_templateObject||(_templateObject=(0,taggedTemplateLiteral.A)(["\n  direction: ",";\n  color: ",";\n  font-family: ",";\n  font-weight: ",";\n  font-size: ",";\n  line-height: ",";\n  text-transform: ",";\n  -webkit-font-smoothing: antialiased;\n"])),(_ref=>{let{theme}=_ref;return theme.direction}),(_ref2=>{let{theme}=_ref2;return theme.colors.text.primary}),(_ref3=>{let{theme}=_ref3;return theme.typography.fontFamily}),(_ref4=>{let{theme,weight}=_ref4;return theme.typography.fontWeight[weight]}),(_ref5=>{let{theme,variant}=_ref5;return theme.typography[variant].fontSize}),(_ref6=>{let{theme,variant}=_ref6;return theme.typography[variant].lineHeight}),(_ref7=>{let{variant}=_ref7;return"caption"===variant?"uppercase":"none"}));var jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");const Typography=react.forwardRef(((_ref,forwardedRef)=>{let{children,variant="primary",weight="regular",...rest}=_ref;return(0,jsx_runtime.jsx)(StyledTypography,{variant,weight,ref:forwardedRef,...rest,children})})),Typography_Typography=Typography;try{Typography.displayName="Typography",Typography.__docgenInfo={description:"Typography component is used to show text to the user. It can be used to show a heading, a paragraph, or any other text.",displayName:"Typography",props:{children:{defaultValue:null,description:"The children or label",name:"children",required:!1,type:{name:"ReactNode"}},variant:{defaultValue:{value:"primary"},description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"primary"'},{value:'"secondary"'},{value:'"heading"'},{value:'"heading1"'},{value:'"heading2"'},{value:'"heading3"'},{value:'"heading4"'},{value:'"caption"'}]}},weight:{defaultValue:{value:"regular"},description:"",name:"weight",required:!1,type:{name:"enum",value:[{value:'"regular"'},{value:'"bold"'},{value:'"semi-bold"'}]}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Typography/Typography.tsx#Typography"]={docgenInfo:Typography.__docgenInfo,name:"Typography",path:"src/components/Typography/Typography.tsx#Typography"})}catch(__react_docgen_typescript_loader_error){}}}]);

package/dist/README.md

@@ -1,86 +0,0 @@
-<h1 align="center">Freemium Ui</h1>
-
-## [DEMO](https://freemium-ui.netlify.app)
-
-[React](https://reactjs.org/) based light weight ui components based on [Styled Components](https://styled-components.com/)
-
-## Installation
-
-Peer Dependencies to be installed
-
-```
-npm install styled-components
-```
-
-Install the package
-
-```
-npm install freemium-ui
-```
-
-Please note that `@next` will only point to pre-releases; to get the latest stable release use `@latest` instead.
-
-## Usage
-
-Here is a quick example to get you started, **it's all you need**:
-
-```jsx
-import React from 'react';
-import ReactDOM from 'react-dom';
-import { Button } from 'freemium-ui';
-// import { Button } from 'freemium-ui/Button';
-
-function App() {
-  return <Button>Freemium Button</Button>;
-}
-
-ReactDOM.render(<App />, document.querySelector('#app'));
-```
-
-## Contribution
-
-Install Dependencies
-
-```
-npm install
-```
-
-Start the app using storybook
-
-```
-npm run storybook
-```
-
-Build Freemium Ui Core Components
-
-```
-npm run build
-```
-
-JavaScript heap out of memory could lead to build failure. Check the [official docs](https://rollupjs.org/troubleshooting/#error-javascript-heap-out-of-memory). Or execute any of the required below config
-
-```
-export NODE_OPTIONS="--max-old-space-size=8192"
-export NODE_OPTIONS="--max-old-space-size=12288"
-export NODE_OPTIONS="--max-old-space-size=16384"
-```
-
-To check the heap size in MB
-
-```
-node -e 'console.log(v8.getHeapStatistics().heap_size_limit/(1024*1024))'
-```
-
-Generate a PAT with `admin:org`, `write:packages`, `read:packages`, `delete:packages`
-
-Authenticate to npm github package
-
-```
-npm login --registry=https://registry.npmjs.org/
-```
-
-Publish the package to npm
-
-```
-npm publish
-```