npm - @hhgtech/hhg-components - Versions diffs - 1.18.47 → 1.18.48 - Mend

@hhgtech/hhg-components 1.18.47 → 1.18.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2623) hide show

package/build/components/molecules/dropdown/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/tslib/tslib.es6.js"),t=require("react"),a=require("./index.styled.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=l(t);exports.Dropdown=function(t){var l=t.className,d=t.value,o=t.options,i=t.onChange,u=void 0===i?function(){}:i,r=t.id,c=t.placeholderIcon,s=t.placeholder,v=t.style,f=t.size,p=void 0===f?"lg":f,b=t.groupedWithLabel,m=t.disabled,y=t.dropdownLabelTrackingAttributes,w=void 0===y?{}:y,E=t.isNativeSelect,g=void 0!==E&&E,S=n.default.useState(!1),h=S[0],D=S[1],k=function(){return!m&&D(!h)};return g?n.default.createElement(a.StyledDropdown,{as:"select","data-is-native":"true",value:(null==d?void 0:d.value)\|\|void 0,disabled:m,onChange:function(e){if("string"==typeof e.target.value){var t=o.find((function(t){return t.value===e.target.value}));t&&u(t)}}},s&&n.default.createElement("option",{value:s,disabled:!0,selected:!0},s),o.map((function(e){return n.default.createElement("option",{key:"".concat(r,"-").concat(e.value),value:e.value,disabled:!!e.disabled&&e.disabled},e.label)}))):n.default.createElement(a.StyledDropdown,{className:l,"data-dropdown-open":h\|\|void 0,"data-size":p,id:r,"data-has-icons":!!c,style:v,onBlur:function(){return D(!1)},tabIndex:0,"data-disabled":m},!!b&&n.default.createElement(a.StyledDropdownLabel,null,b),n.default.createElement(a.StyledDropdownName,e.__assign({onClick:k,className:b&&"with-label"},w),c," ",n.default.createElement("span",null,d&&d.value?d.label:s)),h&&n.default.createElement(a.StyledDropdownList,{onClick:k,"data-has-icons":!!c},o.map((function(e){return n.default.createElement(a.StyledDropdownOption,{key:"".concat(r,"-").concat(e.value),"data-selected":d&&d.value===e.value\|\|void 0,onClick:function(){return!e.disabled&&!m&&(null==u?void 0:u(e))},"data-disabled":!!e.disabled&&e.disabled},e.icon&&n.default.createElement(a.StyledIcon,null,e.icon),e.label)}))))};
2	+ //# sourceMappingURL=index.js.map

package/build/components/molecules/dropdown/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/dropdown/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport { CSSProperties } from 'styled-components'\n\nimport {\n StyledDropdown,\n StyledDropdownName,\n StyledDropdownList,\n StyledDropdownOption,\n StyledIcon,\n StyledDropdownLabel,\n} from './index.styled'\n\nexport type Option = {\n label: string | JSX.Element\n value: string | Date | number\n icon?: JSX.Element\n disabled?: boolean\n}\n\nexport type Props = {\n options: Array<Option>\n placeholder: string\n disabled?: boolean\n id: string\n size?: 'sm' | 'md' | 'lg'\n placeholderIcon?: JSX.Element\n onChange?: (o: Option) => void\n value?: Option\n className?: string\n style?: CSSProperties\n groupedWithLabel?: string | JSX.Element\n dropdownLabelTrackingAttributes?: {\n [key: string]: string\n }\n isNativeSelect?: boolean\n}\n\nconst Dropdown = ({\n className,\n value,\n options,\n onChange = () => undefined,\n id,\n placeholderIcon,\n placeholder,\n style,\n size = 'lg',\n groupedWithLabel,\n disabled,\n dropdownLabelTrackingAttributes = {},\n isNativeSelect = false,\n}: Props) => {\n const [isDropdownOpen, setIsDropdownOpen] = React.useState(false)\n const showDropdown = () => !disabled && setIsDropdownOpen(!isDropdownOpen)\n\n if (isNativeSelect) {\n return (\n // @ts-ignore\n <StyledDropdown\n as=\"select\"\n data-is-native=\"true\"\n value={value?.value || undefined}\n disabled={disabled}\n onChange={(e: any) => {\n if (typeof e.target.value === 'string') {\n const option = options.find((o) => o.value === e.target.value)\n if (option) {\n onChange(option)\n }\n }\n }}\n >\n {placeholder && (\n <option value={placeholder} disabled selected>\n {placeholder}\n </option>\n )}\n {options.map((option) => (\n <option\n key={`${id}-${option.value}`}\n value={option.value as string}\n disabled={option.disabled ? option.disabled : false}\n >\n {option.label}\n </option>\n ))}\n </StyledDropdown>\n )\n }\n\n return (\n <StyledDropdown\n className={className}\n data-dropdown-open={isDropdownOpen || undefined}\n data-size={size}\n id={id}\n data-has-icons={!!placeholderIcon}\n style={style}\n onBlur={() => setIsDropdownOpen(false)}\n tabIndex={0}\n data-disabled={disabled}\n >\n {!!groupedWithLabel && (\n <StyledDropdownLabel>{groupedWithLabel}</StyledDropdownLabel>\n )}\n\n <StyledDropdownName\n onClick={showDropdown}\n className={groupedWithLabel && 'with-label'}\n {...dropdownLabelTrackingAttributes}\n >\n {placeholderIcon}{' '}\n <span>{value && value.value ? value.label : placeholder}</span>\n </StyledDropdownName>\n\n {isDropdownOpen && (\n <StyledDropdownList\n onClick={showDropdown}\n data-has-icons={!!placeholderIcon}\n >\n {options.map((option) => (\n <StyledDropdownOption\n key={`${id}-${option.value}`}\n data-selected={\n (value && value.value === option.value) || undefined\n }\n onClick={() =>\n !option.disabled && !disabled && onChange?.(option)\n }\n data-disabled={option.disabled ? option.disabled : false}\n >\n {option.icon && <StyledIcon>{option.icon}</StyledIcon>}\n {option.label}\n </StyledDropdownOption>\n ))}\n </StyledDropdownList>\n )}\n </StyledDropdown>\n )\n}\n\nexport { Dropdown }\n"],"names":["_a","className","value","options","_b","onChange","id","placeholderIcon","placeholder","style","_c","size","groupedWithLabel","disabled","_d","dropdownLabelTrackingAttributes","_e","isNativeSelect","_f","React","useState","isDropdownOpen","setIsDropdownOpen","showDropdown","createElement","StyledDropdown","as","undefined","e","target","option","find","o","selected","map","key","concat","label","onBlur","tabIndex","StyledDropdownLabel","StyledDropdownName","__assign","onClick","StyledDropdownList","StyledDropdownOption","icon","StyledIcon"],"mappings":"oRAsCiB,SAACA,OAChBC,EAASD,EAAAC,UACTC,EAAKF,EAAAE,MACLC,EAAOH,EAAAG,QACPC,EAAAJ,EAAAK,SAAAA,OAAW,IAAAD,EAAA,aAAeA,EAC1BE,EAAEN,EAAAM,GACFC,EAAeP,EAAAO,gBACfC,EAAWR,EAAAQ,YACXC,EAAKT,EAAAS,MACLC,EAAWV,EAAAW,KAAXA,OAAI,IAAAD,EAAG,KAAIA,EACXE,EAAgBZ,EAAAY,iBAChBC,EAAQb,EAAAa,SACRC,EAAoCd,EAAAe,gCAApCA,OAA+B,IAAAD,EAAG,GAAEA,EACpCE,EAAAhB,EAAAiB,eAAAA,OAAiB,IAAAD,GAAKA,EAEhBE,EAAsCC,EAAAA,QAAMC,UAAS,GAApDC,EAAcH,EAAA,GAAEI,OACjBC,EAAe,WAAM,OAACV,GAAYS,GAAmBD,IAE3D,OAAIJ,EAGAE,EAAAA,QAAAK,cAACC,iBAAc,CACbC,GAAG,SAAQ,iBACI,OACfxB,OAAOA,aAAA,EAAAA,EAAOA,aAASyB,EACvBd,SAAUA,EACVR,SAAU,SAACuB,GACT,GAA8B,iBAAnBA,EAAEC,OAAO3B,MAAoB,CACtC,IAAM4B,EAAS3B,EAAQ4B,MAAK,SAACC,GAAM,OAAAA,EAAE9B,QAAU0B,EAAEC,OAAO3B,SACpD4B,GACFzB,EAASyB,MAKdtB,GACCW,EAAAA,QAAQK,cAAA,SAAA,CAAAtB,MAAOM,EAAaK,UAAS,EAAAoB,UAClC,GAAAzB,GAGJL,EAAQ+B,KAAI,SAACJ,GAAW,OACvBX,EAAAA,QAAAK,cAAA,SAAA,CACEW,IAAK,UAAG7B,EAAE,KAAA8B,OAAIN,EAAO5B,OACrBA,MAAO4B,EAAO5B,MACdW,WAAUiB,EAAOjB,UAAWiB,EAAOjB,UAElCiB,EAAOO,WAQhBlB,EAAC,QAAAK,cAAAC,kBACCxB,UAAWA,EACS,qBAAAoB,QAAkBM,cAC3BhB,EACXL,GAAIA,qBACcC,EAClBE,MAAOA,EACP6B,OAAQ,WAAM,OAAAhB,GAAkB,IAChCiB,SAAU,kBACK1B,KAEZD,GACDO,wBAACqB,EAAAA,oBAAmB,KAAE5B,GAGxBO,EAAAA,QAAAK,cAACiB,qBAAkBC,EAAAA,SAAA,CACjBC,QAASpB,EACTtB,UAAWW,GAAoB,cAC3BG,GAEHR,EAAiB,IAClBY,EAAAA,QAAAK,cAAA,OAAA,KAAOtB,GAASA,EAAMA,MAAQA,EAAMmC,MAAQ7B,IAG7Ca,GACCF,EAAC,QAAAK,cAAAoB,EAAAA,oBACCD,QAASpB,EAAY,mBACHhB,GAEjBJ,EAAQ+B,KAAI,SAACJ,GAAW,OACvBX,EAAAA,QAAAK,cAACqB,EAAoBA,qBAAA,CACnBV,IAAK,GAAAC,OAAG9B,EAAM,KAAA8B,OAAAN,EAAO5B,OAEnB,gBAACA,GAASA,EAAMA,QAAU4B,EAAO5B,YAAUyB,EAE7CgB,QAAS,WACP,OAACb,EAAOjB,WAAaA,IAAYR,aAAA,EAAAA,EAAWyB,KAE/B,kBAAAA,EAAOjB,UAAWiB,EAAOjB,UAEvCiB,EAAOgB,MAAQ3B,UAAAK,cAACuB,EAAAA,WAAY,KAAAjB,EAAOgB,MACnChB,EAAOO"}

package/build/components/molecules/dropdown/index.styled.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js");function e(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var o,t,r,i,d,a,p=e(require("styled-components")),s=p.default.div(o\|\|(o=n.__makeTemplateObject(["\n --dropdown-padding: 12px 18px 12px 16px;\n position: relative;\n box-sizing: border-box;\n border: 1px solid ",";\n background: url(\"data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23595959' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\")\n no-repeat;\n background-position: right 16px center;\n border-radius: 6px;\n\n &[data-disabled='true'],\n :disabled {\n background-color: #f2f2f2;\n cursor: not-allowed;\n }\n\n &[data-size='sm'] {\n font-size: 13px;\n line-height: 20px;\n }\n &[data-size='md'] {\n font-size: 14px;\n line-height: 21px;\n }\n &[data-size='lg'] {\n font-size: 16px;\n line-height: 24px;\n }\n\n &[data-has-icons='true'] {\n border: none;\n background: ",";\n\n img,\n svg {\n display: inline-block;\n max-width: 16px;\n margin-right: 6px;\n }\n\n span {\n display: inline-block;\n vertical-align: middle;\n }\n\n &:hover {\n box-shadow: none;\n }\n > div {\n position: relative;\n display: flex;\n width: 100%;\n box-sizing: border-box;\n align-items: center;\n }\n > div::after {\n position: absolute;\n top: 50%;\n right: 12px;\n width: 10px;\n height: 8px;\n background-image: url(\"data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23595959' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\");\n background-repeat: no-repeat;\n content: '';\n transform: translateY(-50%);\n }\n }\n\n &:hover {\n box-shadow: 0 0 2px 2px ",";\n }\n\n &[data-is-native='true'] {\n padding: var(--dropdown-padding);\n line-height: 24px;\n\n &:focus {\n box-shadow: 0px 0px 2px 2px\n ",";\n }\n }\n"],["\n --dropdown-padding: 12px 18px 12px 16px;\n position: relative;\n box-sizing: border-box;\n border: 1px solid ",";\n background: url(\"data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23595959' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\")\n no-repeat;\n background-position: right 16px center;\n border-radius: 6px;\n\n &[data-disabled='true'],\n :disabled {\n background-color: #f2f2f2;\n cursor: not-allowed;\n }\n\n &[data-size='sm'] {\n font-size: 13px;\n line-height: 20px;\n }\n &[data-size='md'] {\n font-size: 14px;\n line-height: 21px;\n }\n &[data-size='lg'] {\n font-size: 16px;\n line-height: 24px;\n }\n\n &[data-has-icons='true'] {\n border: none;\n background: ",";\n\n img,\n svg {\n display: inline-block;\n max-width: 16px;\n margin-right: 6px;\n }\n\n span {\n display: inline-block;\n vertical-align: middle;\n }\n\n &:hover {\n box-shadow: none;\n }\n > div {\n position: relative;\n display: flex;\n width: 100%;\n box-sizing: border-box;\n align-items: center;\n }\n > div::after {\n position: absolute;\n top: 50%;\n right: 12px;\n width: 10px;\n height: 8px;\n background-image: url(\"data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23595959' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\");\n background-repeat: no-repeat;\n content: '';\n transform: translateY(-50%);\n }\n }\n\n &:hover {\n box-shadow: 0 0 2px 2px ",";\n }\n\n &[data-is-native='true'] {\n padding: var(--dropdown-padding);\n line-height: 24px;\n\n &:focus {\n box-shadow: 0px 0px 2px 2px\n ",";\n }\n }\n"])),(function(n){return n.theme.colors.gray200}),(function(n){return n.theme.colors.gray100}),(function(n){return n.theme.colors.blue200}),(function(n){return n.theme.colors.blue200})),l=p.default.div(t\|\|(t=n.__makeTemplateObject(["\n padding: var(--dropdown-padding);\n cursor: pointer;\n\n &.with-label {\n padding-top: 34px;\n padding-bottom: 12px;\n }\n &[data-dropdown-open] {\n padding: 11px 15px 11px 15px;\n border: 1px solid ",";\n border-radius: 6px;\n box-shadow: 0 0 2px 2px ",";\n }\n"],["\n padding: var(--dropdown-padding);\n cursor: pointer;\n\n &.with-label {\n padding-top: 34px;\n padding-bottom: 12px;\n }\n &[data-dropdown-open] {\n padding: 11px 15px 11px 15px;\n border: 1px solid ",";\n border-radius: 6px;\n box-shadow: 0 0 2px 2px ",";\n }\n"])),(function(n){return n.theme.colors.primaryBase}),(function(n){return n.theme.colors.blue200})),x=p.default.ul(r\|\|(r=n.__makeTemplateObject(["\n position: absolute;\n top: 100%;\n right: 0;\n left: 0;\n display: block;\n margin-top: 4px;\n background: ",";\n border-radius: 6px;\n box-shadow: -1px 1px 2px rgba(67, 70, 74, 0.0001),\n -2px 2px 5px rgba(67, 86, 100, 0.123689);\n cursor: pointer;\n\n &[data-has-icons='true'] {\n border: 1px solid ",";\n background: white;\n box-shadow: none;\n filter: drop-shadow(0px 10px 16px rgba(0, 0, 0, 0.04));\n }\n"],["\n position: absolute;\n top: 100%;\n right: 0;\n left: 0;\n display: block;\n margin-top: 4px;\n background: ",";\n border-radius: 6px;\n box-shadow: -1px 1px 2px rgba(67, 70, 74, 0.0001),\n -2px 2px 5px rgba(67, 86, 100, 0.123689);\n cursor: pointer;\n\n &[data-has-icons='true'] {\n border: 1px solid ",";\n background: white;\n box-shadow: none;\n filter: drop-shadow(0px 10px 16px rgba(0, 0, 0, 0.04));\n }\n"])),(function(n){return n.theme.colors.white}),(function(n){return n.theme.colors.gray200})),g=p.default.li(i\|\|(i=n.__makeTemplateObject(["\n display: flex;\n padding: 12px 18px 12px 16px;\n &[data-disabled='true'] {\n cursor: not-allowed;\n color: #bfbfbf;\n & > * {\n pointer-events: none;\n }\n }\n &:hover,\n :active {\n background: ",";\n }\n"],["\n display: flex;\n padding: 12px 18px 12px 16px;\n &[data-disabled='true'] {\n cursor: not-allowed;\n color: #bfbfbf;\n & > * {\n pointer-events: none;\n }\n }\n &:hover,\n :active {\n background: ",";\n }\n"])),(function(n){return n.theme.colors.gray100})),b=p.default.div(d\|\|(d=n.__makeTemplateObject(["\n max-width: 16px;\n margin-right: 8px;\n"],["\n max-width: 16px;\n margin-right: 8px;\n"]))),h=p.default.div(a\|\|(a=n.__makeTemplateObject(["\n position: absolute;\n top: 12px;\n left: 16px;\n pointer-events: none;\n"],["\n position: absolute;\n top: 12px;\n left: 16px;\n pointer-events: none;\n"])));exports.StyledDropdown=s,exports.StyledDropdownLabel=h,exports.StyledDropdownList=x,exports.StyledDropdownName=l,exports.StyledDropdownOption=g,exports.StyledIcon=b;
2	+ //# sourceMappingURL=index.styled.js.map

package/build/components/molecules/dropdown/index.styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.styled.js","sources":["../../../../src/components/molecules/dropdown/index.styled.tsx"],"sourcesContent":["import { ThemeProps } from 'misc/theme'\nimport styled from 'styled-components'\n\nexport const StyledDropdown = styled.div`\n --dropdown-padding: 12px 18px 12px 16px;\n position: relative;\n box-sizing: border-box;\n border: 1px solid ${(props: ThemeProps) => props.theme.colors.gray200};\n background: url(\"data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23595959' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\")\n no-repeat;\n background-position: right 16px center;\n border-radius: 6px;\n\n &[data-disabled='true'],\n :disabled {\n background-color: #f2f2f2;\n cursor: not-allowed;\n }\n\n &[data-size='sm'] {\n font-size: 13px;\n line-height: 20px;\n }\n &[data-size='md'] {\n font-size: 14px;\n line-height: 21px;\n }\n &[data-size='lg'] {\n font-size: 16px;\n line-height: 24px;\n }\n\n &[data-has-icons='true'] {\n border: none;\n background: ${(props: ThemeProps) => props.theme.colors.gray100};\n\n img,\n svg {\n display: inline-block;\n max-width: 16px;\n margin-right: 6px;\n }\n\n span {\n display: inline-block;\n vertical-align: middle;\n }\n\n &:hover {\n box-shadow: none;\n }\n > div {\n position: relative;\n display: flex;\n width: 100%;\n box-sizing: border-box;\n align-items: center;\n }\n > div::after {\n position: absolute;\n top: 50%;\n right: 12px;\n width: 10px;\n height: 8px;\n background-image: url(\"data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23595959' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\");\n background-repeat: no-repeat;\n content: '';\n transform: translateY(-50%);\n }\n }\n\n &:hover {\n box-shadow: 0 0 2px 2px ${(props: ThemeProps) => props.theme.colors.blue200};\n }\n\n &[data-is-native='true'] {\n padding: var(--dropdown-padding);\n line-height: 24px;\n\n &:focus {\n box-shadow: 0px 0px 2px 2px\n ${(props: ThemeProps) => props.theme.colors.blue200};\n }\n }\n`\n\nexport const StyledDropdownName = styled.div`\n padding: var(--dropdown-padding);\n cursor: pointer;\n\n &.with-label {\n padding-top: 34px;\n padding-bottom: 12px;\n }\n &[data-dropdown-open] {\n padding: 11px 15px 11px 15px;\n border: 1px solid ${(props: ThemeProps) => props.theme.colors.primaryBase};\n border-radius: 6px;\n box-shadow: 0 0 2px 2px ${(props: ThemeProps) => props.theme.colors.blue200};\n }\n`\n\nexport const StyledDropdownList = styled.ul`\n position: absolute;\n top: 100%;\n right: 0;\n left: 0;\n display: block;\n margin-top: 4px;\n background: ${(props: ThemeProps) => props.theme.colors.white};\n border-radius: 6px;\n box-shadow: -1px 1px 2px rgba(67, 70, 74, 0.0001),\n -2px 2px 5px rgba(67, 86, 100, 0.123689);\n cursor: pointer;\n\n &[data-has-icons='true'] {\n border: 1px solid ${(props: ThemeProps) => props.theme.colors.gray200};\n background: white;\n box-shadow: none;\n filter: drop-shadow(0px 10px 16px rgba(0, 0, 0, 0.04));\n }\n`\n\nexport const StyledDropdownOption = styled.li`\n display: flex;\n padding: 12px 18px 12px 16px;\n &[data-disabled='true'] {\n cursor: not-allowed;\n color: #bfbfbf;\n & > * {\n pointer-events: none;\n }\n }\n &:hover,\n :active {\n background: ${(props: ThemeProps) => props.theme.colors.gray100};\n }\n`\nexport const StyledIcon = styled.div`\n max-width: 16px;\n margin-right: 8px;\n`\n\nexport const StyledDropdownLabel = styled.div`\n position: absolute;\n top: 12px;\n left: 16px;\n pointer-events: none;\n`\n"],"names":["StyledDropdown","styled","div","templateObject_1","__makeTemplateObject","props","theme","colors","gray200","gray100","blue200","StyledDropdownName","templateObject_2","primaryBase","StyledDropdownList","ul","templateObject_3","white","StyledDropdownOption","li","templateObject_4","StyledIcon","templateObject_5","StyledDropdownLabel","templateObject_6"],"mappings":"wPAGaA,EAAiBC,EAAM,QAACC,IAAGC,IAAAA,EAAAC,uBAAA,CAAA,uHAAA,kvBAAA,i7BAAA,sKAAA,mBAAA,CAAA,uHAI+B,kvBA2BJ,i7BAsCY,sKASpB,sBA1ErC,SAACC,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,WA2B9C,SAACH,GAAsB,OAAAA,EAAMC,MAAMC,OAAOE,WAsC9B,SAACJ,GAAsB,OAAAA,EAAMC,MAAMC,OAAOG,WAS9D,SAACL,GAAsB,OAAAA,EAAMC,MAAMC,OAAOG,WAKvCC,EAAqBV,EAAAA,QAAOC,IAAGU,IAAAA,EAAAR,EAAAA,qBAAA,CAAA,8NAAA,2DAAA,YAAA,CAAA,8NAUiC,2DAEE,eAFvD,SAACC,GAAsB,OAAAA,EAAMC,MAAMC,OAAOM,eAEpC,SAACR,GAAsB,OAAAA,EAAMC,MAAMC,OAAOG,WAI3DI,EAAqBb,EAAAA,QAAOc,GAAEC,IAAAA,EAAAZ,EAAAA,qBAAA,CAAA,wHAAA,4MAAA,wHAAA,CAAA,wHAOoB,4MAOU,2HAPzD,SAACC,GAAsB,OAAAA,EAAMC,MAAMC,OAAOU,SAOlC,SAACZ,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,WAOrDU,EAAuBjB,EAAAA,QAAOkB,GAAEC,IAAAA,EAAAhB,EAAAA,qBAAA,CAAA,mOAAA,YAAA,CAAA,mOAYsB,eAAjD,SAACC,GAAsB,OAAAA,EAAMC,MAAMC,OAAOE,WAG/CY,EAAapB,EAAM,QAACC,IAAGoB,IAAAA,EAAAlB,uBAAA,CAAA,gDAAA,CAAA,mDAKvBmB,EAAsBtB,EAAM,QAACC,IAAGsB,IAAAA,EAAApB,uBAAA,CAAA,mFAAA,CAAA"}

package/build/components/molecules/floatButtonGroup/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../../node_modules/tslib/tslib.es6.js"),e=require("react"),n=require("./index.styled.js");function o(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var l=o(e);exports.FloatButtonGroup=function(o){var a=o.items,u=o.className,s=o.style,i=o.backgroundPanelStyle,r=o.isOpen,c=o.onOpen,d=o.onClose,m=o.disableBackdropClick,p=o.siteType,y=void 0===p?"hb":p,f=o.animationType,_=void 0===f?"zoom":f,I=o.zIndex,g=void 0===I?300:I,N=e.useState(!!r),b=N[0],T=N[1];e.useEffect((function(){T(!!r)}),[r]);var B=function(){T(!1),d&&d()};return l.default.createElement(n.StyledFloatButtonGroup,{style:s,className:u,"data-floatmenu-open":b,"data-site-type":y,"data-animation-type":_},l.default.createElement(n.StyledFloatButtonGroupBackgroundPanel,{className:"float-button-group__panel",style:t.__assign({zIndex:g},i),onClick:m?void 0:B}),l.default.createElement(n.StyledFloatButtonGroupContent,{className:"float-button-group___content",style:{zIndex:g}},l.default.createElement(n.StyledFloatButtonGroupItemsWrapper,null,a.map((function(e,o){return l.default.createElement(n.StyledFloatButtonGroupButton,{className:"float-item-button-".concat(o),style:t.__assign(t.__assign({},"zoom"===_&&{bottom:64(a.length-1-o),transitionDelay:"".concat(n.TRANSITION_TIMING/a.length(b?a.length-1-o:o),"ms")}),"slide"===_&&{bottom:64(a.length-1-o),transitionDelay:"".concat(n.TRANSITION_TIMING/a.length(b?o:a.length-1-o),"ms")}),key:o,onClick:function(){e.onClick(),e.keepMenuOnClick\|\|T(!1)}},l.default.createElement(n.StyledFloatButtonGroupButtonLabel,{style:t.__assign({},"zoom"===_&&{transitionDelay:"".concat(n.TRANSITION_TIMING/a.length(b?a.length-1-o:o),"ms")})},e.label),l.default.createElement(n.StyledFloatButtonGroupButtonIcon,{className:"float-item-button__icon-wrapper",style:t.__assign({},("zoom"===_\|\|"slide"===_)&&{transitionDelay:"".concat(n.TRANSITION_TIMING/a.length(b?a.length-1-o:o),"ms")})},e.icon))}))),l.default.createElement(n.StyledFloatButtonGroupToggleIcon,{onClick:b?B:function(){T(!0),c&&c()}})))};
2	+ //# sourceMappingURL=index.js.map

package/build/components/molecules/floatButtonGroup/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/floatButtonGroup/index.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\n\nimport { CSSProperties } from 'styled-components'\n\nimport {\n StyledFloatButtonGroup,\n StyledFloatButtonGroupBackgroundPanel,\n StyledFloatButtonGroupButton,\n StyledFloatButtonGroupButtonIcon,\n StyledFloatButtonGroupButtonLabel,\n StyledFloatButtonGroupContent,\n StyledFloatButtonGroupItemsWrapper,\n StyledFloatButtonGroupToggleIcon,\n TRANSITION_TIMING,\n} from './index.styled'\n\ntype Item = {\n value?: string | number\n label: string\n icon: JSX.Element\n onClick: () => void\n keepMenuOnClick?: boolean\n}\n\nexport type FloatButtonGroupType = {\n items: Item[]\n className?: string\n style?: CSSProperties\n backgroundPanelStyle?: CSSProperties\n isOpen?: boolean\n onOpen?: () => void\n onClose?: () => void\n disableBackdropClick?: boolean\n siteType?: 'hb' | 'mb'\n animationType?: 'zoom' | 'slide' | 'scale'\n zIndex?: number\n}\n\nexport const FloatButtonGroup = ({\n items,\n className,\n style,\n backgroundPanelStyle,\n isOpen: isOpenProp,\n onOpen,\n onClose,\n disableBackdropClick,\n siteType = 'hb',\n animationType = 'zoom',\n zIndex = 300,\n}: FloatButtonGroupType) => {\n const [isOpen, setIsOpen] = useState<boolean>(!!isOpenProp)\n\n useEffect(() => {\n setIsOpen(!!isOpenProp)\n }, [isOpenProp])\n\n const handleOpen = () => {\n setIsOpen(true)\n if (onOpen) {\n onOpen()\n }\n }\n\n const handleClose = () => {\n setIsOpen(false)\n if (onClose) {\n onClose()\n }\n }\n\n return (\n <StyledFloatButtonGroup\n style={style}\n className={className}\n data-floatmenu-open={isOpen}\n data-site-type={siteType}\n data-animation-type={animationType}\n >\n <StyledFloatButtonGroupBackgroundPanel\n className=\"float-button-group__panel\"\n style={{ zIndex, ...backgroundPanelStyle }}\n onClick={!disableBackdropClick ? handleClose : undefined}\n />\n <StyledFloatButtonGroupContent\n className=\"float-button-group___content\"\n style={{ zIndex }}\n >\n <StyledFloatButtonGroupItemsWrapper>\n {items.map((item, index) => {\n return (\n <StyledFloatButtonGroupButton\n className={`float-item-button-${index}`}\n style={{\n ...(animationType === 'zoom' && {\n bottom: (items.length - 1 - index) * (48 + 16),\n transitionDelay: `${\n (TRANSITION_TIMING / items.length) *\n (isOpen ? items.length - 1 - index : index)\n }ms`,\n }),\n ...(animationType === 'slide' && {\n bottom: (items.length - 1 - index) * (48 + 16),\n transitionDelay: `${\n (TRANSITION_TIMING / items.length) *\n (!isOpen ? items.length - 1 - index : index)\n }ms`,\n }),\n }}\n key={index}\n onClick={() => {\n item.onClick()\n if (!item.keepMenuOnClick) {\n setIsOpen(false)\n }\n }}\n >\n <StyledFloatButtonGroupButtonLabel\n style={{\n ...(animationType === 'zoom' && {\n transitionDelay: `${\n (TRANSITION_TIMING / items.length) *\n (isOpen ? items.length - 1 - index : index)\n }ms`,\n }),\n }}\n >\n {item.label}\n </StyledFloatButtonGroupButtonLabel>\n <StyledFloatButtonGroupButtonIcon\n className=\"float-item-button__icon-wrapper\"\n style={{\n ...((animationType === 'zoom' ||\n animationType === 'slide') && {\n transitionDelay: `${\n (TRANSITION_TIMING / items.length) *\n (isOpen ? items.length - 1 - index : index)\n }ms`,\n }),\n }}\n >\n {item.icon}\n </StyledFloatButtonGroupButtonIcon>\n </StyledFloatButtonGroupButton>\n )\n })}\n </StyledFloatButtonGroupItemsWrapper>\n\n <StyledFloatButtonGroupToggleIcon\n onClick={isOpen ? handleClose : handleOpen}\n />\n </StyledFloatButtonGroupContent>\n </StyledFloatButtonGroup>\n )\n}\n"],"names":["_a","items","className","style","backgroundPanelStyle","isOpenProp","onOpen","onClose","disableBackdropClick","_b","siteType","_c","animationType","_d","zIndex","_e","useState","isOpen","setIsOpen","useEffect","handleClose","React","createElement","StyledFloatButtonGroup","StyledFloatButtonGroupBackgroundPanel","__assign","onClick","undefined","StyledFloatButtonGroupContent","StyledFloatButtonGroupItemsWrapper","map","item","index","StyledFloatButtonGroupButton","concat","bottom","length","transitionDelay","TRANSITION_TIMING","key","keepMenuOnClick","StyledFloatButtonGroupButtonLabel","label","StyledFloatButtonGroupButtonIcon","icon","StyledFloatButtonGroupToggleIcon"],"mappings":"4RAsCgC,SAACA,GAC/B,IAAAC,UACAC,cACAC,UACAC,yBACQC,WACRC,WACAC,YACAC,EAAoBR,EAAAQ,qBACpBC,aAAAC,aAAW,KAAID,EACfE,EAAsBX,EAAAY,cAAtBA,OAAgB,IAAAD,EAAA,SAChBE,EAAAb,EAAAc,OAAAA,OAAM,IAAAD,EAAG,IAAGA,EAENE,EAAsBC,EAAAA,WAAoBX,GAAzCY,EAAMF,EAAA,GAAEG,OAEfC,EAAAA,WAAU,WACRD,IAAYb,KACX,CAACA,IAEJ,IAOMe,EAAc,WAClBF,GAAU,GACNX,GACFA,KAIJ,OACEc,EAAC,QAAAC,cAAAC,EAAsBA,uBACrB,CAAApB,MAAOA,EACPD,UAAWA,EACU,sBAAAe,EACL,iBAAAP,wBACKE,GAErBS,EAAC,QAAAC,cAAAE,wCACC,CAAAtB,UAAU,4BACVC,MAAKsB,WAAA,CAAIX,OAAMA,GAAKV,GACpBsB,QAAUlB,OAAqCmB,EAAdP,IAEnCC,UAACC,cAAAM,EAA6BA,8BAC5B,CAAA1B,UAAU,+BACVC,MAAO,CAAEW,OAAMA,IAEfO,UAACC,cAAAO,EAAAA,wCACE5B,EAAM6B,KAAI,SAACC,EAAMC,GAChB,OACEX,EAAAA,QAACC,cAAAW,EAAAA,6BACC,CAAA/B,UAAW,qBAAqBgC,OAAAF,GAChC7B,MACKsB,EAAAA,SAAAA,EAAAA,SAAA,GAAmB,SAAlBb,GAA4B,CAC9BuB,OAAiC,IAAxBlC,EAAMmC,OAAS,EAAIJ,GAC5BK,gBAAiB,UACdC,EAAiBA,kBAAGrC,EAAMmC,QAC1BnB,EAAShB,EAAMmC,OAAS,EAAIJ,EAAQA,GACnC,QAEgB,UAAlBpB,GAA6B,CAC/BuB,OAAiC,IAAxBlC,EAAMmC,OAAS,EAAIJ,GAC5BK,gBAAiB,UACdC,EAAiBA,kBAAGrC,EAAMmC,QACzBnB,EAAoCe,EAA3B/B,EAAMmC,OAAS,EAAIJ,GAC5B,QAGRO,IAAKP,EACLN,QAAS,WACPK,EAAKL,UACAK,EAAKS,iBACRtB,GAAU,KAIdG,UAACC,cAAAmB,EAAAA,mCACCtC,MAAKsB,EAAAA,SAAA,GACmB,SAAlBb,GAA4B,CAC9ByB,gBAAiB,UACdC,EAAiBA,kBAAGrC,EAAMmC,QAC1BnB,EAAShB,EAAMmC,OAAS,EAAIJ,EAAQA,GACnC,SAIPD,EAAKW,OAERrB,EAAAA,QAAAC,cAACqB,mCAAgC,CAC/BzC,UAAU,kCACVC,MAAKsB,WAAA,IACoB,SAAlBb,GACe,UAAlBA,IAA8B,CAC9ByB,gBAAiB,UACdC,EAAiBA,kBAAGrC,EAAMmC,QAC1BnB,EAAShB,EAAMmC,OAAS,EAAIJ,EAAQA,GACnC,SAIPD,EAAKa,WAOhBvB,UAAAC,cAACuB,EAAgCA,iCAC/B,CAAAnB,QAAST,EAASG,EA5FP,WACjBF,GAAU,GACNZ,GACFA"}

package/build/components/molecules/floatButtonGroup/index.styled.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js");function t(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var a,o,e,r,i,s,l,m,d=t(require("styled-components")),p=d.default.div(a\|\|(a=n.__makeTemplateObject([""],[""]))),f=d.default.div(o\|\|(o=n.__makeTemplateObject(["\n width: 100vw;\n height: 100vh;\n position: fixed;\n bottom: 0;\n right: 0;\n background-color: ",";\n opacity: 0.83;\n transition: display ","ms linear;\n\n [data-floatmenu-open='true'] & {\n animation: showBackgroundPanel ","ms linear 0s normal\n forwards;\n }\n\n [data-floatmenu-open='false'] & {\n animation: hideBackgroundPanel ","ms linear 0s normal\n forwards;\n }\n\n @keyframes showBackgroundPanel {\n 0% {\n opacity: 0;\n width: 100vw;\n height: 100vh;\n }\n 100% {\n opacity: 0.83;\n }\n }\n\n @keyframes hideBackgroundPanel {\n 0% {\n width: 100vw;\n height: 100vh;\n }\n 99% {\n width: 100vw;\n height: 100vh;\n }\n 100% {\n opacity: 0;\n width: 0;\n height: 0;\n }\n }\n"],["\n width: 100vw;\n height: 100vh;\n position: fixed;\n bottom: 0;\n right: 0;\n background-color: ",";\n opacity: 0.83;\n transition: display ","ms linear;\n\n [data-floatmenu-open='true'] & {\n animation: showBackgroundPanel ","ms linear 0s normal\n forwards;\n }\n\n [data-floatmenu-open='false'] & {\n animation: hideBackgroundPanel ","ms linear 0s normal\n forwards;\n }\n\n @keyframes showBackgroundPanel {\n 0% {\n opacity: 0;\n width: 100vw;\n height: 100vh;\n }\n 100% {\n opacity: 0.83;\n }\n }\n\n @keyframes hideBackgroundPanel {\n 0% {\n width: 100vw;\n height: 100vh;\n }\n 99% {\n width: 100vw;\n height: 100vh;\n }\n 100% {\n opacity: 0;\n width: 0;\n height: 0;\n }\n }\n"])),(function(n){var t,a;return n.theme.colors.white\|\|(null===(a=null===(t=n.theme.colors)\|\|void 0===t?void 0:t.palette)\|\|void 0===a?void 0:a.white)}),200,200,200),u=d.default.div(e\|\|(e=n.__makeTemplateObject(["\n position: fixed;\n right: 16px;\n bottom: 40px;\n"],["\n position: fixed;\n right: 16px;\n bottom: 40px;\n"]))),c=d.default.div(r\|\|(r=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n transition: all ","ms ease-in-out;\n position: fixed;\n bottom: 112px;\n right: 16px;\n\n // scale\n [data-animation-type='scale'] & {\n transform-origin: 100% 100%;\n }\n\n [data-animation-type='scale'][data-floatmenu-open='true'] & {\n transform: scale(1);\n }\n\n [data-animation-type='scale'][data-floatmenu-open='false'] & {\n transform: scale(0);\n bottom: 46px;\n right: 36px;\n }\n"],["\n display: flex;\n flex-direction: column;\n gap: 16px;\n transition: all ","ms ease-in-out;\n position: fixed;\n bottom: 112px;\n right: 16px;\n\n // scale\n [data-animation-type='scale'] & {\n transform-origin: 100% 100%;\n }\n\n [data-animation-type='scale'][data-floatmenu-open='true'] & {\n transform: scale(1);\n }\n\n [data-animation-type='scale'][data-floatmenu-open='false'] & {\n transform: scale(0);\n bottom: 46px;\n right: 36px;\n }\n"])),200),h=d.default.div(i\|\|(i=n.__makeTemplateObject(["\n border-radius: 50%;\n width: 56px;\n height: 56px;\n position: relative;\n cursor: pointer;\n margin-left: auto;\n transition: all 0.1s linear;\n -webkit-tap-highlight-color: transparent;\n [data-site-type='hb'] & {\n background-color: ",";\n &:hover {\n background-color: ",";\n }\n }\n [data-site-type='mb'] & {\n background-color: #2d87f3;\n &:hover {\n background-color: #2c74df;\n }\n }\n\n &:before {\n content: '';\n width: 2px;\n height: 20px;\n background-color: ",";\n border-radius: 2px;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n &:after {\n content: '';\n width: 20px;\n height: 2px;\n background-color: ",";\n border-radius: 2px;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n [data-floatmenu-open='true'] &:before,\n [data-floatmenu-open='true'] &:after {\n animation: toX ","ms linear 0s normal forwards;\n }\n\n [data-floatmenu-open='false'] &:before,\n [data-floatmenu-open='false'] &:after {\n animation: toPlus ","ms linear 0s normal forwards;\n }\n\n @keyframes toX {\n 0% {\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n 49% {\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n 50% {\n width: 2px;\n height: 2px;\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n 100% {\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n }\n\n @keyframes toPlus {\n 0% {\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n 49% {\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n 50% {\n width: 2px;\n height: 2px;\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n 100% {\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n }\n"],["\n border-radius: 50%;\n width: 56px;\n height: 56px;\n position: relative;\n cursor: pointer;\n margin-left: auto;\n transition: all 0.1s linear;\n -webkit-tap-highlight-color: transparent;\n [data-site-type='hb'] & {\n background-color: ",";\n &:hover {\n background-color: ",";\n }\n }\n [data-site-type='mb'] & {\n background-color: #2d87f3;\n &:hover {\n background-color: #2c74df;\n }\n }\n\n &:before {\n content: '';\n width: 2px;\n height: 20px;\n background-color: ",";\n border-radius: 2px;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n &:after {\n content: '';\n width: 20px;\n height: 2px;\n background-color: ",";\n border-radius: 2px;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n [data-floatmenu-open='true'] &:before,\n [data-floatmenu-open='true'] &:after {\n animation: toX ","ms linear 0s normal forwards;\n }\n\n [data-floatmenu-open='false'] &:before,\n [data-floatmenu-open='false'] &:after {\n animation: toPlus ","ms linear 0s normal forwards;\n }\n\n @keyframes toX {\n 0% {\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n 49% {\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n 50% {\n width: 2px;\n height: 2px;\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n 100% {\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n }\n\n @keyframes toPlus {\n 0% {\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n 49% {\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n 50% {\n width: 2px;\n height: 2px;\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n 100% {\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n }\n"])),(function(n){return n.theme.colors.primaryBase\|\|n.theme.colors.primary}),(function(n){var t,a;return n.theme.colors.primaryHover\|\|(null===(a=null===(t=n.theme.colors)\|\|void 0===t?void 0:t.palette)\|\|void 0===a?void 0:a.blue_700)}),(function(n){var t,a;return n.theme.colors.white\|\|(null===(a=null===(t=n.theme.colors)\|\|void 0===t?void 0:t.palette)\|\|void 0===a?void 0:a.white)}),(function(n){var t,a;return n.theme.colors.white\|\|(null===(a=null===(t=n.theme.colors)\|\|void 0===t?void 0:t.palette)\|\|void 0===a?void 0:a.white)}),200,200),g=d.default.div(s\|\|(s=n.__makeTemplateObject(["\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: flex-end;\n\n width: fit-content;\n margin-left: auto;\n\n [data-floatmenu-open='true'] {\n cursor: pointer;\n }\n [data-floatmenu-open='false'] {\n pointer-events: none;\n }\n\n [data-animation-type='zoom'] &,\n [data-animation-type='slide'] & {\n position: absolute;\n right: 0;\n width: max-content;\n }\n // slide\n [data-animation-type='slide'] & {\n transition: all ","ms ease-in;\n }\n\n [data-animation-type='slide'][data-floatmenu-open='true'] & {\n animation: showItem ","ms;\n }\n [data-animation-type='slide'][data-floatmenu-open='false'] & {\n bottom: -64px !important;\n animation: hideItemOnZoom ","ms normal forwards;\n }\n\n // zoom\n [data-animation-type='zoom'][data-floatmenu-open='false'] & {\n animation: hideItemOnZoom ","ms normal forwards;\n }\n\n @keyframes showItem {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n }\n\n @keyframes hideItemOnZoom {\n 0% {\n transform: translateX(0);\n opacity: 1;\n }\n\n 99% {\n transform: translateX(0);\n opacity: 0.5;\n }\n\n 100% {\n transform: translateX(calc(100% + 16px));\n opacity: 0;\n }\n }\n"],["\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: flex-end;\n\n width: fit-content;\n margin-left: auto;\n\n [data-floatmenu-open='true'] {\n cursor: pointer;\n }\n [data-floatmenu-open='false'] {\n pointer-events: none;\n }\n\n [data-animation-type='zoom'] &,\n [data-animation-type='slide'] & {\n position: absolute;\n right: 0;\n width: max-content;\n }\n // slide\n [data-animation-type='slide'] & {\n transition: all ","ms ease-in;\n }\n\n [data-animation-type='slide'][data-floatmenu-open='true'] & {\n animation: showItem ","ms;\n }\n [data-animation-type='slide'][data-floatmenu-open='false'] & {\n bottom: -64px !important;\n animation: hideItemOnZoom ","ms normal forwards;\n }\n\n // zoom\n [data-animation-type='zoom'][data-floatmenu-open='false'] & {\n animation: hideItemOnZoom ","ms normal forwards;\n }\n\n @keyframes showItem {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n }\n\n @keyframes hideItemOnZoom {\n 0% {\n transform: translateX(0);\n opacity: 1;\n }\n\n 99% {\n transform: translateX(0);\n opacity: 0.5;\n }\n\n 100% {\n transform: translateX(calc(100% + 16px));\n opacity: 0;\n }\n }\n"])),200,200,250,250),x=d.default.div(l\|\|(l=n.__makeTemplateObject(["\n font-size: 14px;\n\n // zoom\n [data-animation-type='zoom'] & {\n transition: transform ","ms ease-in-out;\n transform-origin: 100% 0;\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='true'] & {\n transform: scale(1);\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='false'] & {\n transform: scale(0);\n }\n\n // slide\n [data-animation-type='slide'] & {\n transition: opacity ","ms;\n }\n [data-animation-type='slide'][data-floatmenu-open='true'] & {\n opacity: 1;\n }\n [data-animation-type='slide'][data-floatmenu-open='false'] & {\n opacity: 0;\n }\n"],["\n font-size: 14px;\n\n // zoom\n [data-animation-type='zoom'] & {\n transition: transform ","ms ease-in-out;\n transform-origin: 100% 0;\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='true'] & {\n transform: scale(1);\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='false'] & {\n transform: scale(0);\n }\n\n // slide\n [data-animation-type='slide'] & {\n transition: opacity ","ms;\n }\n [data-animation-type='slide'][data-floatmenu-open='true'] & {\n opacity: 1;\n }\n [data-animation-type='slide'][data-floatmenu-open='false'] & {\n opacity: 0;\n }\n"])),200,200),y=d.default.div(m\|\|(m=n.__makeTemplateObject(["\n border-radius: 50%;\n box-shadow: 0px 16px 24px rgba(0, 0, 0, 0.06), 0px 2px 8px rgba(0, 0, 0, 0.04),\n 0px 0px 1px rgba(0, 0, 0, 0.04);\n width: 48px;\n height: 48px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ",";\n\n // zoom\n [data-animation-type='zoom'] & {\n transition: transform ","ms ease-in-out;\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='true'] & {\n transform: scale(1);\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='false'] & {\n transform: scale(0);\n }\n\n > img {\n width: 24px;\n height: 24px;\n object-fit: contain;\n }\n"],["\n border-radius: 50%;\n box-shadow: 0px 16px 24px rgba(0, 0, 0, 0.06), 0px 2px 8px rgba(0, 0, 0, 0.04),\n 0px 0px 1px rgba(0, 0, 0, 0.04);\n width: 48px;\n height: 48px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ",";\n\n // zoom\n [data-animation-type='zoom'] & {\n transition: transform ","ms ease-in-out;\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='true'] & {\n transform: scale(1);\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='false'] & {\n transform: scale(0);\n }\n\n > img {\n width: 24px;\n height: 24px;\n object-fit: contain;\n }\n"])),(function(n){var t,a;return n.theme.colors.white\|\|(null===(a=null===(t=n.theme.colors)\|\|void 0===t?void 0:t.palette)\|\|void 0===a?void 0:a.white)}),200);exports.StyledFloatButtonGroup=p,exports.StyledFloatButtonGroupBackgroundPanel=f,exports.StyledFloatButtonGroupButton=g,exports.StyledFloatButtonGroupButtonIcon=y,exports.StyledFloatButtonGroupButtonLabel=x,exports.StyledFloatButtonGroupContent=u,exports.StyledFloatButtonGroupItemsWrapper=c,exports.StyledFloatButtonGroupToggleIcon=h,exports.TRANSITION_TIMING=200;
2	+ //# sourceMappingURL=index.styled.js.map

package/build/components/molecules/floatButtonGroup/index.styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.styled.js","sources":["../../../../src/components/molecules/floatButtonGroup/index.styled.tsx"],"sourcesContent":["import styled from 'styled-components'\n\nexport const TRANSITION_TIMING = 200\n\nexport const StyledFloatButtonGroup = styled.div``\n\nexport const StyledFloatButtonGroupBackgroundPanel = styled.div`\n width: 100vw;\n height: 100vh;\n position: fixed;\n bottom: 0;\n right: 0;\n background-color: ${(props) =>\n props.theme.colors.white || props.theme.colors?.palette?.white};\n opacity: 0.83;\n transition: display ${TRANSITION_TIMING}ms linear;\n\n [data-floatmenu-open='true'] & {\n animation: showBackgroundPanel ${TRANSITION_TIMING}ms linear 0s normal\n forwards;\n }\n\n [data-floatmenu-open='false'] & {\n animation: hideBackgroundPanel ${TRANSITION_TIMING}ms linear 0s normal\n forwards;\n }\n\n @keyframes showBackgroundPanel {\n 0% {\n opacity: 0;\n width: 100vw;\n height: 100vh;\n }\n 100% {\n opacity: 0.83;\n }\n }\n\n @keyframes hideBackgroundPanel {\n 0% {\n width: 100vw;\n height: 100vh;\n }\n 99% {\n width: 100vw;\n height: 100vh;\n }\n 100% {\n opacity: 0;\n width: 0;\n height: 0;\n }\n }\n`\n\nexport const StyledFloatButtonGroupContent = styled.div`\n position: fixed;\n right: 16px;\n bottom: 40px;\n`\n\nexport const StyledFloatButtonGroupItemsWrapper = styled.div`\n display: flex;\n flex-direction: column;\n gap: 16px;\n transition: all ${TRANSITION_TIMING}ms ease-in-out;\n position: fixed;\n bottom: 112px;\n right: 16px;\n\n // scale\n [data-animation-type='scale'] & {\n transform-origin: 100% 100%;\n }\n\n [data-animation-type='scale'][data-floatmenu-open='true'] & {\n transform: scale(1);\n }\n\n [data-animation-type='scale'][data-floatmenu-open='false'] & {\n transform: scale(0);\n bottom: 46px;\n right: 36px;\n }\n`\n\nexport const StyledFloatButtonGroupToggleIcon = styled.div`\n border-radius: 50%;\n width: 56px;\n height: 56px;\n position: relative;\n cursor: pointer;\n margin-left: auto;\n transition: all 0.1s linear;\n -webkit-tap-highlight-color: transparent;\n [data-site-type='hb'] & {\n background-color: ${(props) =>\n props.theme.colors.primaryBase || props.theme.colors.primary};\n &:hover {\n background-color: ${(props) =>\n props.theme.colors.primaryHover ||\n props.theme.colors?.palette?.blue_700};\n }\n }\n [data-site-type='mb'] & {\n background-color: #2d87f3;\n &:hover {\n background-color: #2c74df;\n }\n }\n\n &:before {\n content: '';\n width: 2px;\n height: 20px;\n background-color: ${(props) =>\n props.theme.colors.white || props.theme.colors?.palette?.white};\n border-radius: 2px;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n &:after {\n content: '';\n width: 20px;\n height: 2px;\n background-color: ${(props) =>\n props.theme.colors.white || props.theme.colors?.palette?.white};\n border-radius: 2px;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n }\n\n [data-floatmenu-open='true'] &:before,\n [data-floatmenu-open='true'] &:after {\n animation: toX ${TRANSITION_TIMING}ms linear 0s normal forwards;\n }\n\n [data-floatmenu-open='false'] &:before,\n [data-floatmenu-open='false'] &:after {\n animation: toPlus ${TRANSITION_TIMING}ms linear 0s normal forwards;\n }\n\n @keyframes toX {\n 0% {\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n 49% {\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n 50% {\n width: 2px;\n height: 2px;\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n 100% {\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n }\n\n @keyframes toPlus {\n 0% {\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n 49% {\n transform: translate(-50%, -50%) rotateZ(45deg);\n }\n 50% {\n width: 2px;\n height: 2px;\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n 100% {\n transform: translate(-50%, -50%) rotateZ(0deg);\n }\n }\n`\n\nexport const StyledFloatButtonGroupButton = styled.div`\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: flex-end;\n\n width: fit-content;\n margin-left: auto;\n\n [data-floatmenu-open='true'] {\n cursor: pointer;\n }\n [data-floatmenu-open='false'] {\n pointer-events: none;\n }\n\n [data-animation-type='zoom'] &,\n [data-animation-type='slide'] & {\n position: absolute;\n right: 0;\n width: max-content;\n }\n // slide\n [data-animation-type='slide'] & {\n transition: all ${TRANSITION_TIMING}ms ease-in;\n }\n\n [data-animation-type='slide'][data-floatmenu-open='true'] & {\n animation: showItem ${TRANSITION_TIMING}ms;\n }\n [data-animation-type='slide'][data-floatmenu-open='false'] & {\n bottom: -64px !important;\n animation: hideItemOnZoom ${TRANSITION_TIMING + 50}ms normal forwards;\n }\n\n // zoom\n [data-animation-type='zoom'][data-floatmenu-open='false'] & {\n animation: hideItemOnZoom ${TRANSITION_TIMING + 50}ms normal forwards;\n }\n\n @keyframes showItem {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n }\n\n @keyframes hideItemOnZoom {\n 0% {\n transform: translateX(0);\n opacity: 1;\n }\n\n 99% {\n transform: translateX(0);\n opacity: 0.5;\n }\n\n 100% {\n transform: translateX(calc(100% + 16px));\n opacity: 0;\n }\n }\n`\n\nexport const StyledFloatButtonGroupButtonLabel = styled.div`\n font-size: 14px;\n\n // zoom\n [data-animation-type='zoom'] & {\n transition: transform ${TRANSITION_TIMING}ms ease-in-out;\n transform-origin: 100% 0;\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='true'] & {\n transform: scale(1);\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='false'] & {\n transform: scale(0);\n }\n\n // slide\n [data-animation-type='slide'] & {\n transition: opacity ${TRANSITION_TIMING}ms;\n }\n [data-animation-type='slide'][data-floatmenu-open='true'] & {\n opacity: 1;\n }\n [data-animation-type='slide'][data-floatmenu-open='false'] & {\n opacity: 0;\n }\n`\n\nexport const StyledFloatButtonGroupButtonIcon = styled.div`\n border-radius: 50%;\n box-shadow: 0px 16px 24px rgba(0, 0, 0, 0.06), 0px 2px 8px rgba(0, 0, 0, 0.04),\n 0px 0px 1px rgba(0, 0, 0, 0.04);\n width: 48px;\n height: 48px;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: ${(props) =>\n props.theme.colors.white || props.theme.colors?.palette?.white};\n\n // zoom\n [data-animation-type='zoom'] & {\n transition: transform ${TRANSITION_TIMING}ms ease-in-out;\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='true'] & {\n transform: scale(1);\n }\n\n [data-animation-type='zoom'][data-floatmenu-open='false'] & {\n transform: scale(0);\n }\n\n > img {\n width: 24px;\n height: 24px;\n object-fit: contain;\n }\n`\n"],"names":["StyledFloatButtonGroup","styled","div","templateObject_1","__makeTemplateObject","StyledFloatButtonGroupBackgroundPanel","templateObject_2","props","_a","_b","theme","colors","white","palette","StyledFloatButtonGroupContent","templateObject_3","StyledFloatButtonGroupItemsWrapper","templateObject_4","StyledFloatButtonGroupToggleIcon","templateObject_5","primaryBase","primary","primaryHover","blue_700","StyledFloatButtonGroupButton","templateObject_6","TRANSITION_TIMING","StyledFloatButtonGroupButtonLabel","templateObject_7","StyledFloatButtonGroupButtonIcon","templateObject_8"],"mappings":"4PAIaA,EAAyBC,EAAM,QAACC,IAAGC,IAAAA,EAAAC,uBAAA,CAAA,IAAA,CAAA,OAEnCC,EAAwCJ,EAAM,QAACC,IAAGI,IAAAA,EAAAF,EAAAA,qBAAA,CAAA,2GAAA,8CAAA,wFAAA,wHAAA,+bAAA,CAAA,2GAOG,8CAEzB,wFAGa,wHAKA,kcAXhC,SAACG,GAAK,IAAAC,EAAAC,EACxB,OAAAF,EAAMG,MAAMC,OAAOC,gBAASH,EAAoB,QAApBD,EAAAD,EAAMG,MAAMC,cAAQ,IAAAH,OAAA,EAAAA,EAAAK,8BAASD,SAX5B,aAqDpBE,EAAgCb,EAAM,QAACC,IAAGa,IAAAA,EAAAX,uBAAA,CAAA,2DAAA,CAAA,8DAM1CY,EAAqCf,EAAAA,QAAOC,IAAGe,IAAAA,EAAAb,EAAAA,qBAAA,CAAA,kFAAA,+YAAA,CAAA,kFAIvB,iZA/DJ,KAoFpBc,EAAmCjB,EAAM,QAACC,IAAGiB,IAAAA,EAAAf,EAAAA,qBAAA,CAAA,8PAAA,6CAAA,wOAAA,8NAAA,4OAAA,qJAAA,2vBAAA,CAAA,8PAWQ,6CAIrB,wOAeuB,8NAaA,4OAU9B,qJAKG,8vBAhDjB,SAACG,GACnB,OAAAA,EAAMG,MAAMC,OAAOS,aAAeb,EAAMG,MAAMC,OAAOU,WAEjC,SAACd,WACnB,OAAAA,EAAMG,MAAMC,OAAOW,eACQ,QAA3Bb,EAAkB,QAAlBD,EAAAD,EAAMG,MAAMC,cAAM,IAAAH,OAAA,EAAAA,EAAEK,eAAO,IAAAJ,OAAA,EAAAA,EAAEc,aAcb,SAAChB,GAAK,IAAAC,EAAAC,EACxB,OAAAF,EAAMG,MAAMC,OAAOC,QAAsC,QAA7BH,EAAoB,QAApBD,EAAAD,EAAMG,MAAMC,cAAQ,IAAAH,OAAA,EAAAA,EAAAK,eAAS,IAAAJ,OAAA,EAAAA,EAAAG,UAYvC,SAACL,WACnB,OAAAA,EAAMG,MAAMC,OAAOC,QAAsC,QAA7BH,EAAoB,QAApBD,EAAAD,EAAMG,MAAMC,cAAQ,IAAAH,OAAA,EAAAA,EAAAK,eAAS,IAAAJ,OAAA,EAAAA,EAAAG,SA/H9B,SAoLpBY,EAA+BvB,EAAM,QAACC,IAAGuB,IAAAA,EAAArB,EAAAA,qBAAA,CAAA,geAAA,gHAAA,4IAAA,yIAAA,wZAAA,CAAA,geAwBf,gHAII,4IAIW,yIAKA,0ZAzNrB,QAoNDsB,IAKAA,KA+BnBC,EAAoC1B,EAAM,QAACC,IAAG0B,IAAAA,EAAAxB,EAAAA,qBAAA,CAAA,oGAAA,sUAAA,6LAAA,CAAA,oGAKd,sUAcF,+LA3QV,SAqRpByB,EAAmC5B,EAAM,QAACC,IAAG4B,IAAAA,EAAA1B,uBAAA,CAAA,gRAAA,iFAAA,8SAAA,CAAA,gRAUQ,iFAIrB,iTALvB,SAACG,GACnB,IAAAC,EAAAC,EAAA,OAAAF,EAAMG,MAAMC,OAAOC,QAAoC,QAA3BH,YAAAF,EAAMG,MAAMC,6BAAQE,eAAO,IAAAJ,OAAA,EAAAA,EAAEG,SA/R5B,8WAAA"}

package/build/components/molecules/iconText/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("./index.styled.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=r(e);exports.IconText=function(e){var r=e.size,n=e.iconPosition,a=e.className,o=e.children,c=e.icon;return i.default.createElement(t.StyledIconText,{className:a,"data-size":r,"data-icon-position":n},"left"===n&&c,o,"right"===n&&c)};
2	+ //# sourceMappingURL=index.js.map

package/build/components/molecules/iconText/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/iconText/index.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\n\nimport { StyledIconText } from './index.styled'\n\nexport type Props = {\n size: 'lg' | 'md' | 'sm'\n iconPosition: 'left' | 'right'\n children: ReactNode\n icon: JSX.Element\n className?: string\n}\n\nconst IconText = ({\n size,\n iconPosition,\n className,\n children,\n icon: Icon,\n}: Props) => {\n return (\n <StyledIconText\n className={className}\n data-size={size}\n data-icon-position={iconPosition}\n >\n {iconPosition === 'left' && Icon}\n {children}\n {iconPosition === 'right' && Icon}\n </StyledIconText>\n )\n}\n\nexport { IconText }\n"],"names":["_a","size","iconPosition","className","children","Icon","icon","React","createElement","StyledIconText"],"mappings":"8NAYiB,SAACA,GAChB,IAAAC,EAAID,EAAAC,KACJC,EAAYF,EAAAE,aACZC,EAASH,EAAAG,UACTC,EAAQJ,EAAAI,SACFC,EAAIL,EAAAM,KAEV,OACEC,EAAC,QAAAC,cAAAC,EAAAA,eACC,CAAAN,UAAWA,EAAS,YACTF,EAAI,qBACKC,GAEF,SAAjBA,GAA2BG,EAC3BD,EACiB,UAAjBF,GAA4BG"}

package/build/components/molecules/iconText/index.styled.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js"),t=require("../../../misc/utils.js");function e(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var i,s=e(require("styled-components")).default.div(i\|\|(i=n.__makeTemplateObject(["\n display: flex;\n align-items: center;\n --font-weight-lg: ",";\n --font-weight-md: ",";\n --font-weight-sm: ",";\n\n &[data-icon-position='left'] {\n & > :first-child {\n margin-right: 8px;\n }\n\n & > :last-child {\n width: calc(100% - 24px);\n }\n }\n &[data-icon-position='right'] {\n & > :first-child {\n width: calc(100% - 24px);\n }\n & > :last-child {\n margin-left: 8px;\n }\n }\n\n "," {\n &[data-size='lg'] {\n font-size: 16px;\n line-height: 24px;\n font-weight: var(--font-weight-lg);\n }\n &[data-size='md'] {\n font-size: 14px;\n line-height: 22px;\n font-weight: var(--font-weight-md);\n }\n &[data-size='sm'] {\n font-size: 13px;\n line-height: 20px;\n font-weight: var(----font-weight-sm);\n }\n }\n"],["\n display: flex;\n align-items: center;\n --font-weight-lg: ",";\n --font-weight-md: ",";\n --font-weight-sm: ",";\n\n &[data-icon-position='left'] {\n & > :first-child {\n margin-right: 8px;\n }\n\n & > :last-child {\n width: calc(100% - 24px);\n }\n }\n &[data-icon-position='right'] {\n & > :first-child {\n width: calc(100% - 24px);\n }\n & > :last-child {\n margin-left: 8px;\n }\n }\n\n "," {\n &[data-size='lg'] {\n font-size: 16px;\n line-height: 24px;\n font-weight: var(--font-weight-lg);\n }\n &[data-size='md'] {\n font-size: 14px;\n line-height: 22px;\n font-weight: var(--font-weight-md);\n }\n &[data-size='sm'] {\n font-size: 13px;\n line-height: 20px;\n font-weight: var(----font-weight-sm);\n }\n }\n"])),(function(n){return n.theme.sizes.fwBold}),(function(n){return n.theme.sizes.fwRegular}),(function(n){return n.theme.sizes.fwRegular}),t.MediaQueries.mbDown);exports.StyledIconText=s;
2	+ //# sourceMappingURL=index.styled.js.map

package/build/components/molecules/iconText/index.styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.styled.js","sources":["../../../../src/components/molecules/iconText/index.styled.tsx"],"sourcesContent":["import { ThemeProps } from 'misc/theme'\nimport { MediaQueries } from 'misc/utils'\nimport styled from 'styled-components'\n\nexport const StyledIconText = styled.div`\n display: flex;\n align-items: center;\n --font-weight-lg: ${(props: ThemeProps) => props.theme.sizes.fwBold};\n --font-weight-md: ${(props: ThemeProps) => props.theme.sizes.fwRegular};\n --font-weight-sm: ${(props: ThemeProps) => props.theme.sizes.fwRegular};\n\n &[data-icon-position='left'] {\n & > *:first-child {\n margin-right: 8px;\n }\n\n & > *:last-child {\n width: calc(100% - 24px);\n }\n }\n &[data-icon-position='right'] {\n & > *:first-child {\n width: calc(100% - 24px);\n }\n & > *:last-child {\n margin-left: 8px;\n }\n }\n\n ${MediaQueries.mbDown} {\n &[data-size='lg'] {\n font-size: 16px;\n line-height: 24px;\n font-weight: var(--font-weight-lg);\n }\n &[data-size='md'] {\n font-size: 14px;\n line-height: 22px;\n font-weight: var(--font-weight-md);\n }\n &[data-size='sm'] {\n font-size: 13px;\n line-height: 20px;\n font-weight: var(----font-weight-sm);\n }\n }\n`\n"],"names":["StyledIconText","styled","div","templateObject_1","__makeTemplateObject","props","theme","sizes","fwBold","fwRegular","MediaQueries","mbDown"],"mappings":"gPAIaA,kCAAiBC,QAAOC,IAAGC,IAAAA,EAAAC,EAAAA,qBAAA,CAAA,mEAAA,0BAAA,0BAAA,gVAAA,sYAAA,CAAA,mEAG6B,0BACG,0BACA,gVAoBjD,yYAtBD,SAACC,GAAsB,OAAAA,EAAMC,MAAMC,MAAMC,UACzC,SAACH,GAAsB,OAAAA,EAAMC,MAAMC,MAAME,aACzC,SAACJ,GAAsB,OAAAA,EAAMC,MAAMC,MAAME,YAoB3DC,EAAYA,aAACC"}

package/build/components/molecules/languageSwitcher/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");require("../../atoms/text/index.styled.js"),require("../../atoms/alert/index.styled.js"),require("../../atoms/avatar/index.styled.js"),require("../../atoms/badge/index.styled.js"),require("../../atoms/borderHeading/index.styled.js"),require("../../atoms/button/index.styled.js"),require("../../atoms/divider/index.styled.js"),require("../../atoms/fileDropdown/index.styled.js");var i=require("../../atoms/flag/index.js");require("../../atoms/grid/index.styled.js"),require("../../atoms/heading/index.styled.js"),require("../../atoms/label/index.js"),require("../../atoms/input/index.styled.js"),require("../../atoms/logo/index.js"),require("../../../misc/utils.js"),require("../../atoms/pagination/index.styled.js"),require("../../atoms/pureInput/index.js"),require("../../atoms/radio/index.styled.js"),require("../../atoms/shadow/index.styled.js"),require("react-range"),require("../../atoms/slider/index.styled.js"),require("../../atoms/tag/index.styled.js"),require("../../atoms/toggle/index.styled.js"),require("../../atoms/underlinedLink/index.styled.js"),require("../../atoms/uploader/index.styled.js"),require("../../atoms/textArea/index.js"),require("../../atoms/container/index.styled.js"),require("../../atoms/checkbox/index.styled.js"),require("../../atoms/textDivider/index.js"),require("../../atoms/rateStars/index.styled.js"),require("../../atoms/icons/Ask.js"),require("../../atoms/icons/BarChart.js"),require("../../atoms/icons/Booking.js"),require("../../atoms/icons/Bookmark.js"),require("../../atoms/icons/Community.js"),require("../../atoms/icons/EditSpecial.js"),require("../../atoms/icons/Family.js"),require("../../atoms/icons/Font.js"),require("../../atoms/icons/Heart.js"),require("../../atoms/icons/Home.js"),require("../../atoms/icons/Like.js"),require("../../atoms/icons/MyCommunity.js"),require("../../atoms/icons/PlusSpecial.js"),require("../../atoms/icons/Recalculate.js"),require("../../atoms/icons/Scale.js"),require("../../atoms/icons/Share.js"),require("../../atoms/icons/Stethoscope.js"),require("../../atoms/progress/index.styled.js");var s=require("./index.styled.js"),r=require("./tooltipSelection/index.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=t(e),a=function(e){var r,t,a,n=e.locale,l=e.label,d=e.href;return o.default.createElement(s.StyledLanguageChangeLink,{href:d},o.default.createElement(i.Flag,{country:null===(t=null===(r=null==n?void 0:n.split("-"))\|\|void 0===r?void 0:r[1])\|\|void 0===t?void 0:t.toUpperCase(),width:16,height:16,rounded:!0,language:null===(a=null==n?void 0:n.split("-"))\|\|void 0===a?void 0:a[0]}),o.default.createElement("span",null,l))};exports.LanguageLabel=a,exports.LanguageSwitcher=function(e){var i,s,t=e.languageOptions,n=e.locale,l=null==t?void 0:t.find((function(e){return e.locale===n}));return(null==t?void 0:t.length)?o.default.createElement(r.TooltipSelection,{options:t,selected:l.value,label:o.default.createElement(a,{locale:n,label:l.label\|\|(null===(s=null===(i=n.split("-"))\|\|void 0===i?void 0:i[0])\|\|void 0===s?void 0:s.toUpperCase())}),onChange:function(e){"undefined"!=typeof window&&(window.location.href=e)},style:{width:100},showSelected:!0,showIndicator:!1}):null};
2	+ //# sourceMappingURL=index.js.map

package/build/components/molecules/languageSwitcher/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/languageSwitcher/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Flag, FlagCountryType } from 'src/components/atoms'\nimport { FlagLanguageType } from 'src/components/atoms/flag'\nimport { LocaleType } from 'src/interfaces/types'\n\nimport { StyledLanguageChangeLink } from './index.styled'\nimport { Option, TooltipSelection } from './tooltipSelection'\n\nexport type Props = {\n languageOptions?: Option[]\n locale: LocaleType\n}\n\nexport const LanguageSwitcher = ({ languageOptions, locale }: Props) => {\n const selectedLanguage = languageOptions?.find(\n (option) => option.locale === locale,\n )\n if (!languageOptions?.length) {\n return null\n }\n\n return (\n <TooltipSelection\n options={languageOptions}\n selected={selectedLanguage.value}\n label={\n <LanguageLabel\n locale={locale}\n label={\n selectedLanguage.label || locale.split('-')?.[0]?.toUpperCase()\n }\n />\n }\n onChange={(href) => {\n if (typeof window !== 'undefined') {\n window.location.href = href\n }\n }}\n style={{ width: 100 }}\n showSelected={true}\n showIndicator={false}\n />\n )\n}\n\nexport const LanguageLabel = ({\n locale,\n label,\n href,\n}: {\n locale: LocaleType\n label: string\n href?: string\n}) => {\n return (\n <StyledLanguageChangeLink href={href}>\n <Flag\n country={locale?.split('-')?.[1]?.toUpperCase() as FlagCountryType}\n width={16}\n height={16}\n rounded\n language={locale?.split('-')?.[0] as FlagLanguageType}\n />\n <span>{label}</span>\n </StyledLanguageChangeLink>\n )\n}\n"],"names":["LanguageLabel","_a","locale","label","href","React","createElement","StyledLanguageChangeLink","Flag","country","_b","split","_c","toUpperCase","width","height","rounded","language","_d","languageOptions","selectedLanguage","find","option","length","TooltipSelection","options","selected","value","onChange","window","location","style","showSelected","showIndicator"],"mappings":"kxEA8CaA,EAAgB,SAACC,aAC5BC,WACAC,EAAKF,EAAAE,MACLC,EAAIH,EAAAG,KAMJ,OACEC,EAAC,QAAAC,cAAAC,EAAwBA,yBAAC,CAAAH,KAAMA,GAC9BC,EAAAA,QAACC,cAAAE,EAAAA,MACCC,QAAgC,UAAL,QAAlBC,EAAAR,aAAA,EAAAA,EAAQS,MAAM,YAAI,IAAAD,OAAA,EAAAA,EAAG,UAAE,IAAAE,OAAA,EAAAA,EAAEC,cAClCC,MAAO,GACPC,OAAQ,GACRC,SAAO,EACPC,SAA4B,QAAlBC,EAAAhB,aAAM,EAANA,EAAQS,MAAM,YAAI,IAAAO,OAAA,EAAAA,EAAG,KAEjCb,EAAAA,QAAAC,cAAA,OAAA,KAAOH,sDAlDmB,SAACF,WAAEkB,EAAelB,EAAAkB,gBAAEjB,EAAMD,EAAAC,OAClDkB,EAAmBD,aAAA,EAAAA,EAAiBE,MACxC,SAACC,GAAW,OAAAA,EAAOpB,SAAWA,KAEhC,OAAKiB,eAAAA,EAAiBI,QAKpBlB,wBAACmB,EAAAA,iBAAgB,CACfC,QAASN,EACTO,SAAUN,EAAiBO,MAC3BxB,MACEE,EAAA,QAAAC,cAACN,EACC,CAAAE,OAAQA,EACRC,MACEiB,EAAiBjB,QAAiC,QAAxBS,YAAAV,EAAOS,MAAM,2BAAO,UAAI,IAAAC,OAAA,EAAAA,EAAAC,iBAIxDe,SAAU,SAACxB,GACa,oBAAXyB,SACTA,OAAOC,SAAS1B,KAAOA,IAG3B2B,MAAO,CAAEjB,MAAO,KAChBkB,cAAc,EACdC,eAAe,IAtBV"}

package/build/components/molecules/languageSwitcher/index.styled.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js");function e(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var t,o=e(require("styled-components")).default.a(t\|\|(t=n.__makeTemplateObject(["\n display: inline-flex;\n position: relative;\n flex-direction: row;\n align-items: center;\n padding: 7px 11px;\n gap: 2px;\n\n background: ",";\n border: 1px solid ",";\n border-radius: 20px;\n\n color: ",";\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n text-decoration: none;\n\n cursor: pointer;\n"],["\n display: inline-flex;\n position: relative;\n flex-direction: row;\n align-items: center;\n padding: 7px 11px;\n gap: 2px;\n\n background: ",";\n border: 1px solid ",";\n border-radius: 20px;\n\n color: ",";\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n text-decoration: none;\n\n cursor: pointer;\n"])),(function(n){return n.theme.colors.white}),(function(n){return n.theme.colors.neutral100}),(function(n){return n.theme.colors.gray600}));exports.StyledLanguageChangeLink=o;
2	+ //# sourceMappingURL=index.styled.js.map

package/build/components/molecules/languageSwitcher/index.styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.styled.js","sources":["../../../../src/components/molecules/languageSwitcher/index.styled.tsx"],"sourcesContent":["import { ThemeProps } from 'src/misc/theme'\nimport styled from 'styled-components'\n\nexport const StyledLanguageChangeLink = styled.a`\n display: inline-flex;\n position: relative;\n flex-direction: row;\n align-items: center;\n padding: 7px 11px;\n gap: 2px;\n\n background: ${(props: ThemeProps) => props.theme.colors.white};\n border: 1px solid ${(props: ThemeProps) => props.theme.colors.neutral100};\n border-radius: 20px;\n\n color: ${(props: ThemeProps) => props.theme.colors.gray600};\n font-weight: 600;\n font-size: 12px;\n line-height: 18px;\n text-decoration: none;\n\n cursor: pointer;\n`\n"],"names":["StyledLanguageChangeLink","styled","a","templateObject_1","__makeTemplateObject","props","theme","colors","white","neutral100","gray600"],"mappings":"4MAGaA,kCAA2BC,QAAOC,EAACC,IAAAA,EAAAC,uBAAA,CAAA,wJAAA,0BAAA,yCAAA,sHAAA,CAAA,wJAQe,0BACW,yCAGd,yHAJ5C,SAACC,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SACpC,SAACH,GAAsB,OAAAA,EAAMC,MAAMC,OAAOE,cAGrD,SAACJ,GAAsB,OAAAA,EAAMC,MAAMC,OAAOG"}

package/build/components/molecules/languageSwitcher/tooltipSelection/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../../../../assets/svg/check.svg.js"),l=require("../../../atoms/text/index.js"),n=require("./index.styled.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=a(e);exports.TooltipSelection=function(a){var o=a.options,u=a.label,c=a.labelRenderer,i=a.selected,d=a.onChange,s=a.showSelected,f=void 0===s\|\|s,p=a.style,v=void 0===p?{}:p,m=a.showIndicator,y=void 0===m\|\|m,S=e.useState(!1),k=S[0],E=S[1];return r.default.createElement(r.default.Fragment,null,r.default.createElement(n.StyledSelectionContainer,null,r.default.createElement(n.StyledSelectionLabel,{onClick:function(){return E((function(e){return!e}))}},u\|\|(null==c?void 0:c(k))\|\|null,r.default.createElement(n.StyleSelectionPopup,{"data-is-open":k,style:v,"data-show-indicator":y},o.map((function(e,a){return r.default.createElement(n.StyledOption,{key:a,"data-selected":f&&i===e.value,onClick:function(t){i!==e.value&&(d(e.value),E((function(e){return!e}))),t.stopPropagation()}},r.default.createElement(l.Text,{size:"p3"},e.label),f&&i===e.value&&r.default.createElement("img",{src:t,alt:"check",className:"check-icon"}))}))))),k&&r.default.createElement(n.StyledPopupBackground,{onClick:function(){return E(!1)}}))};
2	+ //# sourceMappingURL=index.js.map

package/build/components/molecules/languageSwitcher/tooltipSelection/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sources":["../../../../../src/components/molecules/languageSwitcher/tooltipSelection/index.tsx"],"sourcesContent":["import React, { useState } from 'react'\n\nimport { Check } from 'assets/svg'\nimport { Text } from 'components/atoms/text'\nimport { CSSProperties } from 'styled-components'\n\nimport {\n StyledOption,\n StyledPopupBackground,\n StyledSelectionContainer,\n StyledSelectionLabel,\n StyleSelectionPopup,\n} from './index.styled'\nexport type Option = {\n value: string\n label: string\n locale?: string\n}\nexport type Props = {\n options: Option[]\n selected: string | number\n label?: string | JSX.Element\n labelRenderer?: (isOpen?: boolean) => string | JSX.Element\n onChange: (s: string) => void\n showSelected?: boolean\n style?: CSSProperties\n showIndicator?: boolean\n}\n\nconst TooltipSelection = ({\n options,\n label,\n labelRenderer,\n selected,\n onChange,\n showSelected = true,\n style = {},\n showIndicator = true,\n}: Props) => {\n const [isOpen, setIsOpen] = useState<boolean>(false)\n\n return (\n <>\n <StyledSelectionContainer>\n <StyledSelectionLabel\n onClick={() => setIsOpen((value: boolean) => !value)}\n >\n {label || labelRenderer?.(isOpen) || null}\n <StyleSelectionPopup\n data-is-open={isOpen}\n style={style}\n data-show-indicator={showIndicator}\n >\n {options.map((option, index) => (\n <StyledOption\n key={index}\n data-selected={showSelected && selected === option.value}\n onClick={(e) => {\n if (selected !== option.value) {\n onChange(option.value)\n setIsOpen((value: boolean) => !value)\n }\n e.stopPropagation()\n }}\n >\n <Text size=\"p3\">{option.label}</Text>\n {showSelected && selected === option.value && (\n <img src={Check} alt=\"check\" className=\"check-icon\" />\n )}\n </StyledOption>\n ))}\n </StyleSelectionPopup>\n </StyledSelectionLabel>\n </StyledSelectionContainer>\n {isOpen && (\n <StyledPopupBackground\n onClick={() => setIsOpen(false)}\n ></StyledPopupBackground>\n )}\n </>\n )\n}\n\nexport { TooltipSelection }\n"],"names":["_a","options","label","labelRenderer","selected","onChange","_b","showSelected","_c","style","_d","showIndicator","_e","useState","isOpen","setIsOpen","React","createElement","Fragment","StyledSelectionContainer","StyledSelectionLabel","onClick","value","StyleSelectionPopup","map","option","index","StyledOption","key","e","stopPropagation","Text","size","src","Check","alt","className","StyledPopupBackground"],"mappings":"iUA6ByB,SAACA,GACxB,IAAAC,EAAOD,EAAAC,QACPC,EAAKF,EAAAE,MACLC,EAAaH,EAAAG,cACbC,EAAQJ,EAAAI,SACRC,EAAQL,EAAAK,SACRC,EAAmBN,EAAAO,aAAnBA,OAAY,IAAAD,GAAOA,EACnBE,EAAAR,EAAAS,MAAAA,OAAK,IAAAD,EAAG,GAAEA,EACVE,EAAoBV,EAAAW,cAApBA,OAAa,IAAAD,GAAOA,EAEdE,EAAsBC,EAAAA,UAAkB,GAAvCC,EAAMF,EAAA,GAAEG,EAASH,EAAA,GAExB,OACEI,UAAAC,cAAAD,EAAA,QAAAE,SAAA,KACEF,UAAAC,cAACE,EAAAA,yBAAwB,KACvBH,EAAAA,QAAAC,cAACG,EAAAA,qBACC,CAAAC,QAAS,WAAM,OAAAN,GAAU,SAACO,GAAmB,OAACA,OAE7CpB,IAASC,aAAa,EAAbA,EAAgBW,KAAW,KACrCE,EAAAA,QAAAC,cAACM,EAAAA,oBACe,CAAA,eAAAT,EACdL,MAAOA,EAAK,sBACSE,GAEpBV,EAAQuB,KAAI,SAACC,EAAQC,GAAU,OAC9BV,wBAACW,EAAYA,aAAA,CACXC,IAAKF,kBACUnB,GAAgBH,IAAaqB,EAAOH,MACnDD,QAAS,SAACQ,GACJzB,IAAaqB,EAAOH,QACtBjB,EAASoB,EAAOH,OAChBP,GAAU,SAACO,GAAmB,OAACA,MAEjCO,EAAEC,oBAGJd,EAAC,QAAAC,cAAAc,QAAKC,KAAK,MAAMP,EAAOvB,OACvBK,GAAgBH,IAAaqB,EAAOH,OACnCN,EAAAA,QAAKC,cAAA,MAAA,CAAAgB,IAAKC,EAAOC,IAAI,QAAQC,UAAU,sBAOlDtB,GACCE,EAAAA,QAAAC,cAACoB,EAAqBA,sBACpB,CAAAhB,QAAS,WAAM,OAAAN,GAAU"}

package/build/components/molecules/languageSwitcher/tooltipSelection/index.styled.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../../node_modules/tslib/tslib.es6.js");function e(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var t,o,i,r,d,a=e(require("styled-components")),p=a.default.div(t\|\|(t=n.__makeTemplateObject(["\n position: relative;\n display: inline-block;\n"],["\n position: relative;\n display: inline-block;\n"]))),l=a.default.div(o\|\|(o=n.__makeTemplateObject(["\n position: relative;\n"],["\n position: relative;\n"]))),s=a.default.div(i\|\|(i=n.__makeTemplateObject(["\n position: absolute;\n z-index: 21;\n top: 100%;\n right: 0;\n width: 327px;\n padding: 8px;\n background: white;\n border-radius: 4px;\n filter: drop-shadow(0px 8px 40px rgba(0, 0, 0, 0.1));\n\n &[data-is-open='false'] {\n display: none;\n }\n &[data-show-indicator='true'] {\n &:before {\n position: absolute;\n right: 11px;\n bottom: 100%;\n width: 0;\n height: 0;\n border: 0.5rem solid transparent;\n border-top: none;\n border-bottom-color: #fff;\n content: '';\n filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, 0.1));\n }\n }\n"],["\n position: absolute;\n z-index: 21;\n top: 100%;\n right: 0;\n width: 327px;\n padding: 8px;\n background: white;\n border-radius: 4px;\n filter: drop-shadow(0px 8px 40px rgba(0, 0, 0, 0.1));\n\n &[data-is-open='false'] {\n display: none;\n }\n &[data-show-indicator='true'] {\n &:before {\n position: absolute;\n right: 11px;\n bottom: 100%;\n width: 0;\n height: 0;\n border: 0.5rem solid transparent;\n border-top: none;\n border-bottom-color: #fff;\n content: '';\n filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, 0.1));\n }\n }\n"]))),c=a.default.div(r\|\|(r=n.__makeTemplateObject(["\n display: flex;\n height: 40px;\n align-items: center;\n justify-content: space-between;\n\n padding: 0 16px;\n border-radius: 6px;\n cursor: pointer;\n\n .check-icon {\n width: 16px;\n height: 16px;\n }\n &[data-selected='false'] {\n background-color: ",";\n }\n"],["\n display: flex;\n height: 40px;\n align-items: center;\n justify-content: space-between;\n\n padding: 0 16px;\n border-radius: 6px;\n cursor: pointer;\n\n .check-icon {\n width: 16px;\n height: 16px;\n }\n &[data-selected='false'] {\n background-color: ",";\n }\n"])),(function(n){return n.theme.colors.gray100})),b=a.default.div(d\|\|(d=n.__makeTemplateObject(["\n position: fixed;\n z-index: 20;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n cursor: default;\n"],["\n position: fixed;\n z-index: 20;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n cursor: default;\n"])));exports.StyleSelectionPopup=s,exports.StyledOption=c,exports.StyledPopupBackground=b,exports.StyledSelectionContainer=p,exports.StyledSelectionLabel=l;
2	+ //# sourceMappingURL=index.styled.js.map

package/build/components/molecules/languageSwitcher/tooltipSelection/index.styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.styled.js","sources":["../../../../../src/components/molecules/languageSwitcher/tooltipSelection/index.styled.tsx"],"sourcesContent":["import { ThemeProps } from 'misc/theme'\nimport styled from 'styled-components'\n\nexport const StyledSelectionContainer = styled.div`\n position: relative;\n display: inline-block;\n`\n\nexport const StyledSelectionLabel = styled.div`\n position: relative;\n`\n\nexport const StyleSelectionPopup = styled.div`\n position: absolute;\n z-index: 21;\n top: 100%;\n right: 0;\n width: 327px;\n padding: 8px;\n background: white;\n border-radius: 4px;\n filter: drop-shadow(0px 8px 40px rgba(0, 0, 0, 0.1));\n\n &[data-is-open='false'] {\n display: none;\n }\n &[data-show-indicator='true'] {\n &:before {\n position: absolute;\n right: 11px;\n bottom: 100%;\n width: 0;\n height: 0;\n border: 0.5rem solid transparent;\n border-top: none;\n border-bottom-color: #fff;\n content: '';\n filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, 0.1));\n }\n }\n`\n\nexport const StyledOption = styled.div`\n display: flex;\n height: 40px;\n align-items: center;\n justify-content: space-between;\n\n padding: 0 16px;\n border-radius: 6px;\n cursor: pointer;\n\n .check-icon {\n width: 16px;\n height: 16px;\n }\n &[data-selected='false'] {\n background-color: ${(props: ThemeProps) => props.theme.colors.gray100};\n }\n`\nexport const StyledPopupBackground = styled.div`\n position: fixed;\n z-index: 20;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n cursor: default;\n`\n"],"names":["StyledSelectionContainer","styled","div","templateObject_1","__makeTemplateObject","StyledSelectionLabel","templateObject_2","StyleSelectionPopup","templateObject_3","StyledOption","templateObject_4","props","theme","colors","gray100","StyledPopupBackground","templateObject_5"],"mappings":"yPAGaA,EAA2BC,EAAM,QAACC,IAAGC,IAAAA,EAAAC,uBAAA,CAAA,uDAAA,CAAA,0DAKrCC,EAAuBJ,EAAM,QAACC,IAAGI,IAAAA,EAAAF,uBAAA,CAAA,6BAAA,CAAA,gCAIjCG,EAAsBN,EAAM,QAACC,IAAGM,IAAAA,EAAAJ,uBAAA,CAAA,6mBAAA,CAAA,gnBA8BhCK,EAAeR,EAAAA,QAAOC,IAAGQ,IAAAA,EAAAN,EAAAA,qBAAA,CAAA,qRAAA,YAAA,CAAA,qRAemC,eAAjD,SAACO,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,WAGrDC,EAAwBd,EAAM,QAACC,IAAGc,IAAAA,EAAAZ,uBAAA,CAAA,sHAAA,CAAA"}

package/build/components/molecules/mobileBottomNavigation/MobileBottomNavigationIcon.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/tslib/tslib.es6.js"),s=require("react"),i=require("../../atoms/text/index.js");require("../../atoms/alert/index.styled.js"),require("../../atoms/avatar/index.styled.js"),require("../../atoms/badge/index.styled.js"),require("../../atoms/borderHeading/index.styled.js"),require("../../atoms/button/index.styled.js"),require("../../atoms/divider/index.styled.js"),require("../../atoms/fileDropdown/index.styled.js"),require("../../atoms/flag/index.styled.js"),require("../../atoms/grid/index.styled.js"),require("../../atoms/heading/index.styled.js"),require("../../atoms/label/index.js"),require("../../atoms/input/index.styled.js"),require("../../atoms/logo/index.js"),require("../../../misc/utils.js"),require("../../atoms/pagination/index.styled.js"),require("../../atoms/pureInput/index.js"),require("../../atoms/radio/index.styled.js"),require("../../atoms/shadow/index.styled.js"),require("react-range"),require("../../atoms/slider/index.styled.js"),require("../../atoms/tag/index.styled.js"),require("../../atoms/toggle/index.styled.js"),require("../../atoms/underlinedLink/index.styled.js"),require("../../atoms/uploader/index.styled.js"),require("../../atoms/textArea/index.js"),require("../../atoms/container/index.styled.js"),require("../../atoms/checkbox/index.styled.js"),require("../../atoms/textDivider/index.js"),require("../../atoms/rateStars/index.styled.js"),require("../../atoms/icons/Ask.js"),require("../../atoms/icons/BarChart.js"),require("../../atoms/icons/Booking.js"),require("../../atoms/icons/Bookmark.js"),require("../../atoms/icons/Community.js"),require("../../atoms/icons/EditSpecial.js"),require("../../atoms/icons/Family.js"),require("../../atoms/icons/Font.js"),require("../../atoms/icons/Heart.js"),require("../../atoms/icons/Home.js"),require("../../atoms/icons/Like.js"),require("../../atoms/icons/MyCommunity.js"),require("../../atoms/icons/PlusSpecial.js"),require("../../atoms/icons/Recalculate.js"),require("../../atoms/icons/Scale.js"),require("../../atoms/icons/Share.js"),require("../../atoms/icons/Stethoscope.js"),require("../../atoms/progress/index.styled.js");var t=require("../../../misc/theme.js"),r=require("./index.styled.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=a(s);exports.MobileBottomNavigationIcon=function(s){var a=s.badgeAmount,d=s.disabled,n=void 0!==d&&d,l=s.hasBadge,u=void 0!==l&&l,m=s.icon,c=s.isActive,j=void 0!==c&&c,q=s.isSpecial,x=void 0!==q&&q,y=s.label,b=e.__rest(s,["badgeAmount","disabled","hasBadge","icon","isActive","isSpecial","label"]);return o.default.createElement(r.StyledMobileBottomNavigationIcon,e.__assign({"data-is-special":x,"data-is-active":j,"data-is-disabled":n},b),o.default.createElement("div",{className:"mobile-navigation-icon","data-no-label":!Boolean(y)},u&&o.default.createElement(r.StyledBadge,{"data-no-label":!Boolean(y)},o.default.createElement(i.Text,{size:"s5",type:"semiBold",color:t.theme.colors.white},a)),m),y&&o.default.createElement("span",{className:"mobile-navigation-label"},y))};
2	+ //# sourceMappingURL=MobileBottomNavigationIcon.js.map

package/build/components/molecules/mobileBottomNavigation/MobileBottomNavigationIcon.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"MobileBottomNavigationIcon.js","sources":["../../../../src/components/molecules/mobileBottomNavigation/MobileBottomNavigationIcon.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Text } from 'components/atoms'\nimport { theme } from 'misc/theme'\n\nimport { StyledBadge, StyledMobileBottomNavigationIcon } from './index.styled'\n\nexport type MobileBottomNavigationIconProps = {\n badgeAmount?: string\n disabled?: boolean\n hasBadge?: boolean\n icon: JSX.Element\n isActive?: boolean\n isSpecial?: boolean\n label?: string\n on?: string\n} & React.HTMLAttributes<HTMLDivElement>\n\nconst MobileBottomNavigationIcon = ({\n badgeAmount,\n disabled = false,\n hasBadge = false,\n icon,\n isActive = false,\n isSpecial = false,\n label,\n ...props\n}: MobileBottomNavigationIconProps) => {\n return (\n <StyledMobileBottomNavigationIcon\n data-is-special={isSpecial}\n data-is-active={isActive}\n data-is-disabled={disabled}\n {...props}\n >\n <div className=\"mobile-navigation-icon\" data-no-label={!Boolean(label)}>\n {hasBadge && (\n <StyledBadge data-no-label={!Boolean(label)}>\n <Text size=\"s5\" type=\"semiBold\" color={theme.colors.white}>\n {badgeAmount}\n </Text>\n </StyledBadge>\n )}\n {icon}\n </div>\n {label && <span className=\"mobile-navigation-label\">{label}</span>}\n </StyledMobileBottomNavigationIcon>\n )\n}\n\nexport { MobileBottomNavigationIcon }\n"],"names":["_a","badgeAmount","_b","disabled","_c","hasBadge","icon","_d","isActive","_e","isSpecial","label","props","__rest","React","createElement","StyledMobileBottomNavigationIcon","__assign","className","Boolean","StyledBadge","Text","size","type","color","theme","colors","white"],"mappings":"k2EAkBmC,SAACA,GAClC,IAAAC,EAAWD,EAAAC,YACXC,aAAAC,cAAgBD,EAChBE,EAAAJ,EAAAK,SAAAA,OAAQ,IAAAD,GAAQA,EAChBE,EAAIN,EAAAM,KACJC,EAAgBP,EAAAQ,SAAhBA,OAAW,IAAAD,KACXE,EAAAT,EAAAU,UAAAA,OAAS,IAAAD,GAAQA,EACjBE,EAAKX,EAAAW,MACFC,EAAKC,SAAAb,EAR0B,6EAUlC,OACEc,EAAC,QAAAC,cAAAC,mCACkBC,EAAAA,SAAA,CAAA,kBAAAP,mBACDF,EAAQ,mBACNL,GACdS,GAEJE,UAAKC,cAAA,MAAA,CAAAG,UAAU,yBAAwB,iBAAiBC,QAAQR,IAC7DN,GACCS,EAAAA,QAACC,cAAAK,EAAWA,8BAAiBD,QAAQR,IACnCG,EAAAA,QAACC,cAAAM,EAAAA,MAAKC,KAAK,KAAKC,KAAK,WAAWC,MAAOC,EAAKA,MAACC,OAAOC,OACjD1B,IAINK,GAEFK,GAASG,EAAAA,QAAMC,cAAA,OAAA,CAAAG,UAAU,2BAA2BP"}

package/build/components/molecules/mobileBottomNavigation/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/tslib/tslib.es6.js"),o=require("react"),i=require("./index.styled.js"),t=require("./MobileBottomNavigationIcon.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=r(o),l=function(o){var t=o.children,r=o.numberOfChildren,l=void 0===r?5:r,a=o.on,d=void 0===a?"":a,s=o.isCollapsed,u=void 0!==s&&s,c=e.__rest(o,["children","numberOfChildren","on","isCollapsed"]);return n.default.createElement(i.StyledMobileBottomNavigation,e.__assign({numberOfChildren:l,on:d,"data-is-collapsed":u},c),t)};l.Icon=t.MobileBottomNavigationIcon,exports.MobileBottomNavigation=l;
2	+ //# sourceMappingURL=index.js.map

package/build/components/molecules/mobileBottomNavigation/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/mobileBottomNavigation/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport { StyledMobileBottomNavigation } from './index.styled'\nimport { MobileBottomNavigationIcon } from './MobileBottomNavigationIcon'\n\nexport type MobileBottomNavigationProps = {\n children: React.ReactNode\n numberOfChildren: number\n on?: string\n isCollapsed?: boolean\n} & React.HTMLAttributes<HTMLDivElement>\n\nconst MobileBottomNavigationWrapper: React.FC<MobileBottomNavigationProps> = ({\n children,\n numberOfChildren = 5,\n on = '',\n isCollapsed = false,\n ...rest\n}) => {\n return (\n <StyledMobileBottomNavigation\n numberOfChildren={numberOfChildren}\n on={on}\n data-is-collapsed={isCollapsed}\n {...rest}\n >\n {children}\n </StyledMobileBottomNavigation>\n )\n}\n\nexport interface CompoundedComponent\n extends React.ForwardRefExoticComponent<MobileBottomNavigationProps> {\n Icon: typeof MobileBottomNavigationIcon\n}\n\nconst MobileBottomNavigation =\n MobileBottomNavigationWrapper as CompoundedComponent\n\nMobileBottomNavigation.Icon = MobileBottomNavigationIcon\nexport { MobileBottomNavigation }\n"],"names":["MobileBottomNavigation","_a","children","_b","numberOfChildren","_c","on","_d","isCollapsed","rest","__rest","React","createElement","StyledMobileBottomNavigation","Icon","MobileBottomNavigationIcon"],"mappings":"gTAoCMA,EAxBuE,SAACC,GAC5E,IAAAC,EAAQD,EAAAC,SACRC,EAAoBF,EAAAG,iBAApBA,OAAgB,IAAAD,EAAG,EAACA,EACpBE,EAAAJ,EAAAK,GAAAA,OAAK,IAAAD,EAAA,GAAEA,EACPE,EAAmBN,EAAAO,YAAnBA,OAAW,IAAAD,GAAQA,EAChBE,EALyEC,EAAAA,OAAAT,EAAA,CAAA,WAAA,mBAAA,KAAA,gBAO5E,OACEU,EAAAA,QAACC,cAAAC,EAAAA,yCACCT,iBAAkBA,EAClBE,GAAIA,EAAE,oBACaE,GACfC,GAEHP,IAaPF,EAAuBc,KAAOC,EAA0BA"}

package/build/components/molecules/mobileBottomNavigation/index.styled.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js"),e=require("styled-components"),t=require("../../../misc/theme.js");function i(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var o,a,r,l,s,d,p,c=i(e),m=e.keyframes(o\|\|(o=n.__makeTemplateObject(["\n from {\n transform: translateY(100%);\n visibility: visible;\n }\n\n to {\n transform: translateY(0);\n }\n"],["\n from {\n transform: translateY(100%);\n visibility: visible;\n }\n\n to {\n transform: translateY(0);\n }\n"]))),x=e.keyframes(a\|\|(a=n.__makeTemplateObject(["\n from {\n transform: translate(0, 0);\n }\n\n to {\n visibility: hidden;\n transform: translate(0, 100%);\n }\n"],["\n from {\n transform: translate(0, 0);\n }\n\n to {\n visibility: hidden;\n transform: translate(0, 100%);\n }\n"]))),f=c.default.div(r\|\|(r=n.__makeTemplateObject(["\n cursor: pointer;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-items: center;\n gap: 4px;\n\n .mobile-navigation-label {\n font-weight: 500;\n font-size: 10px;\n line-height: 16px;\n color: ",";\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 70px;\n }\n\n .mobile-navigation-icon {\n position: relative;\n height: 24px;\n &[data-no-label='true'] {\n border-radius: 50%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n padding: 0px;\n gap: 16px;\n width: 40px;\n height: 40px;\n transition: background-color 200ms ease-in;\n &:hover {\n background-color: ",";\n }\n }\n }\n\n &[data-is-special='true'] {\n .mobile-navigation-icon {\n height: 32px;\n }\n }\n\n &[data-is-active='true'] {\n .mobile-navigation-label {\n color: ",";\n }\n }\n\n &[data-is-disabled='true'] {\n opacity: 0.2;\n }\n"],["\n cursor: pointer;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-items: center;\n gap: 4px;\n\n .mobile-navigation-label {\n font-weight: 500;\n font-size: 10px;\n line-height: 16px;\n color: ",";\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 70px;\n }\n\n .mobile-navigation-icon {\n position: relative;\n height: 24px;\n &[data-no-label='true'] {\n border-radius: 50%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n padding: 0px;\n gap: 16px;\n width: 40px;\n height: 40px;\n transition: background-color 200ms ease-in;\n &:hover {\n background-color: ",";\n }\n }\n }\n\n &[data-is-special='true'] {\n .mobile-navigation-icon {\n height: 32px;\n }\n }\n\n &[data-is-active='true'] {\n .mobile-navigation-label {\n color: ",";\n }\n }\n\n &[data-is-disabled='true'] {\n opacity: 0.2;\n }\n"])),t.theme.colors.gray600,t.theme.colors.blue50,t.theme.colors.primaryBase),g=c.default.div(l\|\|(l=n.__makeTemplateObject(["\n z-index: 100;\n position: fixed;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n max-height: 64px;\n min-height: 64px;\n display: grid;\n grid-template-columns: repeat(",", 1fr);\n grid-template-rows: 1fr;\n grid-column-gap: 0px;\n grid-row-gap: 0px;\n align-items: flex-end;\n padding-bottom: 8px;\n padding-top: 4px;\n\n background-color: ",";\n border: 1px solid ",";\n a {\n text-decoration: none;\n }\n &[data-is-collapsed='true'] {\n animation: "," 500ms ease-in-out forwards;\n }\n\n &[data-is-collapsed='false'] {\n animation: "," 500ms ease-in-out forwards;\n }\n"],["\n z-index: 100;\n position: fixed;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n max-height: 64px;\n min-height: 64px;\n display: grid;\n grid-template-columns: repeat(",", 1fr);\n grid-template-rows: 1fr;\n grid-column-gap: 0px;\n grid-row-gap: 0px;\n align-items: flex-end;\n padding-bottom: 8px;\n padding-top: 4px;\n\n background-color: ",";\n border: 1px solid ",";\n a {\n text-decoration: none;\n }\n &[data-is-collapsed='true'] {\n animation: "," 500ms ease-in-out forwards;\n }\n\n &[data-is-collapsed='false'] {\n animation: "," 500ms ease-in-out forwards;\n }\n"])),(function(n){return n.numberOfChildren}),t.theme.colors.white,t.theme.colors.neutral100,x,m),u=c.default.span(s\|\|(s=n.__makeTemplateObject(["\n position: absolute;\n left: 100%;\n transform: translate(-10px, calc(-50% + 3px));\n background-color: ",";\n border-radius: 32px;\n border: 2px solid ",";\n padding: 1px 4px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n height: 20px;\n aspect-ratio: 1;\n &[data-no-label='true'] {\n left: 0;\n transform: translate(22px, -50%);\n }\n"],["\n position: absolute;\n left: 100%;\n transform: translate(-10px, calc(-50% + 3px));\n background-color: ",";\n border-radius: 32px;\n border: 2px solid ",";\n padding: 1px 4px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n height: 20px;\n aspect-ratio: 1;\n &[data-no-label='true'] {\n left: 0;\n transform: translate(22px, -50%);\n }\n"])),t.theme.colors.green800,t.theme.colors.white);c.default.div(d\|\|(d=n.__makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n height: 3px;\n background-color: ",";\n transition: width 150ms linear;\n"],["\n position: absolute;\n top: 0;\n left: 0;\n height: 3px;\n background-color: ",";\n transition: width 150ms linear;\n"])),t.theme.colors.primaryBase),c.default.div(p\|\|(p=n.__makeTemplateObject(["\n a {\n text-decoration: none;\n }\n"],["\n a {\n text-decoration: none;\n }\n"]))),exports.StyledBadge=u,exports.StyledMobileBottomNavigation=g,exports.StyledMobileBottomNavigationIcon=f,exports.slideOutDown=x;
2	+ //# sourceMappingURL=index.styled.js.map

package/build/components/molecules/mobileBottomNavigation/index.styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.styled.js","sources":["../../../../src/components/molecules/mobileBottomNavigation/index.styled.tsx"],"sourcesContent":["import styled, { keyframes } from 'styled-components'\n\nimport { theme } from '../../../misc/theme'\n\nconst slideInUp = keyframes`\n from {\n transform: translateY(100%);\n visibility: visible;\n }\n\n to {\n transform: translateY(0);\n }\n`\n\nexport const slideOutDown = keyframes`\n from {\n transform: translate(0, 0);\n }\n\n to {\n visibility: hidden;\n transform: translate(0, 100%);\n }\n`\nexport const StyledMobileBottomNavigationIcon = styled.div`\n cursor: pointer;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-items: center;\n gap: 4px;\n\n .mobile-navigation-label {\n font-weight: 500;\n font-size: 10px;\n line-height: 16px;\n color: ${theme.colors.gray600};\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 70px;\n }\n\n .mobile-navigation-icon {\n position: relative;\n height: 24px;\n &[data-no-label='true'] {\n border-radius: 50%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n padding: 0px;\n gap: 16px;\n width: 40px;\n height: 40px;\n transition: background-color 200ms ease-in;\n &:hover {\n background-color: ${theme.colors.blue50};\n }\n }\n }\n\n &[data-is-special='true'] {\n .mobile-navigation-icon {\n height: 32px;\n }\n }\n\n &[data-is-active='true'] {\n .mobile-navigation-label {\n color: ${theme.colors.primaryBase};\n }\n }\n\n &[data-is-disabled='true'] {\n opacity: 0.2;\n }\n`\n\nexport const StyledMobileBottomNavigation = styled.div<{\n numberOfChildren: number\n on?: string\n}>`\n z-index: 100;\n position: fixed;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 100%;\n max-height: 64px;\n min-height: 64px;\n display: grid;\n grid-template-columns: repeat(${(props) => props.numberOfChildren}, 1fr);\n grid-template-rows: 1fr;\n grid-column-gap: 0px;\n grid-row-gap: 0px;\n align-items: flex-end;\n padding-bottom: 8px;\n padding-top: 4px;\n\n background-color: ${theme.colors.white};\n border: 1px solid ${theme.colors.neutral100};\n a {\n text-decoration: none;\n }\n &[data-is-collapsed='true'] {\n animation: ${slideOutDown} 500ms ease-in-out forwards;\n }\n\n &[data-is-collapsed='false'] {\n animation: ${slideInUp} 500ms ease-in-out forwards;\n }\n`\n\nexport const StyledBadge = styled.span`\n position: absolute;\n left: 100%;\n transform: translate(-10px, calc(-50% + 3px));\n background-color: ${theme.colors.green800};\n border-radius: 32px;\n border: 2px solid ${theme.colors.white};\n padding: 1px 4px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n height: 20px;\n aspect-ratio: 1;\n &[data-no-label='true'] {\n left: 0;\n transform: translate(22px, -50%);\n }\n`\n\nexport const StyledMobileBottomArticleNavigationProgress = styled.div`\n position: absolute;\n top: 0;\n left: 0;\n height: 3px;\n background-color: ${theme.colors.primaryBase};\n transition: width 150ms linear;\n`\n\nexport const StyledMobileHorizonNavigation = styled.div`\n a {\n text-decoration: none;\n }\n`\n"],"names":["slideInUp","keyframes","templateObject_1","__makeTemplateObject","slideOutDown","templateObject_2","StyledMobileBottomNavigationIcon","styled","div","templateObject_3","theme","colors","gray600","blue50","primaryBase","StyledMobileBottomNavigation","props","numberOfChildren","white","neutral100","StyledBadge","span","templateObject_5","green800","templateObject_6","templateObject_7"],"mappings":"kSAIMA,EAAYC,EAASA,UAAAC,IAAAA,EAAAC,EAAAA,qBAAA,CAAA,+HAAA,CAAA,kIAWdC,EAAeH,EAAAA,UAASI,IAAAA,EAAAF,EAAAA,qBAAA,CAAA,kIAAA,CAAA,qIAUxBG,EAAmCC,EAAM,QAACC,IAAGC,IAAAA,EAAAN,EAAAA,qBAAA,CAAA,qPAAA,ohBAAA,yMAAA,6EAAA,CAAA,qPAYzB,ohBAsBc,yMAaR,+EAnC1BO,EAAAA,MAAMC,OAAOC,QAsBEF,EAAKA,MAACC,OAAOE,OAa1BH,QAAMC,OAAOG,aASfC,EAA+BR,EAAM,QAACC,gpBAGjD,iMAUiE,oLAQ3B,0BACK,8FAKhB,yFAIH,0CAlBQ,SAACQ,GAAU,OAAAA,EAAMC,mBAQ7BP,EAAAA,MAAMC,OAAOO,MACbR,EAAKA,MAACC,OAAOQ,WAKlBf,EAIAJ,GAIJoB,EAAcb,EAAAA,QAAOc,KAAIC,IAAAA,EAAAnB,EAAAA,qBAAA,CAAA,iHAAA,kDAAA,yPAAA,CAAA,iHAIK,kDAEH,2PAFlBO,EAAAA,MAAMC,OAAOY,SAEbb,EAAAA,MAAMC,OAAOO,OAcwBX,EAAAA,QAAOC,IAAGgB,IAAAA,EAAArB,EAAAA,qBAAA,CAAA,uFAAA,0CAAA,CAAA,uFAKvB,4CAAxBO,EAAAA,MAAMC,OAAOG,aAIUP,EAAAA,QAAOC,IAAGiB,IAAAA,EAAAtB,EAAAA,qBAAA,CAAA,8CAAA,CAAA"}

package/build/components/molecules/modal/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../../../hooks/useScrollbarSize.js"),o=require("react-dom"),d=require("./index.styled.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=a(e),n=function(){document.querySelectorAll('.hhg-modal[data-open="true"]').length<1&&document.body.classList.remove("hhc-modal-show")},c=function(){document.querySelectorAll('.hhg-modal[data-open="true"]').length<1&&(document.body.style.overflow="",document.body.style.paddingRight="",document.body.classList.remove("hhc-disabled-scroll"))};exports.Modal=function(a){var r=a.type,u=void 0===r?"lead":r,i=a.closeIcon,s=a.isOpen,m=void 0===s\|\|s,h=a.onClose,f=a.children,p=a.className,v=void 0===p?"":p,y=a.animationType,g=void 0===y?"slideTop":y,b=a.isStaticBackdrop,E=void 0!==b&&b,_=e.useState(!1),S=_[0],k=_[1],q=e.useRef(null),w=t.useScrollbarSize().width;if(!q.current&&S&&(q.current=document.createElement("div")),e.useEffect((function(){return k(!0),function(){k(!1),n(),c()}}),[]),e.useEffect((function(){if(S){var e=((t=document.getElementById("hhg-modals"))\|\|((t=document.createElement("div")).setAttribute("id","hhg-modals"),document.body.append(t)),t);return e.appendChild(q.current),function(){e.removeChild(q.current)}}var t}),[S]),e.useEffect((function(){m?document.body.classList.add("hhc-modal-show"):n()}),[m]),e.useEffect((function(){m?(document.body.style.overflow="hidden",document.body.style.paddingRight=w+"px",document.body.classList.add("hhc-disabled-scroll")):c()}),[m,w]),!S)return null;var C=["hhg-modal__wrapper",v,g].filter((function(e){return e})).join(" ");return o.createPortal(l.default.createElement(d.StyledModalWrapper,{className:C,"data-open":m,"data-type":u},!E&&l.default.createElement(d.StyledModalMask,{"data-open":m,onClick:h,"data-type":u}),!E&&"video"===u&&!!i&&l.default.createElement("div",{className:"hhg-modal__close",onClick:h},i),l.default.createElement(d.StyledModal,{className:"hhg-modal","data-open":m},l.default.createElement("div",{className:"video"===u?"hhg-modal__video":"hhg-modal__content"},!!i&&"video"!==u&&l.default.createElement("div",{className:"hhg-modal__close",onClick:h},i),f))),q.current)};
2	+ //# sourceMappingURL=index.js.map

package/build/components/molecules/modal/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/modal/index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react'\n\nimport { useScrollbarSize } from 'hooks/useScrollbarSize'\nimport { createPortal } from 'react-dom'\n\nimport {\n StyledModal,\n StyledModalWrapper,\n StyledModalMask,\n} from './index.styled'\n\nexport type Props = {\n type: 'tail' | 'lead' | 'form' | 'confirm' | 'profile' | 'video'\n animationType?: 'slideTop' | 'scaleUp'\n closeIcon?: JSX.Element\n isOpen: boolean\n onClose: () => void\n children?: any\n className?: string\n isStaticBackdrop?: boolean\n}\nconst MODAL_ROOT_ID = 'hhg-modals'\nconst getModalsRoot = () => {\n let el = document.getElementById(MODAL_ROOT_ID)\n\n if (!el) {\n el = document.createElement('div')\n el.setAttribute('id', MODAL_ROOT_ID)\n document.body.append(el)\n }\n\n return el\n}\nconst cleanUpModalShow = () => {\n const selector = '.hhg-modal[data-open=\"true\"]'\n const remainingPopupOpened = document.querySelectorAll(selector)\n // Remove the opening class if there are only 1 popup is shown\n if (remainingPopupOpened.length < 1) {\n document.body.classList.remove('hhc-modal-show')\n }\n}\nconst cleanUpDisabledScroll = () => {\n // Clear the overflow if there are only 1 popup is shown. useEffect runs after so the count number becomes zero\n const selector = '.hhg-modal[data-open=\"true\"]'\n const remainingPopupOpened = document.querySelectorAll(selector)\n if (remainingPopupOpened.length < 1) {\n document.body.style.overflow = ''\n document.body.style.paddingRight = ''\n document.body.classList.remove('hhc-disabled-scroll')\n }\n}\n\nconst Modal = ({\n type = 'lead',\n closeIcon,\n isOpen = true,\n onClose,\n children,\n className = '',\n animationType = 'slideTop',\n isStaticBackdrop = false,\n}: Props) => {\n const [mounted, setMounted] = useState(false)\n const elRef = useRef(null)\n const { width: scrollBarWidth } = useScrollbarSize()\n\n if (!elRef.current && mounted) {\n elRef.current = document.createElement('div')\n }\n\n useEffect(() => {\n setMounted(true)\n return () => {\n setMounted(false)\n cleanUpModalShow()\n cleanUpDisabledScroll()\n }\n }, [])\n\n useEffect(() => {\n if (mounted) {\n const modalsRoot = getModalsRoot()\n modalsRoot.appendChild(elRef.current)\n return () => {\n modalsRoot.removeChild(elRef.current)\n }\n }\n }, [mounted])\n\n useEffect(() => {\n if (isOpen) {\n document.body.classList.add('hhc-modal-show')\n } else {\n cleanUpModalShow()\n }\n }, [isOpen])\n\n useEffect(() => {\n if (isOpen) {\n document.body.style.overflow = 'hidden'\n document.body.style.paddingRight = scrollBarWidth + 'px'\n document.body.classList.add('hhc-disabled-scroll')\n } else {\n cleanUpDisabledScroll()\n }\n }, [isOpen, scrollBarWidth])\n\n if (!mounted) return null\n\n const classes = ['hhg-modal__wrapper', className, animationType]\n .filter((s) => s)\n .join(' ')\n\n return createPortal(\n <StyledModalWrapper className={classes} data-open={isOpen} data-type={type}>\n {!isStaticBackdrop && (\n <StyledModalMask\n data-open={isOpen}\n onClick={onClose}\n data-type={type}\n />\n )}\n {!isStaticBackdrop && type === 'video' && !!closeIcon && (\n <div className=\"hhg-modal__close\" onClick={onClose}>\n {closeIcon}\n </div>\n )}\n <StyledModal className=\"hhg-modal\" data-open={isOpen}>\n <div\n className={\n type === 'video' ? 'hhg-modal__video' : 'hhg-modal__content'\n }\n >\n {!!closeIcon && type !== 'video' && (\n <div className=\"hhg-modal__close\" onClick={onClose}>\n {closeIcon}\n </div>\n )}\n {children}\n </div>\n </StyledModal>\n </StyledModalWrapper>,\n elRef.current,\n )\n}\n\nexport { Modal }\n"],"names":["cleanUpModalShow","document","querySelectorAll","length","body","classList","remove","cleanUpDisabledScroll","style","overflow","paddingRight","_a","_b","type","closeIcon","_c","isOpen","onClose","children","_d","className","_e","animationType","_f","isStaticBackdrop","_g","useState","mounted","setMounted","elRef","useRef","scrollBarWidth","useScrollbarSize","current","createElement","useEffect","modalsRoot_1","el","getElementById","setAttribute","append","appendChild","removeChild","add","classes","filter","s","join","createPortal","React","StyledModalWrapper","StyledModalMask","onClick","StyledModal"],"mappings":"oRAiCMA,EAAmB,WAEMC,SAASC,iBADrB,gCAGQC,OAAS,GAChCF,SAASG,KAAKC,UAAUC,OAAO,mBAG7BC,EAAwB,WAGCN,SAASC,iBADrB,gCAEQC,OAAS,IAChCF,SAASG,KAAKI,MAAMC,SAAW,GAC/BR,SAASG,KAAKI,MAAME,aAAe,GACnCT,SAASG,KAAKC,UAAUC,OAAO,uCAIrB,SAACK,GACb,IAAAC,EAAAD,EAAAE,KAAAA,OAAI,IAAAD,EAAG,OAAMA,EACbE,EAASH,EAAAG,UACTC,EAAaJ,EAAAK,OAAbA,OAAS,IAAAD,KACTE,YACAC,EAAQP,EAAAO,SACRC,cAAAC,aAAY,GAAED,EACdE,EAA0BV,EAAAW,cAA1BA,OAAgB,IAAAD,EAAA,aAChBE,EAAAZ,EAAAa,iBAAAA,OAAgB,IAAAD,GAAQA,EAElBE,EAAwBC,EAAAA,UAAS,GAAhCC,EAAOF,EAAA,GAAEG,EAAUH,EAAA,GACpBI,EAAQC,SAAO,MACNC,EAAmBC,2BA2ClC,IAzCKH,EAAMI,SAAWN,IACpBE,EAAMI,QAAUhC,SAASiC,cAAc,QAGzCC,EAAAA,WAAU,WAER,OADAP,GAAW,GACJ,WACLA,GAAW,GACX5B,IACAO,OAED,IAEH4B,EAAAA,WAAU,WACR,GAAIR,EAAS,CACX,IAAMS,IA1DNC,EAAKpC,SAASqC,eAFE,kBAKlBD,EAAKpC,SAASiC,cAAc,QACzBK,aAAa,KANE,cAOlBtC,SAASG,KAAKoC,OAAOH,IAGhBA,GAoDH,OADAD,EAAWK,YAAYZ,EAAMI,SACtB,WACLG,EAAWM,YAAYb,EAAMI,UA9Df,IAChBI,IAgED,CAACV,IAEJQ,EAAAA,WAAU,WACJnB,EACFf,SAASG,KAAKC,UAAUsC,IAAI,kBAE5B3C,MAED,CAACgB,IAEJmB,EAAAA,WAAU,WACJnB,GACFf,SAASG,KAAKI,MAAMC,SAAW,SAC/BR,SAASG,KAAKI,MAAME,aAAeqB,EAAiB,KACpD9B,SAASG,KAAKC,UAAUsC,IAAI,wBAE5BpC,MAED,CAACS,EAAQe,KAEPJ,EAAS,OAAO,KAErB,IAAMiB,EAAU,CAAC,qBAAsBxB,EAAWE,GAC/CuB,QAAO,SAACC,GAAM,OAAAA,KACdC,KAAK,KAER,OAAOC,eACLC,EAAAA,QAAAf,cAACgB,qBAAkB,CAAC9B,UAAWwB,EAAO,YAAa5B,EAAM,YAAaH,IAClEW,GACAyB,EAAAA,QAAAf,cAACiB,EAAeA,gBACH,CAAA,YAAAnC,EACXoC,QAASnC,EACE,YAAAJ,KAGbW,GAA6B,UAATX,KAAsBC,GAC1CmC,EAAAA,6BAAK7B,UAAU,mBAAmBgC,QAASnC,GACxCH,GAGLmC,EAAA,QAAAf,cAACmB,cAAY,CAAAjC,UAAU,wBAAuBJ,GAC5CiC,UAAAf,cAAA,MAAA,CACEd,UACW,UAATP,EAAmB,mBAAqB,wBAGvCC,GAAsB,UAATD,GACdoC,EAAAA,QAAAf,cAAA,MAAA,CAAKd,UAAU,mBAAmBgC,QAASnC,GACxCH,GAGJI,KAIPW,EAAMI"}

package/build/components/molecules/modal/index.styled.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js"),e=require("../../../misc/utils.js");function t(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var i,o,a,d=t(require("styled-components")),r=d.default.div(i\|\|(i=n.__makeTemplateObject(["\n position: relative;\n z-index: 200;\n background-color: ",";\n border-radius: 6px;\n box-shadow: 0px 4px 8px ",";\n\n .hhg-modal__content {\n position: relative;\n z-index: 111;\n height: 100%;\n padding: 16px;\n }\n .hhg-modal__video {\n position: relative;\n z-index: 111;\n height: 100%;\n background-color: none;\n box-shadow: none;\n }\n"],["\n position: relative;\n z-index: 200;\n background-color: ",";\n border-radius: 6px;\n box-shadow: 0px 4px 8px ",";\n\n .hhg-modal__content {\n position: relative;\n z-index: 111;\n height: 100%;\n padding: 16px;\n }\n .hhg-modal__video {\n position: relative;\n z-index: 111;\n height: 100%;\n background-color: none;\n box-shadow: none;\n }\n"])),(function(n){return n.theme.colors.white}),(function(n){return n.theme.colors.gray200})),l=d.default.div(o\|\|(o=n.__makeTemplateObject(["\n position: fixed;\n top: 0;\n left: 0;\n z-index: 201;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n outline: 0;\n visibility: hidden;\n background-color: rgba(38, 38, 38, 0.3);\n\n .hhg-modal__close {\n position: absolute;\n top: 16px;\n right: 16px;\n cursor: pointer;\n img {\n width: 100%;\n height: 100%;\n border-radius: 50%;\n }\n }\n &[data-type='video'] {\n z-index: 1001;\n }\n &[data-open='true'] {\n visibility: visible;\n }\n\n &.slideTop {\n "," {\n transform: translate(0, -100vh);\n transition: all 0.5s ease;\n }\n\n &[data-open='true'] {\n "," {\n transform: translate(0);\n }\n }\n }\n\n &.scaleUp {\n "," {\n transform: scale(0.9);\n }\n\n &[data-open='true'] {\n "," {\n transition: all 0.3s ease-out;\n transform: scale(1);\n }\n }\n }\n\n &[data-type='tail'] {\n justify-content: flex-end;\n "," {\n width: 420px;\n height: 100%;\n border-radius: 0;\n overflow: hidden auto;\n }\n }\n &[data-type='form'] {\n "," {\n width: 496px;\n height: 548px;\n max-height: 100%;\n overflow-y: auto;\n "," {\n width: 340px;\n }\n }\n }\n &[data-type='video'] {\n "," {\n height: 100%;\n max-height: 539px;\n "," {\n height: 192px;\n width: 100%;\n height: 100%;\n border-radius: 6px;\n max-height: 192px;\n }\n }\n }\n &[data-type='confirm'] {\n "," {\n width: 100%;\n max-width: 407px;\n "," {\n width: calc(100% - 32px);\n max-width: calc(100% - 32px);\n }\n }\n }\n"],["\n position: fixed;\n top: 0;\n left: 0;\n z-index: 201;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n outline: 0;\n visibility: hidden;\n background-color: rgba(38, 38, 38, 0.3);\n\n .hhg-modal__close {\n position: absolute;\n top: 16px;\n right: 16px;\n cursor: pointer;\n img {\n width: 100%;\n height: 100%;\n border-radius: 50%;\n }\n }\n &[data-type='video'] {\n z-index: 1001;\n }\n &[data-open='true'] {\n visibility: visible;\n }\n\n &.slideTop {\n "," {\n transform: translate(0, -100vh);\n transition: all 0.5s ease;\n }\n\n &[data-open='true'] {\n "," {\n transform: translate(0);\n }\n }\n }\n\n &.scaleUp {\n "," {\n transform: scale(0.9);\n }\n\n &[data-open='true'] {\n "," {\n transition: all 0.3s ease-out;\n transform: scale(1);\n }\n }\n }\n\n &[data-type='tail'] {\n justify-content: flex-end;\n "," {\n width: 420px;\n height: 100%;\n border-radius: 0;\n overflow: hidden auto;\n }\n }\n &[data-type='form'] {\n "," {\n width: 496px;\n height: 548px;\n max-height: 100%;\n overflow-y: auto;\n "," {\n width: 340px;\n }\n }\n }\n &[data-type='video'] {\n "," {\n height: 100%;\n max-height: 539px;\n "," {\n height: 192px;\n width: 100%;\n height: 100%;\n border-radius: 6px;\n max-height: 192px;\n }\n }\n }\n &[data-type='confirm'] {\n "," {\n width: 100%;\n max-width: 407px;\n "," {\n width: calc(100% - 32px);\n max-width: calc(100% - 32px);\n }\n }\n }\n"])),r,r,r,r,r,r,e.MediaQueries.mbDown,r,e.MediaQueries.mbDown,r,e.MediaQueries.mbDown),s=d.default.div(a\|\|(a=n.__makeTemplateObject(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n height: 100vh;\n align-items: center;\n\n &[data-open='false'] {\n display: none;\n }\n &[data-type='video'] {\n background-color: ",";\n }\n"],["\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n height: 100vh;\n align-items: center;\n\n &[data-open='false'] {\n display: none;\n }\n &[data-type='video'] {\n background-color: ",";\n }\n"])),(function(n){return n.theme.colors.secondaryDark}));exports.StyledModal=r,exports.StyledModalMask=s,exports.StyledModalWrapper=l;
2	+ //# sourceMappingURL=index.styled.js.map

package/build/components/molecules/modal/index.styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.styled.js","sources":["../../../../src/components/molecules/modal/index.styled.tsx"],"sourcesContent":["import { ThemeProps } from 'misc/theme'\nimport { MediaQueries } from 'misc/utils'\nimport styled from 'styled-components'\n\nexport const StyledModal = styled.div`\n position: relative;\n z-index: 200;\n background-color: ${(props: ThemeProps) => props.theme.colors.white};\n border-radius: 6px;\n box-shadow: 0px 4px 8px ${(props: ThemeProps) => props.theme.colors.gray200};\n\n .hhg-modal__content {\n position: relative;\n z-index: 111;\n height: 100%;\n padding: 16px;\n }\n .hhg-modal__video {\n position: relative;\n z-index: 111;\n height: 100%;\n background-color: none;\n box-shadow: none;\n }\n`\nexport const StyledModalWrapper = styled.div`\n position: fixed;\n top: 0;\n left: 0;\n z-index: 201;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n overflow-x: hidden;\n overflow-y: auto;\n outline: 0;\n visibility: hidden;\n background-color: rgba(38, 38, 38, 0.3);\n\n .hhg-modal__close {\n position: absolute;\n top: 16px;\n right: 16px;\n cursor: pointer;\n img {\n width: 100%;\n height: 100%;\n border-radius: 50%;\n }\n }\n &[data-type='video'] {\n z-index: 1001;\n }\n &[data-open='true'] {\n visibility: visible;\n }\n\n &.slideTop {\n ${StyledModal} {\n transform: translate(0, -100vh);\n transition: all 0.5s ease;\n }\n\n &[data-open='true'] {\n ${StyledModal} {\n transform: translate(0);\n }\n }\n }\n\n &.scaleUp {\n ${StyledModal} {\n transform: scale(0.9);\n }\n\n &[data-open='true'] {\n ${StyledModal} {\n transition: all 0.3s ease-out;\n transform: scale(1);\n }\n }\n }\n\n &[data-type='tail'] {\n justify-content: flex-end;\n ${StyledModal} {\n width: 420px;\n height: 100%;\n border-radius: 0;\n overflow: hidden auto;\n }\n }\n &[data-type='form'] {\n ${StyledModal} {\n width: 496px;\n height: 548px;\n max-height: 100%;\n overflow-y: auto;\n ${MediaQueries.mbDown} {\n width: 340px;\n }\n }\n }\n &[data-type='video'] {\n ${StyledModal} {\n height: 100%;\n max-height: 539px;\n ${MediaQueries.mbDown} {\n height: 192px;\n width: 100%;\n height: 100%;\n border-radius: 6px;\n max-height: 192px;\n }\n }\n }\n &[data-type='confirm'] {\n ${StyledModal} {\n width: 100%;\n max-width: 407px;\n ${MediaQueries.mbDown} {\n width: calc(100% - 32px);\n max-width: calc(100% - 32px);\n }\n }\n }\n`\n\nexport const StyledModalMask = styled.div`\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n height: 100vh;\n align-items: center;\n\n &[data-open='false'] {\n display: none;\n }\n &[data-type='video'] {\n background-color: ${(props: ThemeProps) =>\n props.theme.colors.secondaryDark};\n }\n`\n"],"names":["StyledModal","styled","div","templateObject_1","__makeTemplateObject","props","theme","colors","white","gray200","StyledModalWrapper","templateObject_2","MediaQueries","mbDown","StyledModalMask","templateObject_3","secondaryDark"],"mappings":"sRAIaA,EAAcC,EAAAA,QAAOC,IAAGC,IAAAA,EAAAC,EAAAA,qBAAA,CAAA,iEAAA,uDAAA,yQAAA,CAAA,iEAGgC,uDAEQ,4QAFvD,SAACC,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SAEpC,SAACH,GAAsB,OAAAA,EAAMC,MAAMC,OAAOE,WAgBzDC,EAAqBT,EAAM,QAACC,IAAGS,IAAAA,EAAAP,uBAAA,CAAA,4mBAAA,2HAAA,mFAAA,+EAAA,iKAAA,iJAAA,0GAAA,iFAAA,4DAAA,0LAAA,0DAAA,uGAAA,CAAA,4mBAmC3B,2HAME,mFAOF,+EAKE,iKASF,iJAQA,0GAKU,iFAMV,4DAGU,0LAUV,0DAGU,yGA9DrBJ,EAMEA,EAOFA,EAKEA,EASFA,EAQAA,EAKEY,EAAAA,aAAaC,OAMfb,EAGEY,EAAAA,aAAaC,OAUfb,EAGEY,EAAAA,aAAaC,QAQRC,EAAkBb,EAAM,QAACC,IAAGa,IAAAA,EAAAX,EAAAA,qBAAA,CAAA,gNAAA,YAAA,CAAA,gNAaH,eADd,SAACC,GACnB,OAAAA,EAAMC,MAAMC,OAAOS"}

package/build/components/molecules/popup/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("./index.styled.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=a(e);exports.Popup=function(e){var a=e.type,l=void 0===a?"lead":a,o=e.closeIcon,d=e.isOpen,r=void 0===d\|\|d,c=e.onClose,u=e.children,i=e.className,p=void 0===i?"":i,s=e.enableAnimation,f=void 0===s\|\|s;return n.default.createElement(n.default.Fragment,null,n.default.createElement(t.StyledPopup,{"data-open":r,"data-type":l,"data-animation":f},n.default.createElement("div",{className:"".concat(p\|\|""," popup-content")},!!o&&n.default.createElement("div",{className:"close-button",onClick:c},o),u)),n.default.createElement(t.StyledPopupWrapper,{"data-open":r,onClick:c}))};
2	+ //# sourceMappingURL=index.js.map

package/build/components/molecules/popup/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/popup/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport { StyledPopup, StyledPopupWrapper } from './index.styled'\n\nexport type Props = {\n type: 'lead' | 'form' | 'confirm' | 'profile'\n closeIcon?: JSX.Element\n isOpen: boolean\n onClose: () => void\n children?: any\n className?: string\n enableAnimation?: boolean\n}\n\nconst Popup = ({\n type = 'lead',\n closeIcon,\n isOpen = true,\n onClose,\n children,\n className = '',\n enableAnimation = true,\n}: Props) => {\n return (\n <>\n <StyledPopup\n data-open={isOpen}\n data-type={type}\n data-animation={enableAnimation}\n >\n <div className={`${className || ''} popup-content`}>\n {!!closeIcon && (\n <div className=\"close-button\" onClick={onClose}>\n {closeIcon}\n </div>\n )}\n {children}\n </div>\n </StyledPopup>\n <StyledPopupWrapper data-open={isOpen} onClick={onClose} />\n </>\n )\n}\n\nexport { Popup }\n"],"names":["_a","_b","type","closeIcon","_c","isOpen","onClose","children","_d","className","_e","enableAnimation","React","createElement","Fragment","StyledPopup","concat","onClick","StyledPopupWrapper"],"mappings":"2NAcc,SAACA,GACb,IAAAC,EAAAD,EAAAE,KAAAA,OAAO,IAAAD,EAAA,SACPE,EAASH,EAAAG,UACTC,WAAAC,OAAS,IAAAD,KACTE,EAAON,EAAAM,QACPC,EAAQP,EAAAO,SACRC,EAAAR,EAAAS,UAAAA,OAAS,IAAAD,EAAG,GAAEA,EACdE,EAAsBV,EAAAW,gBAAtBA,OAAe,IAAAD,GAAOA,EAEtB,OACEE,UAAAC,cAAAD,EAAA,QAAAE,SAAA,KACEF,UAAAC,cAACE,EAAWA,YACC,CAAA,YAAAV,EACA,YAAAH,mBACKS,GAEhBC,UAAAC,cAAA,MAAA,CAAKJ,UAAW,GAAAO,OAAGP,GAAa,GAAkB,qBAC7CN,GACDS,+BAAKH,UAAU,eAAeQ,QAASX,GACpCH,GAGJI,IAGLK,UAACC,cAAAK,EAAAA,mBAA8B,CAAA,YAAAb,EAAQY,QAASX"}

package/build/components/molecules/popup/index.styled.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js"),t=require("../../../misc/utils.js");function e(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var i,o,p=e(require("styled-components")),a=p.default.div(i\|\|(i=n.__makeTemplateObject(["\n position: fixed;\n left: 50%;\n\n padding: 0 16px 32px;\n background-color: ",";\n border-radius: 6px;\n box-shadow: 0px 4px 8px ",";\n transform: translate(-50%, -50%);\n transition: all 0.5s ease-in-out;\n visibility: hidden;\n\n &[data-open='true'] {\n z-index: 200;\n top: 50%;\n opacity: 1;\n visibility: visible;\n }\n\n &[data-open='false'] {\n top: -50%;\n }\n\n &[data-type='lead'] {\n width: 332px;\n height: 460px;\n\n div {\n top: -15px;\n right: -15px;\n }\n }\n\n &[data-type='form'] {\n width: 496px;\n height: 548px;\n "," {\n width: 340px;\n }\n }\n\n &[data-type='confirm'] {\n "," {\n width: calc(100% - 32px);\n }\n "," {\n width: 100%;\n max-width: 407px;\n }\n }\n\n .popup-content {\n position: relative;\n z-index: 111;\n height: 100%;\n padding: 16px;\n }\n\n .close-button {\n position: absolute;\n top: 16px;\n right: 0;\n cursor: pointer;\n\n img {\n width: 100%;\n height: 100%;\n border-radius: 50%;\n }\n }\n"],["\n position: fixed;\n left: 50%;\n\n padding: 0 16px 32px;\n background-color: ",";\n border-radius: 6px;\n box-shadow: 0px 4px 8px ",";\n transform: translate(-50%, -50%);\n transition: all 0.5s ease-in-out;\n visibility: hidden;\n\n &[data-open='true'] {\n z-index: 200;\n top: 50%;\n opacity: 1;\n visibility: visible;\n }\n\n &[data-open='false'] {\n top: -50%;\n }\n\n &[data-type='lead'] {\n width: 332px;\n height: 460px;\n\n div {\n top: -15px;\n right: -15px;\n }\n }\n\n &[data-type='form'] {\n width: 496px;\n height: 548px;\n "," {\n width: 340px;\n }\n }\n\n &[data-type='confirm'] {\n "," {\n width: calc(100% - 32px);\n }\n "," {\n width: 100%;\n max-width: 407px;\n }\n }\n\n .popup-content {\n position: relative;\n z-index: 111;\n height: 100%;\n padding: 16px;\n }\n\n .close-button {\n position: absolute;\n top: 16px;\n right: 0;\n cursor: pointer;\n\n img {\n width: 100%;\n height: 100%;\n border-radius: 50%;\n }\n }\n"])),(function(n){return n.theme.colors.white}),(function(n){return n.theme.colors.gray200}),t.MediaQueries.mbDown,t.MediaQueries.mbDown,t.MediaQueries.mbUp),d=p.default.div(o\|\|(o=n.__makeTemplateObject(["\n position: fixed;\n z-index: 110;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n align-items: center;\n background: rgba(38, 38, 38, 0.3);\n\n &[data-open='false'] {\n display: none;\n }\n"],["\n position: fixed;\n z-index: 110;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n align-items: center;\n background: rgba(38, 38, 38, 0.3);\n\n &[data-open='false'] {\n display: none;\n }\n"])));exports.StyledPopup=a,exports.StyledPopupWrapper=d;
2	+ //# sourceMappingURL=index.styled.js.map

package/build/components/molecules/popup/index.styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.styled.js","sources":["../../../../src/components/molecules/popup/index.styled.tsx"],"sourcesContent":["import { ThemeProps } from 'misc/theme'\nimport { MediaQueries } from 'misc/utils'\nimport styled from 'styled-components'\n\nexport const StyledPopup = styled.div`\n position: fixed;\n left: 50%;\n\n padding: 0 16px 32px;\n background-color: ${(props: ThemeProps) => props.theme.colors.white};\n border-radius: 6px;\n box-shadow: 0px 4px 8px ${(props: ThemeProps) => props.theme.colors.gray200};\n transform: translate(-50%, -50%);\n transition: all 0.5s ease-in-out;\n visibility: hidden;\n\n &[data-open='true'] {\n z-index: 200;\n top: 50%;\n opacity: 1;\n visibility: visible;\n }\n\n &[data-open='false'] {\n top: -50%;\n }\n\n &[data-type='lead'] {\n width: 332px;\n height: 460px;\n\n div {\n top: -15px;\n right: -15px;\n }\n }\n\n &[data-type='form'] {\n width: 496px;\n height: 548px;\n ${MediaQueries.mbDown} {\n width: 340px;\n }\n }\n\n &[data-type='confirm'] {\n ${MediaQueries.mbDown} {\n width: calc(100% - 32px);\n }\n ${MediaQueries.mbUp} {\n width: 100%;\n max-width: 407px;\n }\n }\n\n .popup-content {\n position: relative;\n z-index: 111;\n height: 100%;\n padding: 16px;\n }\n\n .close-button {\n position: absolute;\n top: 16px;\n right: 0;\n cursor: pointer;\n\n img {\n width: 100%;\n height: 100%;\n border-radius: 50%;\n }\n }\n`\n\nexport const StyledPopupWrapper = styled.div`\n position: fixed;\n z-index: 110;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n align-items: center;\n background: rgba(38, 38, 38, 0.3);\n\n &[data-open='false'] {\n display: none;\n }\n`\n"],"names":["StyledPopup","styled","div","templateObject_1","__makeTemplateObject","props","theme","colors","white","gray200","MediaQueries","mbDown","mbUp","StyledPopupWrapper","templateObject_2"],"mappings":"oRAIaA,EAAcC,EAAAA,QAAOC,IAAGC,IAAAA,EAAAC,uBAAA,CAAA,sFAAA,uDAAA,8cAAA,0EAAA,mDAAA,+WAAA,CAAA,sFAKgC,uDAEQ,8cA6BpD,0EAMA,mDAGF,kXAxCD,SAACC,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SAEpC,SAACH,GAAsB,OAAAA,EAAMC,MAAMC,OAAOE,UA6BhEC,EAAYA,aAACC,OAMbD,eAAaC,OAGbD,EAAYA,aAACE,MA2BNC,EAAqBZ,EAAM,QAACC,IAAGY,IAAAA,EAAAV,uBAAA,CAAA,sNAAA,CAAA"}

package/build/components/molecules/progressBar/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/tslib/tslib.es6.js"),t=require("react"),a=require("lodash"),r=require("react-id-generator"),l=require("./index.styled.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=n(t);exports.ProgressBar=function(n){var i=n.type,c=n.numberOfStep,u=n.activeStep,o=n.labelPrefix,s=n.detailSteps,f=n.className,m=n.onChange,p=t.useState(0),S=p[0],g=p[1],y=function(t){var a=t.trackClassName,r=e.__rest(t,["trackClassName"]);return d.default.createElement(l.StyledTrackContainer,e.__assign({},r,{className:a}),d.default.createElement(l.StyledTrack,null))},v=d.default.createElement(l.StyledSlider,{className:f+" progress-bar"},d.default.createElement(y,null),d.default.createElement((function(e){var t=e.trackLength,a=e.activeStep,r=e.labelPrefix,n=void 0===r?"Step":r,i=e.onChange;return d.default.createElement(d.default.Fragment,null,Array.from({length:c},(function(e,t){return t})).map((function(e,r){return d.default.createElement(l.StyledStep,{"data-is-active":r===a,"data-label":r,style:{left:rt/(c-1)},onClick:function(){i&&i(r)},key:r},r+1,d.default.createElement(l.StyledStepLabel,{"data-step-passed":r<=a},n+" "+(r+1)))})))}),{trackLength:S,activeStep:u,labelPrefix:o,onChange:m})),h=d.default.createElement("svg",{"data-name":"Layer 1",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 5.5 9.5"},d.default.createElement("title",null,"chevron-right"),d.default.createElement("path",{d:"M.75 8.75l4-4-4-4",fill:"none",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5})),E=d.default.createElement(l.StyledBreadcrumbContainer,null,s&&Array.from({length:s.length},(function(e,t){return t})).map((function(e,t){var a;return d.default.createElement(l.StyledBreadcrumbWrapper,{key:t,"data-selected":t===u,onClick:function(){m&&m(t)}},null===(a=s[t])\|\|void 0===a?void 0:a.text," ",t<s.length-1&&h)}))),k=d.default.createElement(l.StyledSlider,{className:f+" progress-bar"},d.default.createElement((function(e){var t=e.detailSteps,a=e.activeStep,n=e.onChange,i=r.useId(t.length);return d.default.createElement(d.default.Fragment,null,Array.from({length:t.length},(function(e,t){return t})).map((function(e,r){return d.default.createElement(l.StyledDetailStep,{key:i[r],style:{left:100/t.lengthr+"%",width:100/t.length+"%"},onClick:function(){n&&n(r)}},t[r].icon?d.default.createElement(l.StyledDetailStepIndicatorExternal,{onClick:function(){n&&n(r)}},t[r].icon):d.default.createElement(l.StyledDetailStepIndicator,{"data-is-active":r===a,"data-label":e,onClick:function(){n&&n(r)},key:r},r+1),d.default.createElement(l.StyledDetailStepLabel,{"data-step-passed":r<a+1},t[r].text,d.default.createElement(l.StyledDetailStepDescription,null,t[r].description)),r<t.length-1&&d.default.createElement(y,{"data-step-passed":r<a,trackClassName:"progress-track","data-track-type":"detail"}))})))}),{activeStep:u,detailSteps:s,onChange:m})),b=t.useCallback(a.throttle((function(){var e=document.querySelector(".progress-bar");e&&g(e.offsetWidth)}),1e3),[]);return t.useEffect((function(){var e=document.querySelector(".progress-bar");return g(null==e?void 0:e.offsetWidth),window.addEventListener("resize",b),function(){window.removeEventListener("resize",b)}}),[]),"step-track"===i&&v\|\|"breadcrumb"===i&&E\|\|"detail-track"===i&&k};
2	+ //# sourceMappingURL=index.js.map

package/build/components/molecules/progressBar/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/progressBar/index.tsx"],"sourcesContent":["import React, { useState, useEffect, useCallback } from 'react'\n\nimport { throttle } from 'lodash'\nimport { useId } from 'react-id-generator'\n\nimport {\n StyledTrackContainer,\n StyledStep,\n StyledSlider,\n StyledTrack,\n StyledStepLabel,\n StyledBreadcrumbContainer,\n StyledBreadcrumbWrapper,\n StyledDetailStep,\n StyledDetailStepLabel,\n StyledDetailStepIndicator,\n StyledDetailStepIndicatorExternal,\n StyledDetailStepDescription,\n} from './index.styled'\n\nexport type Props = {\n type: 'breadcrumb' | 'step-track' | 'detail-track'\n numberOfStep: number\n activeStep: number\n labelPrefix: string\n detailSteps?: { text: string; icon: JSX.Element; description: string }[]\n onChange?: (s: number) => void\n className?: string\n isMobile?: boolean\n}\n\nconst ProgressBar = ({\n type,\n numberOfStep,\n activeStep,\n labelPrefix,\n detailSteps,\n className,\n onChange,\n}: Props) => {\n const [trackLength, setTrackLength] = useState(0)\n\n const Track = ({ trackClassName, ...props }: { trackClassName?: string }) => {\n return (\n <StyledTrackContainer {...props} className={trackClassName}>\n <StyledTrack></StyledTrack>\n </StyledTrackContainer>\n )\n }\n\n // step track\n\n const Steps = ({\n trackLength,\n activeStep,\n labelPrefix = 'Step',\n onChange,\n }: {\n trackLength: number\n activeStep: number\n labelPrefix?: string\n onChange: (s: number) => void\n }) => {\n return (\n <>\n {Array.from({ length: numberOfStep }, (v, i) => i).map((_, step) => (\n <StyledStep\n data-is-active={step === activeStep}\n data-label={step}\n style={{ left: (step * trackLength) / (numberOfStep - 1) }}\n onClick={() => {\n onChange && onChange(step)\n }}\n key={step}\n >\n {step + 1}\n <StyledStepLabel data-step-passed={step <= activeStep}>\n {labelPrefix + ' ' + (step + 1)}\n </StyledStepLabel>\n </StyledStep>\n ))}\n </>\n )\n }\n\n const stepTrack = (\n <StyledSlider className={className + ' progress-bar'}>\n <Track />\n <Steps\n trackLength={trackLength}\n activeStep={activeStep}\n labelPrefix={labelPrefix}\n onChange={onChange}\n />\n </StyledSlider>\n )\n\n // breadcrumb\n\n const breadcrumbIcon = (\n <svg\n data-name=\"Layer 1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 5.5 9.5\"\n >\n <title>{'chevron-right'}</title>\n <path\n d=\"M.75 8.75l4-4-4-4\"\n fill=\"none\"\n // stroke=\"#000\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={1.5}\n />\n </svg>\n )\n\n const breadcrumb = (\n <StyledBreadcrumbContainer>\n {detailSteps &&\n Array.from({ length: detailSteps.length }, (v, i) => i).map(\n (_, step_index) => (\n <StyledBreadcrumbWrapper\n key={step_index}\n data-selected={step_index === activeStep}\n onClick={() => {\n onChange && onChange(step_index)\n }}\n >\n {detailSteps[step_index]?.text}{' '}\n {step_index < detailSteps.length - 1 && breadcrumbIcon}\n </StyledBreadcrumbWrapper>\n ),\n )}\n </StyledBreadcrumbContainer>\n )\n\n // detail track\n\n const DetailStepsGroup = ({\n detailSteps,\n activeStep,\n onChange,\n }: {\n detailSteps: { text: string; icon: JSX.Element; description: string }[]\n activeStep: number\n onChange: (s: number) => void\n }) => {\n const idList = useId(detailSteps.length)\n return (\n <>\n {Array.from({ length: detailSteps.length }, (v, i) => i).map(\n (step, step_index) => (\n <StyledDetailStep\n key={idList[step_index]}\n style={{\n left: (100 / detailSteps.length) * step_index + '%',\n width: 100 / detailSteps.length + '%',\n }}\n onClick={() => {\n onChange && onChange(step_index)\n }}\n >\n {detailSteps[step_index].icon ? (\n <StyledDetailStepIndicatorExternal\n onClick={() => {\n onChange && onChange(step_index)\n }}\n >\n {detailSteps[step_index].icon}\n </StyledDetailStepIndicatorExternal>\n ) : (\n <StyledDetailStepIndicator\n data-is-active={step_index === activeStep}\n data-label={step}\n onClick={() => {\n onChange && onChange(step_index)\n }}\n key={step_index}\n >\n {step_index + 1}\n </StyledDetailStepIndicator>\n )}\n <StyledDetailStepLabel\n data-step-passed={step_index < activeStep + 1}\n >\n {detailSteps[step_index].text}\n <StyledDetailStepDescription>\n {detailSteps[step_index].description}\n </StyledDetailStepDescription>\n </StyledDetailStepLabel>\n {step_index < detailSteps.length - 1 && (\n <Track\n data-step-passed={step_index < activeStep}\n trackClassName={'progress-track'}\n data-track-type=\"detail\"\n />\n )}\n </StyledDetailStep>\n ),\n )}\n </>\n )\n }\n\n const detailTrack = (\n <StyledSlider className={className + ' progress-bar'}>\n <DetailStepsGroup\n activeStep={activeStep}\n detailSteps={detailSteps}\n onChange={onChange}\n />\n </StyledSlider>\n )\n\n const resizeTrack = useCallback(\n throttle(() => {\n const progressTrack = document.querySelector(\n '.progress-bar',\n ) as HTMLElement\n\n progressTrack && setTrackLength(progressTrack.offsetWidth)\n }, 1000),\n [],\n )\n\n useEffect(() => {\n const track = document.querySelector('.progress-bar') as HTMLElement\n setTrackLength(track?.offsetWidth)\n\n window.addEventListener('resize', resizeTrack)\n\n return () => {\n window.removeEventListener('resize', resizeTrack)\n }\n }, [])\n\n return (\n (type === 'step-track' && stepTrack) ||\n (type === 'breadcrumb' && breadcrumb) ||\n (type === 'detail-track' && detailTrack)\n )\n}\n\nexport { ProgressBar }\n"],"names":["_a","type","numberOfStep","activeStep","labelPrefix","detailSteps","className","onChange","_b","useState","trackLength","setTrackLength","Track","trackClassName","props","__rest","React","StyledTrackContainer","__assign","createElement","StyledTrack","stepTrack","StyledSlider","Fragment","Array","from","length","v","i","map","_","step","StyledStep","style","left","onClick","key","StyledStepLabel","breadcrumbIcon","xmlns","viewBox","d","fill","strokeLinecap","strokeLinejoin","strokeWidth","breadcrumb","StyledBreadcrumbContainer","step_index","StyledBreadcrumbWrapper","text","detailTrack","idList","useId","StyledDetailStep","width","icon","StyledDetailStepIndicatorExternal","StyledDetailStepIndicator","StyledDetailStepLabel","StyledDetailStepDescription","description","resizeTrack","useCallback","throttle","progressTrack","document","querySelector","offsetWidth","useEffect","track","window","addEventListener","removeEventListener"],"mappings":"2UA+BoB,SAACA,GACnB,IAAAC,SACAC,iBACAC,eACAC,EAAWJ,EAAAI,YACXC,EAAWL,EAAAK,YACXC,EAASN,EAAAM,UACTC,EAAQP,EAAAO,SAEFC,EAAgCC,EAAAA,SAAS,GAAxCC,EAAWF,EAAA,GAAEG,EAAcH,EAAA,GAE5BI,EAAQ,SAACZ,GAAE,IAAAa,EAAcb,EAAAa,eAAKC,EAAKC,EAAAA,OAAAf,EAA1B,oBACb,OACEgB,wBAACC,EAAAA,qBAAoBC,EAAAA,SAAA,GAAKJ,EAAO,CAAAR,UAAWO,IAC1CG,EAAAA,QAAAG,cAACC,cAAW,QAwCZC,EACJL,EAAAA,QAACG,cAAAG,EAAYA,cAAChB,UAAWA,EAAY,iBACnCU,UAAAG,cAACP,EAAQ,MACTI,EAAAA,QAACG,eApCS,SAACnB,GACb,IAAAU,EAAWV,EAAAU,YACXP,EAAUH,EAAAG,WACVK,EAAAR,EAAAI,YAAAA,OAAc,IAAAI,EAAA,OAAMA,EACpBD,EAAQP,EAAAO,SAOR,OACES,EAAA,QAAAG,cAAAH,UAAAO,SAAA,KACGC,MAAMC,KAAK,CAAEC,OAAQxB,IAAgB,SAACyB,EAAGC,GAAM,OAAAA,KAAGC,KAAI,SAACC,EAAGC,GAAS,OAClEf,EAAAA,QAACG,cAAAa,EAAUA,WACO,CAAA,iBAAAD,IAAS5B,EACb,aAAA4B,EACZE,MAAO,CAAEC,KAAOH,EAAOrB,GAAgBR,EAAe,IACtDiC,QAAS,WACP5B,GAAYA,EAASwB,IAEvBK,IAAKL,GAEJA,EAAO,EACRf,EAAC,QAAAG,cAAAkB,EAAeA,oCAAmBN,GAAQ5B,GACxCC,EAAc,KAAO2B,EAAO,YAYnCrB,YAAaA,EACbP,WAAYA,EACZC,YAAaA,EACbG,SAAUA,KAOV+B,EACJtB,EAAAA,QAAAG,cAAA,MAAA,CAAA,YACY,UACVoB,MAAM,6BACNC,QAAQ,eAERxB,EAAAA,QAAAG,cAAA,QAAA,KAAQ,iBACRH,EAAA,QAAAG,cAAA,OAAA,CACEsB,EAAE,oBACFC,KAAK,OAELC,cAAc,QACdC,eAAe,QACfC,YAAa,OAKbC,EACJ9B,EAAC,QAAAG,cAAA4B,EAAyBA,+BACvB1C,GACCmB,MAAMC,KAAK,CAAEC,OAAQrB,EAAYqB,SAAU,SAACC,EAAGC,GAAM,OAAAA,KAAGC,KACtD,SAACC,EAAGkB,SAAe,OACjBhC,UAAAG,cAAC8B,EAAuBA,wBAAA,CACtBb,IAAKY,EAAU,gBACAA,IAAe7C,EAC9BgC,QAAS,WACP5B,GAAYA,EAASyC,KAGC,QAAvBhD,EAAAK,EAAY2C,UAAW,IAAAhD,OAAA,IAAEkD,KAAM,IAC/BF,EAAa3C,EAAYqB,OAAS,GAAKY,OA2E9Ca,EACJnC,EAAAA,QAACG,cAAAG,EAAYA,cAAChB,UAAWA,EAAY,iBACnCU,EAAAA,QAAAG,eApEqB,SAACnB,GACxB,IAAAK,gBACAF,EAAUH,EAAAG,WACVI,EAAQP,EAAAO,SAMF6C,EAASC,EAAAA,MAAMhD,EAAYqB,QACjC,OACEV,gDACGQ,MAAMC,KAAK,CAAEC,OAAQrB,EAAYqB,SAAU,SAACC,EAAGC,GAAM,OAAAA,KAAGC,KACvD,SAACE,EAAMiB,GAAe,OACpBhC,EAAAA,sBAACsC,EAAAA,iBAAgB,CACflB,IAAKgB,EAAOJ,GACZf,MAAO,CACLC,KAAO,IAAM7B,EAAYqB,OAAUsB,EAAa,IAChDO,MAAO,IAAMlD,EAAYqB,OAAS,KAEpCS,QAAS,WACP5B,GAAYA,EAASyC,KAGtB3C,EAAY2C,GAAYQ,KACvBxC,EAAAA,QAAAG,cAACsC,EAAiCA,kCAAA,CAChCtB,QAAS,WACP5B,GAAYA,EAASyC,KAGtB3C,EAAY2C,GAAYQ,MAG3BxC,EAAA,QAAAG,cAACuC,EAAyBA,0BAAA,CAAA,iBACRV,IAAe7C,EACnB,aAAA4B,EACZI,QAAS,WACP5B,GAAYA,EAASyC,IAEvBZ,IAAKY,GAEJA,EAAa,GAGlBhC,EAAA,QAAAG,cAACwC,wBACmB,CAAA,mBAAAX,EAAa7C,EAAa,GAE3CE,EAAY2C,GAAYE,KACzBlC,EAAC,QAAAG,cAAAyC,mCACEvD,EAAY2C,GAAYa,cAG5Bb,EAAa3C,EAAYqB,OAAS,GACjCV,EAAC,QAAAG,cAAAP,EACmB,CAAA,mBAAAoC,EAAa7C,EAC/BU,eAAgB,iBACA,kBAAA,kBAa1B,CAAAV,WAAYA,EACZE,YAAaA,EACbE,SAAUA,KAKVuD,EAAcC,cAClBC,EAAAA,UAAS,WACP,IAAMC,EAAgBC,SAASC,cAC7B,iBAGFF,GAAiBtD,EAAesD,EAAcG,eAC7C,KACH,IAcF,OAXAC,EAAAA,WAAU,WACR,IAAMC,EAAQJ,SAASC,cAAc,iBAKrC,OAJAxD,EAAe2D,eAAAA,EAAOF,aAEtBG,OAAOC,iBAAiB,SAAUV,GAE3B,WACLS,OAAOE,oBAAoB,SAAUX,MAEtC,IAGS,eAAT7D,GAAyBoB,GAChB,eAATpB,GAAyB6C,GAChB,iBAAT7C,GAA2BkD"}

package/build/components/molecules/progressBar/index.styled.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js");function e(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var t,r,o,i,a,l,s,c,d,p,u,h,f=e(require("styled-components")),g=f.default.div(t\|\|(t=n.__makeTemplateObject(["\n position: relative;\n width: 100%;\n\n & div[role='slider'] {\n -webkit-text-size-adjust: none;\n -webkit-user-select: none;\n &:focus {\n outline: none;\n }\n }\n"],["\n position: relative;\n width: 100%;\n\n & div[role='slider'] {\n -webkit-text-size-adjust: none;\n -webkit-user-select: none;\n &:focus {\n outline: none;\n }\n }\n"]))),x=f.default.div(r\|\|(r=n.__makeTemplateObject(["\n position: absolute;\n top: 19px;\n width: 24px;\n height: 24px;\n color: ",";\n border: 2px solid ",";\n border-radius: 50%;\n transform: translateY(-50%) translateX(-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n\n background-color: ",";\n color: ",";\n border: 1px solid ",";\n\n &[data-is-active='true'] {\n background-color: ",";\n color: ",";\n border: none;\n }\n"],["\n position: absolute;\n top: 19px;\n width: 24px;\n height: 24px;\n color: ",";\n border: 2px solid ",";\n border-radius: 50%;\n transform: translateY(-50%) translateX(-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n\n background-color: ",";\n color: ",";\n border: 1px solid ",";\n\n &[data-is-active='true'] {\n background-color: ",";\n color: ",";\n border: none;\n }\n"])),(function(n){return n.theme.colors.white}),(function(n){return n.theme.colors.white}),(function(n){return n.theme.colors.white}),(function(n){return n.theme.colors.gray300}),(function(n){return n.theme.colors.gray300}),(function(n){return n.theme.colors.primaryBase}),(function(n){return n.theme.colors.white})),m=f.default.div(o\|\|(o=n.__makeTemplateObject(["\n display: flex;\n width: 100%;\n height: 36px;\n\n &[data-track-type='detail'] {\n margin-top: 0;\n }\n\n &[data-track-type='detail'][data-step-passed='true'] > div {\n border: 1px solid ",";\n height: 0px;\n }\n\n &[data-track-type='detail'] > div {\n border: 1px solid ",";\n height: 0px;\n }\n"],["\n display: flex;\n width: 100%;\n height: 36px;\n\n &[data-track-type='detail'] {\n margin-top: 0;\n }\n\n &[data-track-type='detail'][data-step-passed='true'] > div {\n border: 1px solid ",";\n height: 0px;\n }\n\n &[data-track-type='detail'] > div {\n border: 1px solid ",";\n height: 0px;\n }\n"])),(function(n){return n.theme.colors.primaryBase}),(function(n){return n.theme.colors.gray200})),b=f.default.div(i\|\|(i=n.__makeTemplateObject(["\n width: 100%;\n height: 5px;\n align-self: center;\n border-radius: 4px;\n background-color: ",";\n"],["\n width: 100%;\n height: 5px;\n align-self: center;\n border-radius: 4px;\n background-color: ",";\n"])),(function(n){return n.theme.colors.gray200})),y=f.default.div(a\|\|(a=n.__makeTemplateObject(["\n position: absolute;\n top: 32px;\n min-width: 100px;\n text-align: center;\n color: ",";\n font-size: ",";\n font-weight: ",";\n\n &[data-step-passed='true'] {\n color: ",";\n }\n"],["\n position: absolute;\n top: 32px;\n min-width: 100px;\n text-align: center;\n color: ",";\n font-size: ",";\n font-weight: ",";\n\n &[data-step-passed='true'] {\n color: ",";\n }\n"])),(function(n){return n.theme.colors.gray500}),(function(n){return n.theme.sizes.fsCaption2}),(function(n){return n.theme.sizes.fwBold}),(function(n){return n.theme.colors.gray800})),k=f.default.div(l\|\|(l=n.__makeTemplateObject(["\n display: flex;\n align-items: center;\n"],["\n display: flex;\n align-items: center;\n"]))),w=f.default.div(s\|\|(s=n.__makeTemplateObject(["\n display: flex;\n align-items: center;\n font-size: ",";\n font-weight: ",";\n color: ",";\n cursor: pointer;\n\n & > svg {\n height: 10px;\n width: 10px;\n margin: 0 14px;\n }\n\n & > svg > path {\n stroke: ",";\n }\n\n &[data-selected='true'] {\n color: ",";\n }\n"],["\n display: flex;\n align-items: center;\n font-size: ",";\n font-weight: ",";\n color: ",";\n cursor: pointer;\n\n & > svg {\n height: 10px;\n width: 10px;\n margin: 0 14px;\n }\n\n & > svg > path {\n stroke: ",";\n }\n\n &[data-selected='true'] {\n color: ",";\n }\n"])),(function(n){return n.theme.sizes.fsCaption2}),(function(n){return n.theme.sizes.fwBold}),(function(n){return n.theme.colors.gray500}),(function(n){return n.theme.colors.gray500}),(function(n){return n.theme.colors.primaryBase})),v=f.default.div(c\|\|(c=n.__makeTemplateObject(["\n position: absolute;\n left: 0;\n top: 19px;\n height: 24px;\n cursor: pointer;\n\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n\n padding: 8px;\n background-color: ",";\n"],["\n position: absolute;\n left: 0;\n top: 19px;\n height: 24px;\n cursor: pointer;\n\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n\n padding: 8px;\n background-color: ",";\n"])),(function(n){return n.theme.colors.white})),_=f.default.div(d\|\|(d=n.__makeTemplateObject(["\n min-width: 24px;\n height: 24px;\n border: 2px solid ",";\n border-radius: 50%;\n margin-right: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n\n background-color: ",";\n color: ",";\n border: 1px solid ",";\n\n &[data-is-active='true'] {\n border: none;\n background-color: ",";\n color: ",";\n }\n"],["\n min-width: 24px;\n height: 24px;\n border: 2px solid ",";\n border-radius: 50%;\n margin-right: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n\n background-color: ",";\n color: ",";\n border: 1px solid ",";\n\n &[data-is-active='true'] {\n border: none;\n background-color: ",";\n color: ",";\n }\n"])),(function(n){return n.theme.colors.white}),(function(n){return n.theme.colors.white}),(function(n){return n.theme.colors.gray300}),(function(n){return n.theme.colors.gray300}),(function(n){return n.theme.colors.primaryBase}),(function(n){return n.theme.colors.white})),j=f.default.div(p\|\|(p=n.__makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n\n & > svg {\n height: 20px;\n width: 20px;\n margin-right: 8px;\n\n & > path {\n stroke: ",";\n }\n }\n"],["\n display: flex;\n align-items: center;\n justify-content: center;\n\n & > svg {\n height: 20px;\n width: 20px;\n margin-right: 8px;\n\n & > path {\n stroke: ",";\n }\n }\n"])),(function(n){return n.theme.colors.gray500})),S=f.default.div(u\|\|(u=n.__makeTemplateObject(["\n color: ",";\n font-size: ",";\n font-weight: ",";\n margin-right: 8px;\n flex: 0 0 auto;\n\n &[data-step-passed='true'] {\n color: ",";\n }\n"],["\n color: ",";\n font-size: ",";\n font-weight: ",";\n margin-right: 8px;\n flex: 0 0 auto;\n\n &[data-step-passed='true'] {\n color: ",";\n }\n"])),(function(n){return n.theme.colors.gray400}),(function(n){return n.theme.sizes.fsCaption2}),(function(n){return n.theme.sizes.fwBold}),(function(n){return n.theme.colors.gray800})),z=f.default.div(h\|\|(h=n.__makeTemplateObject(["\n position: absolute;\n top: 32px;\n font-weight: ",";\n color: ",";\n padding-right: 16px;\n"],["\n position: absolute;\n top: 32px;\n font-weight: ",";\n color: ",";\n padding-right: 16px;\n"])),(function(n){return n.theme.sizes.fwRegular}),(function(n){return n.theme.colors.gray400}));exports.StyledBreadcrumbContainer=k,exports.StyledBreadcrumbWrapper=w,exports.StyledDetailStep=v,exports.StyledDetailStepDescription=z,exports.StyledDetailStepIndicator=_,exports.StyledDetailStepIndicatorExternal=j,exports.StyledDetailStepLabel=S,exports.StyledSlider=g,exports.StyledStep=x,exports.StyledStepLabel=y,exports.StyledTrack=b,exports.StyledTrackContainer=m;
2	+ //# sourceMappingURL=index.styled.js.map

package/build/components/molecules/progressBar/index.styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.styled.js","sources":["../../../../src/components/molecules/progressBar/index.styled.tsx"],"sourcesContent":["import { ThemeProps } from 'misc/theme'\nimport styled from 'styled-components'\n\nexport const StyledSlider = styled.div`\n position: relative;\n width: 100%;\n\n & div[role='slider'] {\n -webkit-text-size-adjust: none;\n -webkit-user-select: none;\n &:focus {\n outline: none;\n }\n }\n`\n\nexport const StyledStep = styled.div`\n position: absolute;\n top: 19px;\n width: 24px;\n height: 24px;\n color: ${(props: ThemeProps) => props.theme.colors.white};\n border: 2px solid ${(props: ThemeProps) => props.theme.colors.white};\n border-radius: 50%;\n transform: translateY(-50%) translateX(-50%);\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n\n background-color: ${(props: ThemeProps) => props.theme.colors.white};\n color: ${(props: ThemeProps) => props.theme.colors.gray300};\n border: 1px solid ${(props: ThemeProps) => props.theme.colors.gray300};\n\n &[data-is-active='true'] {\n background-color: ${(props: ThemeProps) => props.theme.colors.primaryBase};\n color: ${(props: ThemeProps) => props.theme.colors.white};\n border: none;\n }\n`\n\nexport const StyledTrackContainer = styled.div`\n display: flex;\n width: 100%;\n height: 36px;\n\n &[data-track-type='detail'] {\n margin-top: 0;\n }\n\n &[data-track-type='detail'][data-step-passed='true'] > div {\n border: 1px solid ${(props: ThemeProps) => props.theme.colors.primaryBase};\n height: 0px;\n }\n\n &[data-track-type='detail'] > div {\n border: 1px solid ${(props: ThemeProps) => props.theme.colors.gray200};\n height: 0px;\n }\n`\n\nexport const StyledTrack = styled.div`\n width: 100%;\n height: 5px;\n align-self: center;\n border-radius: 4px;\n background-color: ${(props: ThemeProps) => props.theme.colors.gray200};\n`\n\nexport const StyledStepLabel = styled.div`\n position: absolute;\n top: 32px;\n min-width: 100px;\n text-align: center;\n color: ${(props: ThemeProps) => props.theme.colors.gray500};\n font-size: ${(props: ThemeProps) => props.theme.sizes.fsCaption2};\n font-weight: ${(props: ThemeProps) => props.theme.sizes.fwBold};\n\n &[data-step-passed='true'] {\n color: ${(props: ThemeProps) => props.theme.colors.gray800};\n }\n`\n\nexport const StyledBreadcrumbContainer = styled.div`\n display: flex;\n align-items: center;\n`\n\nexport const StyledBreadcrumbWrapper = styled.div`\n display: flex;\n align-items: center;\n font-size: ${(props: ThemeProps) => props.theme.sizes.fsCaption2};\n font-weight: ${(props: ThemeProps) => props.theme.sizes.fwBold};\n color: ${(props: ThemeProps) => props.theme.colors.gray500};\n cursor: pointer;\n\n & > svg {\n height: 10px;\n width: 10px;\n margin: 0 14px;\n }\n\n & > svg > path {\n stroke: ${(props: ThemeProps) => props.theme.colors.gray500};\n }\n\n &[data-selected='true'] {\n color: ${(props: ThemeProps) => props.theme.colors.primaryBase};\n }\n`\n\nexport const StyledDetailStep = styled.div`\n position: absolute;\n left: 0;\n top: 19px;\n height: 24px;\n cursor: pointer;\n\n transform: translateY(-50%);\n display: flex;\n align-items: center;\n\n padding: 8px;\n background-color: ${(props: ThemeProps) => props.theme.colors.white};\n`\n\nexport const StyledDetailStepIndicator = styled.div`\n min-width: 24px;\n height: 24px;\n border: 2px solid ${(props: ThemeProps) => props.theme.colors.white};\n border-radius: 50%;\n margin-right: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n\n background-color: ${(props: ThemeProps) => props.theme.colors.white};\n color: ${(props: ThemeProps) => props.theme.colors.gray300};\n border: 1px solid ${(props: ThemeProps) => props.theme.colors.gray300};\n\n &[data-is-active='true'] {\n border: none;\n background-color: ${(props: ThemeProps) => props.theme.colors.primaryBase};\n color: ${(props: ThemeProps) => props.theme.colors.white};\n }\n`\n\nexport const StyledDetailStepIndicatorExternal = styled.div`\n display: flex;\n align-items: center;\n justify-content: center;\n\n & > svg {\n height: 20px;\n width: 20px;\n margin-right: 8px;\n\n & > path {\n stroke: ${(props: ThemeProps) => props.theme.colors.gray500};\n }\n }\n`\n\nexport const StyledDetailStepLabel = styled.div`\n color: ${(props: ThemeProps) => props.theme.colors.gray400};\n font-size: ${(props: ThemeProps) => props.theme.sizes.fsCaption2};\n font-weight: ${(props: ThemeProps) => props.theme.sizes.fwBold};\n margin-right: 8px;\n flex: 0 0 auto;\n\n &[data-step-passed='true'] {\n color: ${(props: ThemeProps) => props.theme.colors.gray800};\n }\n`\nexport const StyledDetailStepDescription = styled.div`\n position: absolute;\n top: 32px;\n font-weight: ${(props: ThemeProps) => props.theme.sizes.fwRegular};\n color: ${(props: ThemeProps) => props.theme.colors.gray400};\n padding-right: 16px;\n`\n"],"names":["StyledSlider","styled","div","templateObject_1","__makeTemplateObject","StyledStep","templateObject_2","props","theme","colors","white","gray300","primaryBase","StyledTrackContainer","templateObject_3","gray200","StyledTrack","templateObject_4","StyledStepLabel","templateObject_5","gray500","sizes","fsCaption2","fwBold","gray800","StyledBreadcrumbContainer","templateObject_6","StyledBreadcrumbWrapper","templateObject_7","StyledDetailStep","templateObject_8","StyledDetailStepIndicator","templateObject_9","StyledDetailStepIndicatorExternal","templateObject_10","StyledDetailStepLabel","templateObject_11","gray400","StyledDetailStepDescription","templateObject_12","fwRegular"],"mappings":"oQAGaA,EAAeC,EAAM,QAACC,IAAGC,IAAAA,EAAAC,uBAAA,CAAA,+LAAA,CAAA,kMAazBC,EAAaJ,EAAM,QAACC,IAAGI,IAAAA,EAAAF,EAAAA,qBAAA,CAAA,oFAAA,0BAAA,8LAAA,eAAA,0BAAA,4DAAA,iBAAA,+BAAA,CAAA,oFAKsB,0BACW,8LAQA,eACT,0BACW,4DAGM,iBACjB,kCAfjD,SAACG,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SAC/B,SAACH,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SAQ1C,SAACH,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SACrD,SAACH,GAAsB,OAAAA,EAAMC,MAAMC,OAAOE,WAC/B,SAACJ,GAAsB,OAAAA,EAAMC,MAAMC,OAAOE,WAGxC,SAACJ,GAAsB,OAAAA,EAAMC,MAAMC,OAAOG,eACrD,SAACL,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SAK1CG,EAAuBZ,EAAAA,QAAOC,IAAGY,IAAAA,EAAAV,EAAAA,qBAAA,CAAA,4MAAA,4FAAA,8BAAA,CAAA,4MAU+B,4FAKJ,iCALjD,SAACG,GAAsB,OAAAA,EAAMC,MAAMC,OAAOG,eAK1C,SAACL,GAAsB,OAAAA,EAAMC,MAAMC,OAAOM,WAKrDC,EAAcf,EAAAA,QAAOC,IAAGe,IAAAA,EAAAb,EAAAA,qBAAA,CAAA,uGAAA,OAAA,CAAA,uGAKkC,UAAjD,SAACG,GAAsB,OAAAA,EAAMC,MAAMC,OAAOM,WAGnDG,EAAkBjB,EAAM,QAACC,IAAGiB,IAAAA,EAAAf,uBAAA,CAAA,+FAAA,mBAAA,qBAAA,mDAAA,YAAA,CAAA,+FAKmB,mBACM,qBACF,mDAGF,eALnD,SAACG,GAAsB,OAAAA,EAAMC,MAAMC,OAAOW,WACtC,SAACb,GAAsB,OAAAA,EAAMC,MAAMa,MAAMC,cACvC,SAACf,GAAsB,OAAAA,EAAMC,MAAMa,MAAME,UAG7C,SAAChB,GAAsB,OAAAA,EAAMC,MAAMC,OAAOe,WAI1CC,EAA4BxB,EAAM,QAACC,IAAGwB,IAAAA,EAAAtB,uBAAA,CAAA,gDAAA,CAAA,mDAKtCuB,EAA0B1B,EAAAA,QAAOC,IAAG0B,IAAAA,EAAAxB,EAAAA,qBAAA,CAAA,4DAAA,qBAAA,eAAA,0IAAA,qDAAA,YAAA,CAAA,4DAGiB,qBACF,eACJ,0IAUG,qDAIG,eAhBnD,SAACG,GAAsB,OAAAA,EAAMC,MAAMa,MAAMC,cACvC,SAACf,GAAsB,OAAAA,EAAMC,MAAMa,MAAME,UAC/C,SAAChB,GAAsB,OAAAA,EAAMC,MAAMC,OAAOW,WAUvC,SAACb,GAAsB,OAAAA,EAAMC,MAAMC,OAAOW,WAI3C,SAACb,GAAsB,OAAAA,EAAMC,MAAMC,OAAOG,eAI1CiB,EAAmB5B,EAAAA,QAAOC,IAAG4B,IAAAA,EAAA1B,EAAAA,qBAAA,CAAA,8MAAA,OAAA,CAAA,8MAY2B,UAA/C,SAACG,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SAGnDqB,EAA4B9B,EAAM,QAACC,IAAG8B,IAAAA,EAAA5B,EAAAA,qBAAA,CAAA,8DAAA,mKAAA,eAAA,0BAAA,+EAAA,iBAAA,YAAA,CAAA,8DAGkB,mKAQA,eACT,0BACW,+EAIM,iBACjB,eAftC,SAACG,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SAQ1C,SAACH,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SACrD,SAACH,GAAsB,OAAAA,EAAMC,MAAMC,OAAOE,WAC/B,SAACJ,GAAsB,OAAAA,EAAMC,MAAMC,OAAOE,WAIxC,SAACJ,GAAsB,OAAAA,EAAMC,MAAMC,OAAOG,eACrD,SAACL,GAAsB,OAAAA,EAAMC,MAAMC,OAAOC,SAI1CuB,EAAoChC,EAAAA,QAAOC,IAAGgC,IAAAA,EAAA9B,EAAAA,qBAAA,CAAA,uLAAA,mBAAA,CAAA,uLAWM,sBAAjD,SAACG,GAAsB,OAAAA,EAAMC,MAAMC,OAAOW,WAK7Ce,EAAwBlC,EAAM,QAACC,IAAGkC,IAAAA,EAAAhC,uBAAA,CAAA,cAAA,mBAAA,qBAAA,4FAAA,YAAA,CAAA,cACa,mBACM,qBACF,4FAKF,eAPnD,SAACG,GAAsB,OAAAA,EAAMC,MAAMC,OAAO4B,WACtC,SAAC9B,GAAsB,OAAAA,EAAMC,MAAMa,MAAMC,cACvC,SAACf,GAAsB,OAAAA,EAAMC,MAAMa,MAAME,UAK7C,SAAChB,GAAsB,OAAAA,EAAMC,MAAMC,OAAOe,WAG1Cc,EAA8BrC,EAAAA,QAAOC,IAAGqC,IAAAA,EAAAnC,EAAAA,qBAAA,CAAA,yDAAA,eAAA,+BAAA,CAAA,yDAGc,eACP,kCAD3C,SAACG,GAAsB,OAAAA,EAAMC,MAAMa,MAAMmB,aAC/C,SAACjC,GAAsB,OAAAA,EAAMC,MAAMC,OAAO4B"}

package/build/components/molecules/radioGroup/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),a=require("../../atoms/radio/index.js"),t=require("./index.styled.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=r(e);exports.RadioGroup=function(r){var i=r.id,d=r.value,o=r.options,l=r.className,u=r.type,c=void 0===u?"circle":u,v=r.isDisabled,s=r.size,p=void 0===s?"small":s,f=r.direction,m=void 0===f?"vertical":f,y=r.group,E=void 0===y?"group1":y,b=r.onChange,g=r.dataEventCategory,j=r.dataEventAction,x=r.dataEventLabel,A=e.useState(d),C=A[0],h=A[1],q=function(e){h(e),b&&b(e)};return n.default.createElement(t.StyledRadioGroup,{className:l,"data-direction":m,"data-group":E},o.map((function(t){var r=C===t.value;return n.default.createElement(e.Fragment,{key:"".concat(i,"-").concat(t.value)},n.default.createElement(a.Radio,{type:c,size:p,label:t.label,name:i,checked:r,value:t.value,isDisabled:v,onChange:!v&&q,dataEventCategory:g,dataEventAction:j,dataEventLabel:x}),r&&t.renderActivated&&t.renderActivated())})))};
2	+ //# sourceMappingURL=index.js.map

package/build/components/molecules/radioGroup/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sources":["../../../../src/components/molecules/radioGroup/index.tsx"],"sourcesContent":["import React, { Fragment, useState } from 'react'\n\nimport { Radio } from '../../atoms/radio'\nimport { StyledRadioGroup } from './index.styled'\n\nexport type RadioGroupOption = Array<{\n label: string\n value: string\n renderActivated?: () => JSX.Element\n}>\nexport type Props = {\n type: 'circle' | 'rectangle'\n options: RadioGroupOption\n value?: string\n id: string\n className?: string\n isDisabled?: boolean\n size?: 'small' | 'large'\n direction?: 'vertical' | 'horizontal'\n group?: 'group1' | 'group2'\n onChange?: (v: string) => void\n dataEventCategory?: string\n dataEventAction?: string\n dataEventLabel?: string\n}\n\nconst RadioGroup = ({\n id,\n value,\n options,\n className,\n type = 'circle',\n isDisabled,\n size = 'small',\n direction = 'vertical',\n group = 'group1',\n onChange,\n dataEventCategory,\n dataEventAction,\n dataEventLabel,\n}: Props) => {\n const [check, setCheck] = useState(value)\n\n const handleOnChange = (v: string) => {\n setCheck(v)\n onChange && onChange(v)\n }\n\n return (\n <StyledRadioGroup\n className={className}\n data-direction={direction}\n data-group={group}\n >\n {options.map((option) => {\n const checked = check === option.value\n return (\n <Fragment key={`${id}-${option.value}`}>\n <Radio\n type={type}\n size={size}\n label={option.label}\n name={id}\n checked={checked}\n value={option.value}\n isDisabled={isDisabled}\n onChange={!isDisabled && handleOnChange}\n dataEventCategory={dataEventCategory}\n dataEventAction={dataEventAction}\n dataEventLabel={dataEventLabel}\n />\n {checked && option.renderActivated && option.renderActivated()}\n </Fragment>\n )\n })}\n </StyledRadioGroup>\n )\n}\n\nexport { RadioGroup }\n"],"names":["_a","id","value","options","className","_b","type","isDisabled","_c","size","_d","direction","_e","group","onChange","dataEventCategory","dataEventAction","dataEventLabel","_f","useState","check","setCheck","handleOnChange","v","React","createElement","StyledRadioGroup","map","option","checked","Fragment","key","concat","Radio","label","name","renderActivated"],"mappings":"wQA0BmB,SAACA,OAClBC,EAAED,EAAAC,GACFC,EAAKF,EAAAE,MACLC,EAAOH,EAAAG,QACPC,EAASJ,EAAAI,UACTC,EAAAL,EAAAM,KAAAA,OAAI,IAAAD,EAAG,SAAQA,EACfE,eACAC,EAAAR,EAAAS,KAAAA,OAAO,IAAAD,EAAA,UACPE,EAAAV,EAAAW,UAAAA,OAAY,IAAAD,EAAA,aACZE,EAAAZ,EAAAa,MAAAA,OAAQ,IAAAD,EAAA,WACRE,EAAQd,EAAAc,SACRC,EAAiBf,EAAAe,kBACjBC,EAAehB,EAAAgB,gBACfC,EAAcjB,EAAAiB,eAERC,EAAoBC,EAAAA,SAASjB,GAA5BkB,EAAKF,EAAA,GAAEG,EAAQH,EAAA,GAEhBI,EAAiB,SAACC,GACtBF,EAASE,GACTT,GAAYA,EAASS,IAGvB,OACEC,EAAC,QAAAC,cAAAC,EAAgBA,iBACf,CAAAtB,UAAWA,EAAS,iBACJO,EAAS,aACbE,GAEXV,EAAQwB,KAAI,SAACC,GACZ,IAAMC,EAAUT,IAAUQ,EAAO1B,MACjC,OACEsB,EAAA,QAAAC,cAACK,WAAQ,CAACC,IAAK,GAAGC,OAAA/B,EAAM,KAAA+B,OAAAJ,EAAO1B,QAC7BsB,EAAAA,QAACC,cAAAQ,EAAAA,MACC,CAAA3B,KAAMA,EACNG,KAAMA,EACNyB,MAAON,EAAOM,MACdC,KAAMlC,EACN4B,QAASA,EACT3B,MAAO0B,EAAO1B,MACdK,WAAYA,EACZO,UAAWP,GAAce,EACzBP,kBAAmBA,EACnBC,gBAAiBA,EACjBC,eAAgBA,IAEjBY,GAAWD,EAAOQ,iBAAmBR,EAAOQ"}

package/build/components/molecules/radioGroup/index.styled.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js");function t(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var r,a=t(require("styled-components")).default.div(r\|\|(r=n.__makeTemplateObject(["\n display: flex;\n\n &[data-direction='vertical'] {\n flex-direction: column;\n\n div {\n &[data-type='circle'] {\n margin-bottom: 20px;\n }\n\n &[data-type='rectangle'] {\n margin-bottom: 20px;\n }\n }\n }\n\n &[data-direction='horizontal'] {\n flex-wrap: wrap;\n\n &[data-group='group1'] {\n div {\n &[data-type='rectangle'] {\n flex-wrap: wrap;\n\n &:first-child {\n label {\n border-top-left-radius: 6px;\n border-bottom-left-radius: 6px;\n }\n }\n\n &:last-child {\n label {\n border-top-right-radius: 6px;\n border-bottom-right-radius: 6px;\n }\n }\n\n &:not(:last-child) {\n label {\n border-right: unset;\n }\n }\n\n label {\n border-radius: unset;\n }\n }\n }\n }\n\n &[data-group='group2'] {\n div {\n &[data-type='rectangle'] {\n flex-wrap: wrap;\n margin-right: 8px;\n margin-bottom: 8px;\n }\n }\n }\n\n div {\n &[data-type='circle'] {\n margin-right: 25px;\n }\n\n &[data-type='rectangle'] {\n margin-bottom: 20px;\n }\n }\n }\n"],["\n display: flex;\n\n &[data-direction='vertical'] {\n flex-direction: column;\n\n div {\n &[data-type='circle'] {\n margin-bottom: 20px;\n }\n\n &[data-type='rectangle'] {\n margin-bottom: 20px;\n }\n }\n }\n\n &[data-direction='horizontal'] {\n flex-wrap: wrap;\n\n &[data-group='group1'] {\n div {\n &[data-type='rectangle'] {\n flex-wrap: wrap;\n\n &:first-child {\n label {\n border-top-left-radius: 6px;\n border-bottom-left-radius: 6px;\n }\n }\n\n &:last-child {\n label {\n border-top-right-radius: 6px;\n border-bottom-right-radius: 6px;\n }\n }\n\n &:not(:last-child) {\n label {\n border-right: unset;\n }\n }\n\n label {\n border-radius: unset;\n }\n }\n }\n }\n\n &[data-group='group2'] {\n div {\n &[data-type='rectangle'] {\n flex-wrap: wrap;\n margin-right: 8px;\n margin-bottom: 8px;\n }\n }\n }\n\n div {\n &[data-type='circle'] {\n margin-right: 25px;\n }\n\n &[data-type='rectangle'] {\n margin-bottom: 20px;\n }\n }\n }\n"])));exports.StyledRadioGroup=a;
2	+ //# sourceMappingURL=index.styled.js.map