npm - @remember-web/primitive - Versions diffs - 0.1.19 → 0.2.0 - Mend

@remember-web/primitive 0.1.19 → 0.2.0

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 (258) hide show

package/dist/src/Inputs/Select/DesignedSelect/styles.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.esm.js","sources":["../../../../../src/Inputs/Select/DesignedSelect/styles.ts"],"sourcesContent":["'use client';\n\nimport ~~styled,~~ { ~~css } from 'styled-components';\nimport {~~\n bg100,\n bg200,\n bg300,\n contents000,\n contents200,\n contents300,\n ellipsis,\n} from '@remember-web/mixin';\n\nimport { SelectContainer } from '../styles';\nimport type { ExpandedType } from './types';\n\nexport const StyledSelect = styled.div<{\n expandedDirection?: ExpandedType;\n isPlaceholder?: boolean;\n}>`\n ${ellipsis()}\n border: 1px solid ${contents300};\n ${({ expandedDirection }) =>\n ({\n none: css`\n border-radius: 4px;\n `,\n above: css`\n border-radius: 0 0 4px 4px;\n border-top-color: transparent;\n `,\n below: css`\n border-radius: 4px 4px 0 0;\n border-bottom-color: transparent;\n `,\n }[expandedDirection ?? 'none'])};\n\n padding: 10px 36px 10px 12px;\n transition: border-color 0.2s, background-color 0.2s;\n\n ${({ isPlaceholder }) =>\n isPlaceholder &&\n css`\n color: ${contents200};\n `}\n\n ${SelectContainer}:focus-within & {\n outline: none;\n border-color: ${contents000};\n }\n ${SelectContainer}:not([aria-disabled='true']) & {\n @media (hover: hover) {\n &:hover {\n background-color: ${bg200};\n }\n }\n\n &:active {\n background-color: ${bg300};\n }\n }\n`;\n\nexport const SelectDownIcon = styled.div`\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n\n & > svg {\n display: block;\n }\n\n pointer-events: none;\n`;\n\nexport const SelectOptionWrapper = styled.ul<{\n expandedDirection?: ExpandedType;\n maxHeight?: number \| string;\n}>`\n all: unset;\n position: absolute;\n left: 0;\n right: 0;\n z-index: 1;\n border: 1px solid ${contents300};\n background-color: ${bg100};\n overflow-y: scroll;\n overscroll-behavior: contain;\n transition: border-color 0.2s, background-color 0.2s;\n\n ${({ maxHeight }) => {\n if (!maxHeight) {\n return null;\n }\n\n if (typeof maxHeight === 'number') {\n return css`\n max-height: ${maxHeight}px;\n `;\n }\n\n return css`\n max-height: ${maxHeight};\n `;\n }};\n\n ${({ expandedDirection }) =>\n expandedDirection === 'below'\n ? css`\n top: calc(100% - 1px);\n border-top: none;\n border-radius: 0 0 4px 4px;\n `\n : css`\n bottom: calc(100% - 1px);\n border-bottom: none;\n border-radius: 4px 4px 0 0;\n `}\n\n ${SelectContainer}:focus &, ${SelectContainer}:focus-within & {\n outline: none;\n border-color: ${contents000};\n }\n`;\n\nexport const SelectOption = styled.li<{ isSelected?: boolean }>`\n ${ellipsis()}\n padding: 10px 12px;\n color: ${contents000};\n\n &[aria-disabled='true'] {\n color: ${contents300};\n }\n\n &:focus {\n background-color: ${bg200};\n outline: none;\n }\n\n ${({ isSelected }) =>\n isSelected &&\n css`\n background-color: ${bg200};\n `}\n`;\n"],"names":["below","SelectDownIcon"],"mappings":";;;;;;AAAa;AAgBN;AAMH;;;;AASEA;;~~AAI4B~~;~~AAK9B~~;;AAIC;AAmBQC;;AA4BU;;AAEjB;AACF;AAEA;;AAIA;;AAKF;AAEE;AAAoB;AAWf;AAQF;AAcH;;AAIC;;"}
1	+ {"version":3,"file":"styles.esm.js","sources":["../../../../../src/Inputs/Select/DesignedSelect/styles.ts"],"sourcesContent":["'use client';\n\nimport {\n bg100,\n bg200,\n bg300,\n contents000,\n contents200,\n contents300,\n ellipsis,\n} from '@remember-web/mixin';\nimport styled, { css } from 'styled-components';\n\nimport { SelectContainer } from '../styles';\nimport type { ExpandedType } from './types';\n\nexport const StyledSelect = styled.div<{\n expandedDirection?: ExpandedType;\n isPlaceholder?: boolean;\n}>`\n ${ellipsis()}\n border: 1px solid ${contents300};\n ${({ expandedDirection }) =>\n ({\n none: css`\n border-radius: 4px;\n `,\n above: css`\n border-radius: 0 0 4px 4px;\n border-top-color: transparent;\n `,\n below: css`\n border-radius: 4px 4px 0 0;\n border-bottom-color: transparent;\n `,\n })[expandedDirection ?? 'none']};\n\n padding: 10px 36px 10px 12px;\n transition: border-color 0.2s, background-color 0.2s;\n\n ${({ isPlaceholder }) =>\n isPlaceholder &&\n css`\n color: ${contents200};\n `}\n\n ${SelectContainer}:focus-within & {\n outline: none;\n border-color: ${contents000};\n }\n ${SelectContainer}:not([aria-disabled='true']) & {\n @media (hover: hover) {\n &:hover {\n background-color: ${bg200};\n }\n }\n\n &:active {\n background-color: ${bg300};\n }\n }\n`;\n\nexport const SelectDownIcon = styled.div`\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n\n & > svg {\n display: block;\n }\n\n pointer-events: none;\n`;\n\nexport const SelectOptionWrapper = styled.ul<{\n expandedDirection?: ExpandedType;\n maxHeight?: number \| string;\n}>`\n all: unset;\n position: absolute;\n left: 0;\n right: 0;\n z-index: 1;\n border: 1px solid ${contents300};\n background-color: ${bg100};\n overflow-y: scroll;\n overscroll-behavior: contain;\n transition: border-color 0.2s, background-color 0.2s;\n\n ${({ maxHeight }) => {\n if (!maxHeight) {\n return null;\n }\n\n if (typeof maxHeight === 'number') {\n return css`\n max-height: ${maxHeight}px;\n `;\n }\n\n return css`\n max-height: ${maxHeight};\n `;\n }};\n\n ${({ expandedDirection }) =>\n expandedDirection === 'below'\n ? css`\n top: calc(100% - 1px);\n border-top: none;\n border-radius: 0 0 4px 4px;\n `\n : css`\n bottom: calc(100% - 1px);\n border-bottom: none;\n border-radius: 4px 4px 0 0;\n `}\n\n ${SelectContainer}:focus &, ${SelectContainer}:focus-within & {\n outline: none;\n border-color: ${contents000};\n }\n`;\n\nexport const SelectOption = styled.li<{ isSelected?: boolean }>`\n ${ellipsis()}\n padding: 10px 12px;\n color: ${contents000};\n\n &[aria-disabled='true'] {\n color: ${contents300};\n }\n\n &:focus {\n background-color: ${bg200};\n outline: none;\n }\n\n ${({ isSelected }) =>\n isSelected &&\n css`\n background-color: ${bg200};\n `}\n`;\n"],"names":["below","SelectDownIcon"],"mappings":";;;;;;AAAa;AAgBN;AAMH;;;;AASEA;;AAI6B;AAK/B;;AAIC;AAmBQC;;AA4BU;;AAEjB;AACF;AAEA;;AAIA;;AAKF;AAEE;AAAoB;AAWf;AAQF;AAcH;;AAIC;;"}

package/dist/src/Inputs/Select/NativeSelect/index.cjs.js CHANGED Viewed

@@ -3,10 +3,10 @@
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-var react = require('react');
 var icon = require('@remember-web/icon');
-var styles$1 = require('./styles.cjs.js');
+var react = require('react');
 var styles = require('../styles.cjs.js');
+var styles$1 = require('./styles.cjs.js');
 var jsxRuntime = require('react/jsx-runtime');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/dist/src/Inputs/Select/NativeSelect/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../../src/Inputs/Select/NativeSelect/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ForwardRefRenderFunction } from 'react';\nimport { forwardRef } from 'react';\nimport { ~~IconArrow2Down~~ } from '~~@remember-web/icon~~';\n\nimport { SelectDownIcon, StyledSelect } from './styles';\nimport type { NativeSelectInternalProps } from './types';\~~nimport { SelectContainer } from '../styles';\~~n\nconst NativeSelect: ForwardRefRenderFunction<\n HTMLSelectElement,\n NativeSelectInternalProps\n> = (\n {\n children,\n className,\n width,\n placeholder,\n value,\n disabled,\n onClick,\n ...props\n },\n ref\n) => {\n const showPlaceholder = !value && !!placeholder;\n\n return (\n <SelectContainer aria-disabled={disabled} className={className}>\n <StyledSelect\n {...props}\n value={value}\n $width={width}\n ref={ref}\n isPlaceholder={showPlaceholder}\n disabled={disabled}\n onClick={onClick}\n >\n {!value && (\n <option value=\"\" selected>\n {placeholder \|\| 'ㅤ'}\n </option>\n )}\n {children}\n </StyledSelect>\n <SelectDownIcon>\n <IconArrow2Down size=\"small\" />\n </SelectDownIcon>\n </SelectContainer>\n );\n};\n\nexport default forwardRef(NativeSelect);\n"],"names":["props","className","value","$width","ref","isPlaceholder","disabled","onClick","children","size"],"mappings":";;;;;;;;;;;;;;;;AAAa;AAAA;AAAA;AAUb;AAeK;;;;;;;AAHEA;AAIL;;AAGmB;AAAyBC;;AAGtCC;AACAC;AACAC;AACAC;AACAC;AACAC;AAAiBC;AAGPN;;;;AAID;;AAGOO;;AAAe;AAChB;AAGvB;AAEA;;"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../../src/Inputs/Select/NativeSelect/index.tsx"],"sourcesContent":["'use client';\n\nimport { IconArrow2Down } from '@remember-web/icon';\nimport type { ForwardRefRenderFunction } from 'react';\nimport { forwardRef } from 'react';\n\nimport { SelectContainer } from '../styles';\nimport { SelectDownIcon, StyledSelect } from './styles';\nimport type { NativeSelectInternalProps } from './types';\n\nconst NativeSelect: ForwardRefRenderFunction<\n HTMLSelectElement,\n NativeSelectInternalProps\n> = (\n {\n children,\n className,\n width,\n placeholder,\n value,\n disabled,\n onClick,\n ...props\n },\n ref\n) => {\n const showPlaceholder = !value && !!placeholder;\n\n return (\n <SelectContainer aria-disabled={disabled} className={className}>\n <StyledSelect\n {...props}\n value={value}\n $width={width}\n ref={ref}\n isPlaceholder={showPlaceholder}\n disabled={disabled}\n onClick={onClick}\n >\n {!value && (\n <option value=\"\" selected>\n {placeholder \|\| 'ㅤ'}\n </option>\n )}\n {children}\n </StyledSelect>\n <SelectDownIcon>\n <IconArrow2Down size=\"small\" />\n </SelectDownIcon>\n </SelectContainer>\n );\n};\n\nexport default forwardRef(NativeSelect);\n"],"names":["props","className","value","$width","ref","isPlaceholder","disabled","onClick","children","size"],"mappings":";;;;;;;;;;;;;;;;AAAa;AAAA;AAAA;AAUb;AAeK;;;;;;;AAHEA;AAIL;;AAGmB;AAAyBC;;AAGtCC;AACAC;AACAC;AACAC;AACAC;AACAC;AAAiBC;AAGPN;;;;AAID;;AAGOO;;AAAe;AAChB;AAGvB;AAEA;;"}

package/dist/src/Inputs/Select/NativeSelect/index.esm.js CHANGED Viewed

@@ -1,10 +1,10 @@
 "use client";
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { forwardRef } from 'react';
 import { IconArrow2Down } from '@remember-web/icon';
-import { StyledSelect, SelectDownIcon } from './styles.esm.js';
+import { forwardRef } from 'react';
 import { SelectContainer } from '../styles.esm.js';
+import { StyledSelect, SelectDownIcon } from './styles.esm.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 var _excluded = ["children", "className", "width", "placeholder", "value", "disabled", "onClick"];

package/dist/src/Inputs/Select/NativeSelect/index.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.esm.js","sources":["../../../../../src/Inputs/Select/NativeSelect/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ForwardRefRenderFunction } from 'react';\nimport { forwardRef } from 'react';\nimport { ~~IconArrow2Down~~ } from '~~@remember-web/icon~~';\n\nimport { SelectDownIcon, StyledSelect } from './styles';\nimport type { NativeSelectInternalProps } from './types';\~~nimport { SelectContainer } from '../styles';\~~n\nconst NativeSelect: ForwardRefRenderFunction<\n HTMLSelectElement,\n NativeSelectInternalProps\n> = (\n {\n children,\n className,\n width,\n placeholder,\n value,\n disabled,\n onClick,\n ...props\n },\n ref\n) => {\n const showPlaceholder = !value && !!placeholder;\n\n return (\n <SelectContainer aria-disabled={disabled} className={className}>\n <StyledSelect\n {...props}\n value={value}\n $width={width}\n ref={ref}\n isPlaceholder={showPlaceholder}\n disabled={disabled}\n onClick={onClick}\n >\n {!value && (\n <option value=\"\" selected>\n {placeholder \|\| 'ㅤ'}\n </option>\n )}\n {children}\n </StyledSelect>\n <SelectDownIcon>\n <IconArrow2Down size=\"small\" />\n </SelectDownIcon>\n </SelectContainer>\n );\n};\n\nexport default forwardRef(NativeSelect);\n"],"names":["props","className","value","$width","ref","isPlaceholder","disabled","onClick","children","size"],"mappings":";;;;;;;;;AAAa;AAAA;AAAA;AAUb;AAeK;;;;;;;AAHEA;AAIL;;AAGmB;AAAyBC;;AAGtCC;AACAC;AACAC;AACAC;AACAC;AACAC;AAAiBC;AAGPN;;;;AAID;;AAGOO;;AAAe;AAChB;AAGvB;AAEA;;"}
1	+ {"version":3,"file":"index.esm.js","sources":["../../../../../src/Inputs/Select/NativeSelect/index.tsx"],"sourcesContent":["'use client';\n\nimport { IconArrow2Down } from '@remember-web/icon';\nimport type { ForwardRefRenderFunction } from 'react';\nimport { forwardRef } from 'react';\n\nimport { SelectContainer } from '../styles';\nimport { SelectDownIcon, StyledSelect } from './styles';\nimport type { NativeSelectInternalProps } from './types';\n\nconst NativeSelect: ForwardRefRenderFunction<\n HTMLSelectElement,\n NativeSelectInternalProps\n> = (\n {\n children,\n className,\n width,\n placeholder,\n value,\n disabled,\n onClick,\n ...props\n },\n ref\n) => {\n const showPlaceholder = !value && !!placeholder;\n\n return (\n <SelectContainer aria-disabled={disabled} className={className}>\n <StyledSelect\n {...props}\n value={value}\n $width={width}\n ref={ref}\n isPlaceholder={showPlaceholder}\n disabled={disabled}\n onClick={onClick}\n >\n {!value && (\n <option value=\"\" selected>\n {placeholder \|\| 'ㅤ'}\n </option>\n )}\n {children}\n </StyledSelect>\n <SelectDownIcon>\n <IconArrow2Down size=\"small\" />\n </SelectDownIcon>\n </SelectContainer>\n );\n};\n\nexport default forwardRef(NativeSelect);\n"],"names":["props","className","value","$width","ref","isPlaceholder","disabled","onClick","children","size"],"mappings":";;;;;;;;;AAAa;AAAA;AAAA;AAUb;AAeK;;;;;;;AAHEA;AAIL;;AAGmB;AAAyBC;;AAGtCC;AACAC;AACAC;AACAC;AACAC;AACAC;AAAiBC;AAGPN;;;;AAID;;AAGOO;;AAAe;AAChB;AAGvB;AAEA;;"}

package/dist/src/Inputs/Select/NativeSelect/styles.cjs.js CHANGED Viewed

@@ -2,8 +2,8 @@
 'use strict';
 var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
-var styled = require('styled-components');
 var mixin = require('@remember-web/mixin');
+var styled = require('styled-components');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/dist/src/Inputs/Select/NativeSelect/styles.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.cjs.js","sources":["../../../../../src/Inputs/Select/NativeSelect/styles.ts"],"sourcesContent":["'use client';\n\nimport ~~styled,~~ { ~~css } from 'styled-components';\nimport {~~\n bg200,\n bg300,\n contents000,\n contents200,\n contents300,\n getTypographyStyles,\n} from '@remember-web/mixin';\n\nexport const StyledSelect = styled.select<{\n $width?: number \| string;\n isPlaceholder?: boolean;\n}>`\n all: unset;\n\n ${getTypographyStyles('Body1_M')}\n border: 1px solid ${contents300};\n border-radius: 4px;\n padding: 10px 36px 10px 12px;\n box-sizing: border-box;\n\n ${({ isPlaceholder }) =>\n isPlaceholder &&\n css`\n color: ${contents200};\n `}\n\n width: ${({ $width }) => {\n if (!$width) {\n return null;\n }\n\n if (typeof $width === 'number') {\n return `${$width}px`;\n }\n\n return $width;\n }};\n\n transition: border-color 0.2s, background-color 0.2s;\n\n &:focus {\n border-color: ${contents000};\n }\n\n &:not(:disabled) {\n @media (hover: hover) {\n &:hover {\n background-color: ${bg200};\n }\n }\n\n &:active {\n background-color: ${bg300};\n }\n }\n`;\nexport const SelectDownIcon = styled.div`\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n\n & > svg {\n display: block;\n }\n\n pointer-events: none;\n`;\n"],"names":["SelectDownIcon"],"mappings":";;;;;;;;;;;;AAAa;AAYN;AAYH;;AAIC;AAEsB;;AAErB;AACF;AAEA;;AAEA;AAEA;AACF;AAoBWA;;;"}
1	+ {"version":3,"file":"styles.cjs.js","sources":["../../../../../src/Inputs/Select/NativeSelect/styles.ts"],"sourcesContent":["'use client';\n\nimport {\n bg200,\n bg300,\n contents000,\n contents200,\n contents300,\n getTypographyStyles,\n} from '@remember-web/mixin';\nimport styled, { css } from 'styled-components';\n\nexport const StyledSelect = styled.select<{\n $width?: number \| string;\n isPlaceholder?: boolean;\n}>`\n all: unset;\n\n ${getTypographyStyles('Body1_M')}\n border: 1px solid ${contents300};\n border-radius: 4px;\n padding: 10px 36px 10px 12px;\n box-sizing: border-box;\n\n ${({ isPlaceholder }) =>\n isPlaceholder &&\n css`\n color: ${contents200};\n `}\n\n width: ${({ $width }) => {\n if (!$width) {\n return null;\n }\n\n if (typeof $width === 'number') {\n return `${$width}px`;\n }\n\n return $width;\n }};\n\n transition: border-color 0.2s, background-color 0.2s;\n\n &:focus {\n border-color: ${contents000};\n }\n\n &:not(:disabled) {\n @media (hover: hover) {\n &:hover {\n background-color: ${bg200};\n }\n }\n\n &:active {\n background-color: ${bg300};\n }\n }\n`;\nexport const SelectDownIcon = styled.div`\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n\n & > svg {\n display: block;\n }\n\n pointer-events: none;\n`;\n"],"names":["SelectDownIcon"],"mappings":";;;;;;;;;;;;AAAa;AAYN;AAYH;;AAIC;AAEsB;;AAErB;AACF;AAEA;;AAEA;AAEA;AACF;AAoBWA;;;"}

package/dist/src/Inputs/Select/NativeSelect/styles.esm.js CHANGED Viewed

@@ -1,7 +1,7 @@
 "use client";
 import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
-import styled, { css } from 'styled-components';
 import { getTypographyStyles, contents300, contents200, contents000, bg200, bg300 } from '@remember-web/mixin';
+import styled, { css } from 'styled-components';
 var _templateObject, _templateObject2, _templateObject3;
 var StyledSelect = styled.select(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  all: unset;\n\n  ", "\n  border: 1px solid ", ";\n  border-radius: 4px;\n  padding: 10px 36px 10px 12px;\n  box-sizing: border-box;\n\n  ", "\n\n  width: ", ";\n\n  transition: border-color 0.2s, background-color 0.2s;\n\n  &:focus {\n    border-color: ", ";\n  }\n\n  &:not(:disabled) {\n    @media (hover: hover) {\n      &:hover {\n        background-color: ", ";\n      }\n    }\n\n    &:active {\n      background-color: ", ";\n    }\n  }\n"])), getTypographyStyles('Body1_M'), contents300, function (_ref) {

package/dist/src/Inputs/Select/NativeSelect/styles.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.esm.js","sources":["../../../../../src/Inputs/Select/NativeSelect/styles.ts"],"sourcesContent":["'use client';\n\nimport ~~styled,~~ { ~~css } from 'styled-components';\nimport {~~\n bg200,\n bg300,\n contents000,\n contents200,\n contents300,\n getTypographyStyles,\n} from '@remember-web/mixin';\n\nexport const StyledSelect = styled.select<{\n $width?: number \| string;\n isPlaceholder?: boolean;\n}>`\n all: unset;\n\n ${getTypographyStyles('Body1_M')}\n border: 1px solid ${contents300};\n border-radius: 4px;\n padding: 10px 36px 10px 12px;\n box-sizing: border-box;\n\n ${({ isPlaceholder }) =>\n isPlaceholder &&\n css`\n color: ${contents200};\n `}\n\n width: ${({ $width }) => {\n if (!$width) {\n return null;\n }\n\n if (typeof $width === 'number') {\n return `${$width}px`;\n }\n\n return $width;\n }};\n\n transition: border-color 0.2s, background-color 0.2s;\n\n &:focus {\n border-color: ${contents000};\n }\n\n &:not(:disabled) {\n @media (hover: hover) {\n &:hover {\n background-color: ${bg200};\n }\n }\n\n &:active {\n background-color: ${bg300};\n }\n }\n`;\nexport const SelectDownIcon = styled.div`\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n\n & > svg {\n display: block;\n }\n\n pointer-events: none;\n`;\n"],"names":["SelectDownIcon"],"mappings":";;;;;AAAa;AAYN;AAYH;;AAIC;AAEsB;;AAErB;AACF;AAEA;;AAEA;AAEA;AACF;AAoBWA;;"}
1	+ {"version":3,"file":"styles.esm.js","sources":["../../../../../src/Inputs/Select/NativeSelect/styles.ts"],"sourcesContent":["'use client';\n\nimport {\n bg200,\n bg300,\n contents000,\n contents200,\n contents300,\n getTypographyStyles,\n} from '@remember-web/mixin';\nimport styled, { css } from 'styled-components';\n\nexport const StyledSelect = styled.select<{\n $width?: number \| string;\n isPlaceholder?: boolean;\n}>`\n all: unset;\n\n ${getTypographyStyles('Body1_M')}\n border: 1px solid ${contents300};\n border-radius: 4px;\n padding: 10px 36px 10px 12px;\n box-sizing: border-box;\n\n ${({ isPlaceholder }) =>\n isPlaceholder &&\n css`\n color: ${contents200};\n `}\n\n width: ${({ $width }) => {\n if (!$width) {\n return null;\n }\n\n if (typeof $width === 'number') {\n return `${$width}px`;\n }\n\n return $width;\n }};\n\n transition: border-color 0.2s, background-color 0.2s;\n\n &:focus {\n border-color: ${contents000};\n }\n\n &:not(:disabled) {\n @media (hover: hover) {\n &:hover {\n background-color: ${bg200};\n }\n }\n\n &:active {\n background-color: ${bg300};\n }\n }\n`;\nexport const SelectDownIcon = styled.div`\n position: absolute;\n right: 12px;\n top: 50%;\n transform: translateY(-50%);\n\n & > svg {\n display: block;\n }\n\n pointer-events: none;\n`;\n"],"names":["SelectDownIcon"],"mappings":";;;;;AAAa;AAYN;AAYH;;AAIC;AAEsB;;AAErB;AACF;AAEA;;AAEA;AAEA;AACF;AAoBWA;;"}

package/dist/src/Inputs/Select/NativeSelect/types.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import type { ReactElement, SelectHTMLAttributes } from 'react';
-import type { NativeOption } from './Option';
 import type { OptionProps } from '../types';
+import type { NativeOption } from './Option';
 type NativeOptionElement = ReactElement<OptionProps<string>, typeof NativeOption>;
 export type NativeSelectInternalProps = Omit<SelectHTMLAttributes<HTMLSelectElement>, `aria-${string}` | 'children'> & {
     children: NativeOptionElement | NativeOptionElement[];

package/dist/src/Inputs/Select/NativeSelect/types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/Inputs/Select/NativeSelect/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,KAAK,EAAE,~~YAAY~~,EAAE,MAAM,UAAU,CAAC;~~AAC7C~~,OAAO,KAAK,EAAE,~~WAAW~~,EAAE,MAAM,UAAU,CAAC;~~AAE5C~~,KAAK,mBAAmB,GAAG,YAAY,CACrC,WAAW,CAAC,MAAM,CAAC,EACnB,OAAO,YAAY,CACpB,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC1C,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,QAAQ,MAAM,EAAE,GAAG,UAAU,CAC9B,GAAG;IACF,QAAQ,EAAE,mBAAmB,GAAG,mBAAmB,EAAE,CAAC;IACtD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}
1	+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/Inputs/Select/NativeSelect/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,KAAK,mBAAmB,GAAG,YAAY,CACrC,WAAW,CAAC,MAAM,CAAC,EACnB,OAAO,YAAY,CACpB,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAC1C,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,QAAQ,MAAM,EAAE,GAAG,UAAU,CAC9B,GAAG;IACF,QAAQ,EAAE,mBAAmB,GAAG,mBAAmB,EAAE,CAAC;IACtD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC"}

package/dist/src/Inputs/Select/Option/index.cjs.js CHANGED Viewed

@@ -1,7 +1,6 @@
 "use client";
 'use strict';
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 var OptionHolder = function OptionHolder(props) {
   return null;
 };

package/dist/src/Inputs/Select/Option/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../../src/Inputs/Select/Option/index.tsx"],"sourcesContent":["'use client';\n\nimport type { OptionProps, SelectValue } from '../types';\n\~~n// eslint-disable-next-line @typescript-eslint/no-unused-vars\~~nexport const OptionHolder = <T extends SelectValue>(props: OptionProps<T>) =>\n null;\n\nOptionHolder.displayName = 'Select.Option';\n"],"names":["OptionHolder"],"mappings":"~~;;;AAIA;;AACyE~~;AACnE;AAENA;;"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../../src/Inputs/Select/Option/index.tsx"],"sourcesContent":["'use client';\n\nimport type { OptionProps, SelectValue } from '../types';\n\nexport const OptionHolder = <T extends SelectValue>(props: OptionProps<T>) =>\n null;\n\nOptionHolder.displayName = 'Select.Option';\n"],"names":["OptionHolder"],"mappings":";;;;AAIyE;AACnE;AAENA;;"}

package/dist/src/Inputs/Select/Option/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/Inputs/Select/Option/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;~~AAGzD~~,eAAO,MAAM,YAAY;mCAAkC,YAAY,CAAC,CAAC;;CACnE,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/Inputs/Select/Option/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAEzD,eAAO,MAAM,YAAY;mCAAkC,YAAY,CAAC,CAAC;;CACnE,CAAC"}

package/dist/src/Inputs/Select/Option/index.esm.js CHANGED Viewed

@@ -1,5 +1,4 @@
 "use client";
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 var OptionHolder = function OptionHolder(props) {
   return null;
 };

package/dist/src/Inputs/Select/Option/index.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.esm.js","sources":["../../../../../src/Inputs/Select/Option/index.tsx"],"sourcesContent":["'use client';\n\nimport type { OptionProps, SelectValue } from '../types';\n\~~n// eslint-disable-next-line @typescript-eslint/no-unused-vars\~~nexport const OptionHolder = <T extends SelectValue>(props: OptionProps<T>) =>\n null;\n\nOptionHolder.displayName = 'Select.Option';\n"],"names":["OptionHolder"],"mappings":"~~;AAIA~~;;~~AACyE~~;AACnE;AAENA;;"}
1	+ {"version":3,"file":"index.esm.js","sources":["../../../../../src/Inputs/Select/Option/index.tsx"],"sourcesContent":["'use client';\n\nimport type { OptionProps, SelectValue } from '../types';\n\nexport const OptionHolder = <T extends SelectValue>(props: OptionProps<T>) =>\n null;\n\nOptionHolder.displayName = 'Select.Option';\n"],"names":["OptionHolder"],"mappings":";;AAIyE;AACnE;AAENA;;"}

package/dist/src/Inputs/Select/styles.cjs.js CHANGED Viewed

@@ -2,8 +2,8 @@
 'use strict';
 var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
-var styled = require('styled-components');
 var mixin = require('@remember-web/mixin');
+var styled = require('styled-components');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/dist/src/Inputs/Select/styles.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.cjs.js","sources":["../../../../src/Inputs/Select/styles.ts"],"sourcesContent":["'use client';\n\nimport ~~styled from 'styled-components';\nimport~~ {\n bg200,\n contents000,\n contents200,\n contents300,\n getTypographyStyles,\n roleRed,\n} from '@remember-web/mixin';\n\nexport const SelectContainer = styled.div<{ $width?: number \| string }>`\n ${getTypographyStyles('Body1_M')}\n color: ${contents000};\n width: ${({ $width }) => {\n if (!$width) {\n return 'fit-content';\n }\n\n if (typeof $width === 'number') {\n return `${$width}px`;\n }\n\n return $width;\n }};\n position: relative;\n user-select: none;\n\n &:focus {\n outline: none;\n border-color: ${contents000};\n }\n &[aria-disabled='true'] {\n color: ${contents200};\n border-color: ${contents300};\n background-color: ${bg200};\n }\n`;\n\nexport const SelectLabel = styled.label`\n ${getTypographyStyles('Headline4_B')}\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ${roleRed};\n }\n`;\n"],"names":[],"mappings":";;;;;;;;;;;;AAAa;AAYN;AAGoB;;AAErB;AACF;AAEA;;AAEA;AAEA;AACF;;;;"}
1	+ {"version":3,"file":"styles.cjs.js","sources":["../../../../src/Inputs/Select/styles.ts"],"sourcesContent":["'use client';\n\nimport {\n bg200,\n contents000,\n contents200,\n contents300,\n getTypographyStyles,\n roleRed,\n} from '@remember-web/mixin';\nimport styled from 'styled-components';\n\nexport const SelectContainer = styled.div<{ $width?: number \| string }>`\n ${getTypographyStyles('Body1_M')}\n color: ${contents000};\n width: ${({ $width }) => {\n if (!$width) {\n return 'fit-content';\n }\n\n if (typeof $width === 'number') {\n return `${$width}px`;\n }\n\n return $width;\n }};\n position: relative;\n user-select: none;\n\n &:focus {\n outline: none;\n border-color: ${contents000};\n }\n &[aria-disabled='true'] {\n color: ${contents200};\n border-color: ${contents300};\n background-color: ${bg200};\n }\n`;\n\nexport const SelectLabel = styled.label`\n ${getTypographyStyles('Headline4_B')}\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ${roleRed};\n }\n`;\n"],"names":[],"mappings":";;;;;;;;;;;;AAAa;AAYN;AAGoB;;AAErB;AACF;AAEA;;AAEA;AAEA;AACF;;;;"}

package/dist/src/Inputs/Select/styles.esm.js CHANGED Viewed

@@ -1,7 +1,7 @@
 "use client";
 import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
-import styled from 'styled-components';
 import { getTypographyStyles, contents000, contents200, contents300, bg200, roleRed } from '@remember-web/mixin';
+import styled from 'styled-components';
 var _templateObject, _templateObject2;
 var SelectContainer = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", "\n  color: ", ";\n  width: ", ";\n  position: relative;\n  user-select: none;\n\n  &:focus {\n    outline: none;\n    border-color: ", ";\n  }\n  &[aria-disabled='true'] {\n    color: ", ";\n    border-color: ", ";\n    background-color: ", ";\n  }\n"])), getTypographyStyles('Body1_M'), contents000, function (_ref) {

package/dist/src/Inputs/Select/styles.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.esm.js","sources":["../../../../src/Inputs/Select/styles.ts"],"sourcesContent":["'use client';\n\nimport ~~styled from 'styled-components';\nimport~~ {\n bg200,\n contents000,\n contents200,\n contents300,\n getTypographyStyles,\n roleRed,\n} from '@remember-web/mixin';\n\nexport const SelectContainer = styled.div<{ $width?: number \| string }>`\n ${getTypographyStyles('Body1_M')}\n color: ${contents000};\n width: ${({ $width }) => {\n if (!$width) {\n return 'fit-content';\n }\n\n if (typeof $width === 'number') {\n return `${$width}px`;\n }\n\n return $width;\n }};\n position: relative;\n user-select: none;\n\n &:focus {\n outline: none;\n border-color: ${contents000};\n }\n &[aria-disabled='true'] {\n color: ${contents200};\n border-color: ${contents300};\n background-color: ${bg200};\n }\n`;\n\nexport const SelectLabel = styled.label`\n ${getTypographyStyles('Headline4_B')}\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ${roleRed};\n }\n`;\n"],"names":[],"mappings":";;;;;AAAa;AAYN;AAGoB;;AAErB;AACF;AAEA;;AAEA;AAEA;AACF;;;"}
1	+ {"version":3,"file":"styles.esm.js","sources":["../../../../src/Inputs/Select/styles.ts"],"sourcesContent":["'use client';\n\nimport {\n bg200,\n contents000,\n contents200,\n contents300,\n getTypographyStyles,\n roleRed,\n} from '@remember-web/mixin';\nimport styled from 'styled-components';\n\nexport const SelectContainer = styled.div<{ $width?: number \| string }>`\n ${getTypographyStyles('Body1_M')}\n color: ${contents000};\n width: ${({ $width }) => {\n if (!$width) {\n return 'fit-content';\n }\n\n if (typeof $width === 'number') {\n return `${$width}px`;\n }\n\n return $width;\n }};\n position: relative;\n user-select: none;\n\n &:focus {\n outline: none;\n border-color: ${contents000};\n }\n &[aria-disabled='true'] {\n color: ${contents200};\n border-color: ${contents300};\n background-color: ${bg200};\n }\n`;\n\nexport const SelectLabel = styled.label`\n ${getTypographyStyles('Headline4_B')}\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ${roleRed};\n }\n`;\n"],"names":[],"mappings":";;;;;AAAa;AAYN;AAGoB;;AAErB;AACF;AAEA;;AAEA;AAEA;AACF;;;"}

package/dist/src/Inputs/TextInput/index.cjs.js CHANGED Viewed

@@ -4,8 +4,8 @@
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-var react = require('react');
 var icon = require('@remember-web/icon');
+var react = require('react');
 var styles = require('./styles.cjs.js');
 var jsxRuntime = require('react/jsx-runtime');

package/dist/src/Inputs/TextInput/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../src/Inputs/TextInput/index.tsx"],"sourcesContent":["'use client';\n\nimport ~~type~~ { ~~ForwardRefRenderFunction~~ } from '~~react~~';\nimport { ~~forwardRef,~~ ~~useId, useState~~ } from 'react';\nimport { ~~IconHidden~~, ~~IconVisible~~ } from '~~@remember-web/icon~~';\n\nimport {\n InputContainer,\n InputDecorator,\n InputError,\n InputHintText,\n InputInner,\n InputLabel,\n InputTogglePasswordVisibilityButton,\n InputWrapper,\n} from './styles';\nimport type { InputProps } from './types';\n\nconst TextInput: ForwardRefRenderFunction<HTMLInputElement, InputProps> = (\n {\n className,\n label,\n leftElement,\n rightElement,\n disabled,\n hintText,\n hintTextColor,\n errorMessage,\n width,\n ...props\n },\n ref\n) => {\n const inputId = useId();\n const labelId = useId();\n const [isVisiblePassword, setIsVisiblePassword] = useState(false);\n const isForceVisibleInput =\n props.type === 'password' &&\n props.hasTogglePasswordVisibilityButton &&\n isVisiblePassword;\n\n return (\n <InputWrapper $width={width}>\n {label && (\n <InputLabel id={labelId} htmlFor={inputId}>\n {label}\n {props.required && <mark>*</mark>}\n </InputLabel>\n )}\n <InputContainer\n disabled={disabled}\n hasError={!!errorMessage}\n className={className}\n >\n {leftElement && <InputDecorator>{leftElement}</InputDecorator>}\n <InputInner\n disabled={disabled}\n id={inputId}\n aria-labelledby={label ? labelId : undefined}\n {...props}\n type={isForceVisibleInput ? 'text' : props.type \|\| 'text'}\n ref={ref}\n />\n {hintText && (\n <InputHintText textColor={hintTextColor}>{hintText}</InputHintText>\n )}\n {props.type === 'password' &&\n props.hasTogglePasswordVisibilityButton && (\n <TogglePasswordVisibilityButton\n value={isVisiblePassword}\n onChange={setIsVisiblePassword}\n />\n )}\n {rightElement && <InputDecorator>{rightElement}</InputDecorator>}\n </InputContainer>\n {errorMessage && <InputError>{errorMessage}</InputError>}\n </InputWrapper>\n );\n};\n\nconst TogglePasswordVisibilityButton = ({\n value,\n onChange,\n}: {\n value: boolean;\n onChange: (value: boolean) => void;\n}) => (\n <InputTogglePasswordVisibilityButton\n type=\"button\"\n role=\"switch\"\n aria-checked={value ? 'true' : 'false'}\n aria-label=\"비밀번호 표시\"\n onClick={() => {\n onChange(!value);\n }}\n >\n {value ? <IconHidden size=\"small\" /> : <IconVisible size=\"small\" />}\n </InputTogglePasswordVisibilityButton>\n);\n\nexport default forwardRef(TextInput);\n"],"names":["props","isVisiblePassword","setIsVisiblePassword","$width","children","id","htmlFor","disabled","className","ref","textColor","value","onChange","type","role","size"],"mappings":";;;;;;;;;;;;;;;;;AAAa;AAAA;AAAA;AAkBb;AAcK;;;;;;;;;AAHEA;AAIL;AACA;AACA;;AAAOC;AAAmBC;AAC1B;;AAMgBC;AAAcC;AAEZC;AAAaC;AAAiBF;AAErBA;AAAO;AAAO;AAInCG;;AAEAC;AAAqBJ;AAEUA;;AAE7BG;AACAF;;AAC6C;;AAG7CI;AAAS;AAGMC;AAAyBN;AAAU;AAK9CO;AACAC;AAA+B;AAGLR;AAAc;AAAkB;AAEtCA;AAAc;AAAc;AAG9D;AAEA;AAAoC;;;AAQhCS;AACAC;AACA;AACA;;;;AAGEV;AAEmBW;AAAY;AAAmBA;;AAAe;AAC/B;AAGxC;;"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/Inputs/TextInput/index.tsx"],"sourcesContent":["'use client';\n\nimport { IconHidden, IconVisible } from '@remember-web/icon';\nimport type { ForwardRefRenderFunction } from 'react';\nimport { forwardRef, useId, useState } from 'react';\n\nimport {\n InputContainer,\n InputDecorator,\n InputError,\n InputHintText,\n InputInner,\n InputLabel,\n InputTogglePasswordVisibilityButton,\n InputWrapper,\n} from './styles';\nimport type { InputProps } from './types';\n\nconst TextInput: ForwardRefRenderFunction<HTMLInputElement, InputProps> = (\n {\n className,\n label,\n leftElement,\n rightElement,\n disabled,\n hintText,\n hintTextColor,\n errorMessage,\n width,\n ...props\n },\n ref\n) => {\n const inputId = useId();\n const labelId = useId();\n const [isVisiblePassword, setIsVisiblePassword] = useState(false);\n const isForceVisibleInput =\n props.type === 'password' &&\n props.hasTogglePasswordVisibilityButton &&\n isVisiblePassword;\n\n return (\n <InputWrapper $width={width}>\n {label && (\n <InputLabel id={labelId} htmlFor={inputId}>\n {label}\n {props.required && <mark>*</mark>}\n </InputLabel>\n )}\n <InputContainer\n disabled={disabled}\n hasError={!!errorMessage}\n className={className}\n >\n {leftElement && <InputDecorator>{leftElement}</InputDecorator>}\n <InputInner\n disabled={disabled}\n id={inputId}\n aria-labelledby={label ? labelId : undefined}\n {...props}\n type={isForceVisibleInput ? 'text' : props.type \|\| 'text'}\n ref={ref}\n />\n {hintText && (\n <InputHintText textColor={hintTextColor}>{hintText}</InputHintText>\n )}\n {props.type === 'password' &&\n props.hasTogglePasswordVisibilityButton && (\n <TogglePasswordVisibilityButton\n value={isVisiblePassword}\n onChange={setIsVisiblePassword}\n />\n )}\n {rightElement && <InputDecorator>{rightElement}</InputDecorator>}\n </InputContainer>\n {errorMessage && <InputError>{errorMessage}</InputError>}\n </InputWrapper>\n );\n};\n\nconst TogglePasswordVisibilityButton = ({\n value,\n onChange,\n}: {\n value: boolean;\n onChange: (value: boolean) => void;\n}) => (\n <InputTogglePasswordVisibilityButton\n type=\"button\"\n role=\"switch\"\n aria-checked={value ? 'true' : 'false'}\n aria-label=\"비밀번호 표시\"\n onClick={() => {\n onChange(!value);\n }}\n >\n {value ? <IconHidden size=\"small\" /> : <IconVisible size=\"small\" />}\n </InputTogglePasswordVisibilityButton>\n);\n\nexport default forwardRef(TextInput);\n"],"names":["props","isVisiblePassword","setIsVisiblePassword","$width","children","id","htmlFor","disabled","className","ref","textColor","value","onChange","type","role","size"],"mappings":";;;;;;;;;;;;;;;;;AAAa;AAAA;AAAA;AAkBb;AAcK;;;;;;;;;AAHEA;AAIL;AACA;AACA;;AAAOC;AAAmBC;AAC1B;;AAMgBC;AAAcC;AAEZC;AAAaC;AAAiBF;AAErBA;AAAO;AAAO;AAInCG;;AAEAC;AAAqBJ;AAEUA;;AAE7BG;AACAF;;AAC6C;;AAG7CI;AAAS;AAGMC;AAAyBN;AAAU;AAK9CO;AACAC;AAA+B;AAGLR;AAAc;AAAkB;AAEtCA;AAAc;AAAc;AAG9D;AAEA;AAAoC;;;AAQhCS;AACAC;AACA;AACA;;;;AAGEV;AAEmBW;AAAY;AAAmBA;;AAAe;AAC/B;AAGxC;;"}

package/dist/src/Inputs/TextInput/index.esm.js CHANGED Viewed

@@ -2,8 +2,8 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { forwardRef, useId, useState } from 'react';
 import { IconHidden, IconVisible } from '@remember-web/icon';
+import { forwardRef, useId, useState } from 'react';
 import { InputWrapper, InputLabel, InputContainer, InputDecorator, InputInner, InputHintText, InputError, InputTogglePasswordVisibilityButton } from './styles.esm.js';
 import { jsxs, jsx } from 'react/jsx-runtime';

package/dist/src/Inputs/TextInput/index.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.esm.js","sources":["../../../../src/Inputs/TextInput/index.tsx"],"sourcesContent":["'use client';\n\nimport ~~type~~ { ~~ForwardRefRenderFunction~~ } from '~~react~~';\nimport { ~~forwardRef,~~ ~~useId, useState~~ } from 'react';\nimport { ~~IconHidden~~, ~~IconVisible~~ } from '~~@remember-web/icon~~';\n\nimport {\n InputContainer,\n InputDecorator,\n InputError,\n InputHintText,\n InputInner,\n InputLabel,\n InputTogglePasswordVisibilityButton,\n InputWrapper,\n} from './styles';\nimport type { InputProps } from './types';\n\nconst TextInput: ForwardRefRenderFunction<HTMLInputElement, InputProps> = (\n {\n className,\n label,\n leftElement,\n rightElement,\n disabled,\n hintText,\n hintTextColor,\n errorMessage,\n width,\n ...props\n },\n ref\n) => {\n const inputId = useId();\n const labelId = useId();\n const [isVisiblePassword, setIsVisiblePassword] = useState(false);\n const isForceVisibleInput =\n props.type === 'password' &&\n props.hasTogglePasswordVisibilityButton &&\n isVisiblePassword;\n\n return (\n <InputWrapper $width={width}>\n {label && (\n <InputLabel id={labelId} htmlFor={inputId}>\n {label}\n {props.required && <mark>*</mark>}\n </InputLabel>\n )}\n <InputContainer\n disabled={disabled}\n hasError={!!errorMessage}\n className={className}\n >\n {leftElement && <InputDecorator>{leftElement}</InputDecorator>}\n <InputInner\n disabled={disabled}\n id={inputId}\n aria-labelledby={label ? labelId : undefined}\n {...props}\n type={isForceVisibleInput ? 'text' : props.type \|\| 'text'}\n ref={ref}\n />\n {hintText && (\n <InputHintText textColor={hintTextColor}>{hintText}</InputHintText>\n )}\n {props.type === 'password' &&\n props.hasTogglePasswordVisibilityButton && (\n <TogglePasswordVisibilityButton\n value={isVisiblePassword}\n onChange={setIsVisiblePassword}\n />\n )}\n {rightElement && <InputDecorator>{rightElement}</InputDecorator>}\n </InputContainer>\n {errorMessage && <InputError>{errorMessage}</InputError>}\n </InputWrapper>\n );\n};\n\nconst TogglePasswordVisibilityButton = ({\n value,\n onChange,\n}: {\n value: boolean;\n onChange: (value: boolean) => void;\n}) => (\n <InputTogglePasswordVisibilityButton\n type=\"button\"\n role=\"switch\"\n aria-checked={value ? 'true' : 'false'}\n aria-label=\"비밀번호 표시\"\n onClick={() => {\n onChange(!value);\n }}\n >\n {value ? <IconHidden size=\"small\" /> : <IconVisible size=\"small\" />}\n </InputTogglePasswordVisibilityButton>\n);\n\nexport default forwardRef(TextInput);\n"],"names":["props","isVisiblePassword","setIsVisiblePassword","$width","children","id","htmlFor","disabled","className","ref","textColor","value","onChange","type","role","size"],"mappings":";;;;;;;;;AAAa;AAAA;AAAA;AAkBb;AAcK;;;;;;;;;AAHEA;AAIL;AACA;AACA;;AAAOC;AAAmBC;AAC1B;;AAMgBC;AAAcC;AAEZC;AAAaC;AAAiBF;AAErBA;AAAO;AAAO;AAInCG;;AAEAC;AAAqBJ;AAEUA;;AAE7BG;AACAF;;AAC6C;;AAG7CI;AAAS;AAGMC;AAAyBN;AAAU;AAK9CO;AACAC;AAA+B;AAGLR;AAAc;AAAkB;AAEtCA;AAAc;AAAc;AAG9D;AAEA;AAAoC;;;AAQhCS;AACAC;AACA;AACA;;;;AAGEV;AAEmBW;AAAY;AAAmBA;;AAAe;AAC/B;AAGxC;;"}
1	+ {"version":3,"file":"index.esm.js","sources":["../../../../src/Inputs/TextInput/index.tsx"],"sourcesContent":["'use client';\n\nimport { IconHidden, IconVisible } from '@remember-web/icon';\nimport type { ForwardRefRenderFunction } from 'react';\nimport { forwardRef, useId, useState } from 'react';\n\nimport {\n InputContainer,\n InputDecorator,\n InputError,\n InputHintText,\n InputInner,\n InputLabel,\n InputTogglePasswordVisibilityButton,\n InputWrapper,\n} from './styles';\nimport type { InputProps } from './types';\n\nconst TextInput: ForwardRefRenderFunction<HTMLInputElement, InputProps> = (\n {\n className,\n label,\n leftElement,\n rightElement,\n disabled,\n hintText,\n hintTextColor,\n errorMessage,\n width,\n ...props\n },\n ref\n) => {\n const inputId = useId();\n const labelId = useId();\n const [isVisiblePassword, setIsVisiblePassword] = useState(false);\n const isForceVisibleInput =\n props.type === 'password' &&\n props.hasTogglePasswordVisibilityButton &&\n isVisiblePassword;\n\n return (\n <InputWrapper $width={width}>\n {label && (\n <InputLabel id={labelId} htmlFor={inputId}>\n {label}\n {props.required && <mark>*</mark>}\n </InputLabel>\n )}\n <InputContainer\n disabled={disabled}\n hasError={!!errorMessage}\n className={className}\n >\n {leftElement && <InputDecorator>{leftElement}</InputDecorator>}\n <InputInner\n disabled={disabled}\n id={inputId}\n aria-labelledby={label ? labelId : undefined}\n {...props}\n type={isForceVisibleInput ? 'text' : props.type \|\| 'text'}\n ref={ref}\n />\n {hintText && (\n <InputHintText textColor={hintTextColor}>{hintText}</InputHintText>\n )}\n {props.type === 'password' &&\n props.hasTogglePasswordVisibilityButton && (\n <TogglePasswordVisibilityButton\n value={isVisiblePassword}\n onChange={setIsVisiblePassword}\n />\n )}\n {rightElement && <InputDecorator>{rightElement}</InputDecorator>}\n </InputContainer>\n {errorMessage && <InputError>{errorMessage}</InputError>}\n </InputWrapper>\n );\n};\n\nconst TogglePasswordVisibilityButton = ({\n value,\n onChange,\n}: {\n value: boolean;\n onChange: (value: boolean) => void;\n}) => (\n <InputTogglePasswordVisibilityButton\n type=\"button\"\n role=\"switch\"\n aria-checked={value ? 'true' : 'false'}\n aria-label=\"비밀번호 표시\"\n onClick={() => {\n onChange(!value);\n }}\n >\n {value ? <IconHidden size=\"small\" /> : <IconVisible size=\"small\" />}\n </InputTogglePasswordVisibilityButton>\n);\n\nexport default forwardRef(TextInput);\n"],"names":["props","isVisiblePassword","setIsVisiblePassword","$width","children","id","htmlFor","disabled","className","ref","textColor","value","onChange","type","role","size"],"mappings":";;;;;;;;;AAAa;AAAA;AAAA;AAkBb;AAcK;;;;;;;;;AAHEA;AAIL;AACA;AACA;;AAAOC;AAAmBC;AAC1B;;AAMgBC;AAAcC;AAEZC;AAAaC;AAAiBF;AAErBA;AAAO;AAAO;AAInCG;;AAEAC;AAAqBJ;AAEUA;;AAE7BG;AACAF;;AAC6C;;AAG7CI;AAAS;AAGMC;AAAyBN;AAAU;AAK9CO;AACAC;AAA+B;AAGLR;AAAc;AAAkB;AAEtCA;AAAc;AAAc;AAG9D;AAEA;AAAoC;;;AAQhCS;AACAC;AACA;AACA;;;;AAGEV;AAEmBW;AAAY;AAAmBA;;AAAe;AAC/B;AAGxC;;"}

package/dist/src/Inputs/TextInput/styles.cjs.js CHANGED Viewed

@@ -2,9 +2,9 @@
 'use strict';
 var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
-var styled = require('styled-components');
 var mixin = require('@remember-web/mixin');
 var shared = require('@remember-web/shared');
+var styled = require('styled-components');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/dist/src/Inputs/TextInput/styles.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.cjs.js","sources":["../../../../src/Inputs/TextInput/styles.ts"],"sourcesContent":["'use client';\n\nimport ~~styled, { css } from 'styled-components';\nimport~~ type { ColorVariable } from '@remember-web/mixin';\nimport {\n bg200,\n contents000,\n contents200,\n contents300,\n ~~roleRed~~,\n ~~ellipsis~~,\n ~~getTypographyStyles~~,\n} from '@remember-web/mixin';\nimport { formatUnit } from '@remember-web/shared';\n\nexport const InputWrapper = styled.div<{ $width?: string \| number }>`\n ${({ $width }) =>\n $width &&\n css`\n width: ${formatUnit($width)};\n `};\n`;\n\nexport const InputContainer = styled.div<{\n disabled?: boolean;\n hasError?: boolean;\n}>`\n display: flex;\n align-items: center;\n border: 1px solid ${contents300};\n border-radius: 4px;\n padding: 0 12px;\n gap: 8px;\n\n transition:\n border-color 0.2s,\n background-color 0.2s;\n\n ${({ hasError, disabled }) => [\n hasError\n ? css`\n border-color: ${roleRed};\n `\n : css`\n &:focus-within {\n border-color: ${contents000};\n }\n `,\n disabled &&\n css`\n background-color: ${bg200};\n `,\n ]}\n`;\n\nexport const InputDecorator = styled.div`\n flex-shrink: 0;\n /* Inline요소가 들어오면 강제로 block으로 처리 (중앙정렬을 위해) /\n > {\n display: block;\n }\n`;\n\nexport const InputInner = styled.input`\n ${getTypographyStyles('Body1_M')}\n color: ${contents000};\n\n display: block;\n flex-grow: 1;\n width: 100%;\n padding: 10px 0;\n border: 0;\n background-color: transparent;\n\n &:placeholder-shown {\n ${ellipsis()}\n }\n\n &::placeholder {\n color: ${contents200};\n }\n\n &:focus {\n outline: none;\n }\n`;\n\nexport const InputLabel = styled.label`\n ${getTypographyStyles('Headline4_B')}\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ${roleRed};\n }\n`;\n\nexport const InputError = styled.div`\n ${getTypographyStyles('Body2_M')}\n color: ${roleRed};\n\n margin-top: 8px;\n`;\n\nexport const InputHintText = styled.span<{ textColor?: ColorVariable }>`\n ${getTypographyStyles('Body1_M')}\n color: ${({ textColor }) => textColor};\n white-space: nowrap;\n`;\n\nexport const InputTogglePasswordVisibilityButton = styled.button`\n all: unset;\n appearance: none;\n cursor: pointer;\n flex-shrink: 0;\n\n & > svg {\n display: block;\n }\n`;\n"],"names":["InputWrapper","InputDecorator","InputTogglePasswordVisibilityButton"],"mappings":";;;;;;;;;;;;;AAAa;AAeAA;AACT;AAAS;AAIR;;AAkBD;;AAAqB;AActB;AAGUC;AAQN;;;;AA+CI;AAAY;AAAgB;AAI1BC;;;;;;;;;"}
1	+ {"version":3,"file":"styles.cjs.js","sources":["../../../../src/Inputs/TextInput/styles.ts"],"sourcesContent":["'use client';\n\nimport type { ColorVariable } from '@remember-web/mixin';\nimport {\n bg200,\n contents000,\n contents200,\n contents300,\n ellipsis,\n getTypographyStyles,\n roleRed,\n} from '@remember-web/mixin';\nimport { formatUnit } from '@remember-web/shared';\nimport styled, { css } from 'styled-components';\n\nexport const InputWrapper = styled.div<{ $width?: string \| number }>`\n ${({ $width }) =>\n $width &&\n css`\n width: ${formatUnit($width)};\n `};\n`;\n\nexport const InputContainer = styled.div<{\n disabled?: boolean;\n hasError?: boolean;\n}>`\n display: flex;\n align-items: center;\n border: 1px solid ${contents300};\n border-radius: 4px;\n padding: 0 12px;\n gap: 8px;\n\n transition:\n border-color 0.2s,\n background-color 0.2s;\n\n ${({ hasError, disabled }) => [\n hasError\n ? css`\n border-color: ${roleRed};\n `\n : css`\n &:focus-within {\n border-color: ${contents000};\n }\n `,\n disabled &&\n css`\n background-color: ${bg200};\n `,\n ]}\n`;\n\nexport const InputDecorator = styled.div`\n flex-shrink: 0;\n /* Inline요소가 들어오면 강제로 block으로 처리 (중앙정렬을 위해) /\n > {\n display: block;\n }\n`;\n\nexport const InputInner = styled.input`\n ${getTypographyStyles('Body1_M')}\n color: ${contents000};\n\n display: block;\n flex-grow: 1;\n width: 100%;\n padding: 10px 0;\n border: 0;\n background-color: transparent;\n\n &:placeholder-shown {\n ${ellipsis()}\n }\n\n &::placeholder {\n color: ${contents200};\n }\n\n &:focus {\n outline: none;\n }\n`;\n\nexport const InputLabel = styled.label`\n ${getTypographyStyles('Headline4_B')}\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ${roleRed};\n }\n`;\n\nexport const InputError = styled.div`\n ${getTypographyStyles('Body2_M')}\n color: ${roleRed};\n\n margin-top: 8px;\n`;\n\nexport const InputHintText = styled.span<{ textColor?: ColorVariable }>`\n ${getTypographyStyles('Body1_M')}\n color: ${({ textColor }) => textColor};\n white-space: nowrap;\n`;\n\nexport const InputTogglePasswordVisibilityButton = styled.button`\n all: unset;\n appearance: none;\n cursor: pointer;\n flex-shrink: 0;\n\n & > svg {\n display: block;\n }\n`;\n"],"names":["InputWrapper","InputDecorator","InputTogglePasswordVisibilityButton"],"mappings":";;;;;;;;;;;;;AAAa;AAeAA;AACT;AAAS;AAIR;;AAkBD;;AAAqB;AActB;AAGUC;AAQN;;;;AA+CI;AAAY;AAAgB;AAI1BC;;;;;;;;;"}

package/dist/src/Inputs/TextInput/styles.esm.js CHANGED Viewed

@@ -1,8 +1,8 @@
 "use client";
 import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
-import styled, { css } from 'styled-components';
 import { contents300, roleRed, contents000, bg200, getTypographyStyles, ellipsis, contents200 } from '@remember-web/mixin';
 import { formatUnit } from '@remember-web/shared';
+import styled, { css } from 'styled-components';
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
 var InputWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  ", ";\n"])), function (_ref) {

package/dist/src/Inputs/TextInput/styles.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.esm.js","sources":["../../../../src/Inputs/TextInput/styles.ts"],"sourcesContent":["'use client';\n\nimport ~~styled, { css } from 'styled-components';\nimport~~ type { ColorVariable } from '@remember-web/mixin';\nimport {\n bg200,\n contents000,\n contents200,\n contents300,\n ~~roleRed~~,\n ~~ellipsis~~,\n ~~getTypographyStyles~~,\n} from '@remember-web/mixin';\nimport { formatUnit } from '@remember-web/shared';\n\nexport const InputWrapper = styled.div<{ $width?: string \| number }>`\n ${({ $width }) =>\n $width &&\n css`\n width: ${formatUnit($width)};\n `};\n`;\n\nexport const InputContainer = styled.div<{\n disabled?: boolean;\n hasError?: boolean;\n}>`\n display: flex;\n align-items: center;\n border: 1px solid ${contents300};\n border-radius: 4px;\n padding: 0 12px;\n gap: 8px;\n\n transition:\n border-color 0.2s,\n background-color 0.2s;\n\n ${({ hasError, disabled }) => [\n hasError\n ? css`\n border-color: ${roleRed};\n `\n : css`\n &:focus-within {\n border-color: ${contents000};\n }\n `,\n disabled &&\n css`\n background-color: ${bg200};\n `,\n ]}\n`;\n\nexport const InputDecorator = styled.div`\n flex-shrink: 0;\n /* Inline요소가 들어오면 강제로 block으로 처리 (중앙정렬을 위해) /\n > {\n display: block;\n }\n`;\n\nexport const InputInner = styled.input`\n ${getTypographyStyles('Body1_M')}\n color: ${contents000};\n\n display: block;\n flex-grow: 1;\n width: 100%;\n padding: 10px 0;\n border: 0;\n background-color: transparent;\n\n &:placeholder-shown {\n ${ellipsis()}\n }\n\n &::placeholder {\n color: ${contents200};\n }\n\n &:focus {\n outline: none;\n }\n`;\n\nexport const InputLabel = styled.label`\n ${getTypographyStyles('Headline4_B')}\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ${roleRed};\n }\n`;\n\nexport const InputError = styled.div`\n ${getTypographyStyles('Body2_M')}\n color: ${roleRed};\n\n margin-top: 8px;\n`;\n\nexport const InputHintText = styled.span<{ textColor?: ColorVariable }>`\n ${getTypographyStyles('Body1_M')}\n color: ${({ textColor }) => textColor};\n white-space: nowrap;\n`;\n\nexport const InputTogglePasswordVisibilityButton = styled.button`\n all: unset;\n appearance: none;\n cursor: pointer;\n flex-shrink: 0;\n\n & > svg {\n display: block;\n }\n`;\n"],"names":["InputWrapper","InputDecorator","InputTogglePasswordVisibilityButton"],"mappings":";;;;;;AAAa;AAeAA;AACT;AAAS;AAIR;;AAkBD;;AAAqB;AActB;AAGUC;AAQN;;;;AA+CI;AAAY;AAAgB;AAI1BC;;"}
1	+ {"version":3,"file":"styles.esm.js","sources":["../../../../src/Inputs/TextInput/styles.ts"],"sourcesContent":["'use client';\n\nimport type { ColorVariable } from '@remember-web/mixin';\nimport {\n bg200,\n contents000,\n contents200,\n contents300,\n ellipsis,\n getTypographyStyles,\n roleRed,\n} from '@remember-web/mixin';\nimport { formatUnit } from '@remember-web/shared';\nimport styled, { css } from 'styled-components';\n\nexport const InputWrapper = styled.div<{ $width?: string \| number }>`\n ${({ $width }) =>\n $width &&\n css`\n width: ${formatUnit($width)};\n `};\n`;\n\nexport const InputContainer = styled.div<{\n disabled?: boolean;\n hasError?: boolean;\n}>`\n display: flex;\n align-items: center;\n border: 1px solid ${contents300};\n border-radius: 4px;\n padding: 0 12px;\n gap: 8px;\n\n transition:\n border-color 0.2s,\n background-color 0.2s;\n\n ${({ hasError, disabled }) => [\n hasError\n ? css`\n border-color: ${roleRed};\n `\n : css`\n &:focus-within {\n border-color: ${contents000};\n }\n `,\n disabled &&\n css`\n background-color: ${bg200};\n `,\n ]}\n`;\n\nexport const InputDecorator = styled.div`\n flex-shrink: 0;\n /* Inline요소가 들어오면 강제로 block으로 처리 (중앙정렬을 위해) /\n > {\n display: block;\n }\n`;\n\nexport const InputInner = styled.input`\n ${getTypographyStyles('Body1_M')}\n color: ${contents000};\n\n display: block;\n flex-grow: 1;\n width: 100%;\n padding: 10px 0;\n border: 0;\n background-color: transparent;\n\n &:placeholder-shown {\n ${ellipsis()}\n }\n\n &::placeholder {\n color: ${contents200};\n }\n\n &:focus {\n outline: none;\n }\n`;\n\nexport const InputLabel = styled.label`\n ${getTypographyStyles('Headline4_B')}\n display: block;\n margin-bottom: 12px;\n display: flex;\n align-items: center;\n gap: 4px;\n\n & > mark {\n all: unset;\n color: ${roleRed};\n }\n`;\n\nexport const InputError = styled.div`\n ${getTypographyStyles('Body2_M')}\n color: ${roleRed};\n\n margin-top: 8px;\n`;\n\nexport const InputHintText = styled.span<{ textColor?: ColorVariable }>`\n ${getTypographyStyles('Body1_M')}\n color: ${({ textColor }) => textColor};\n white-space: nowrap;\n`;\n\nexport const InputTogglePasswordVisibilityButton = styled.button`\n all: unset;\n appearance: none;\n cursor: pointer;\n flex-shrink: 0;\n\n & > svg {\n display: block;\n }\n`;\n"],"names":["InputWrapper","InputDecorator","InputTogglePasswordVisibilityButton"],"mappings":";;;;;;AAAa;AAeAA;AACT;AAAS;AAIR;;AAkBD;;AAAqB;AActB;AAGUC;AAQN;;;;AA+CI;AAAY;AAAgB;AAI1BC;;"}

package/dist/src/Inputs/TextInput/types.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import type { InputHTMLAttributes, ReactNode } from 'react';
 import type { ColorVariable } from '@remember-web/mixin';
+import type { InputHTMLAttributes, ReactNode } from 'react';
 type BaseInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, `aria-${string}`>;
 type TextInputProps = {
     type?: 'text' | 'number' | 'email' | 'search' | 'tel' | 'url' | 'date' | 'datetime-local';

package/dist/src/Inputs/TextInput/types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/Inputs/TextInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,~~mBAAmB~~,EAAE,~~SAAS,EAAE,~~MAAM,~~OAAO~~,CAAC;~~AAC5D~~,OAAO,KAAK,EAAE,~~aAAa~~,EAAE,MAAM,~~qBAAqB~~,CAAC;~~AAEzD~~,KAAK,cAAc,GAAG,IAAI,CACxB,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,QAAQ,MAAM,EAAE,CACjB,CAAC;AAEF,KAAK,cAAc,GAAG;IACpB,IAAI,CAAC,EACD,MAAM,GACN,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,KAAK,GACL,KAAK,GACL,MAAM,GACN,gBAAgB,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,KAAK,kBAAkB,GAAG,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,GAAG;IACvD,IAAI,EAAE,UAAU,CAAC;IACjB,iCAAiC,EAAE,OAAO,CAAC;CAC5C,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,cAAc,GAAG,CAAC,cAAc,GAAG,kBAAkB,CAAC,CAAC"}
1	+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/Inputs/TextInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,KAAK,EAAE,mBAAmB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE5D,KAAK,cAAc,GAAG,IAAI,CACxB,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,QAAQ,MAAM,EAAE,CACjB,CAAC;AAEF,KAAK,cAAc,GAAG;IACpB,IAAI,CAAC,EACD,MAAM,GACN,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,KAAK,GACL,KAAK,GACL,MAAM,GACN,gBAAgB,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,KAAK,kBAAkB,GAAG,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,GAAG;IACvD,IAAI,EAAE,UAAU,CAAC;IACjB,iCAAiC,EAAE,OAAO,CAAC;CAC5C,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,cAAc,GAAG,CAAC,cAAc,GAAG,kBAAkB,CAAC,CAAC"}

package/dist/src/Logos/RememberServiceLogo/index.cjs.js CHANGED Viewed

@@ -9,6 +9,7 @@ require('@remember-web/icon');
 require('../../Common/Spinner/styles.cjs.js');
 var jsxRuntime = require('react/jsx-runtime');
 require('react');
+require('../../Common/Skeleton/styles.cjs.js');
 require('../../Common/Typography/styles.cjs.js');
 var index = require('../RememberLogo/index.cjs.js');
 var style = require('./style.cjs.js');

package/dist/src/Logos/RememberServiceLogo/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../src/Logos/RememberServiceLogo/index.tsx"],"sourcesContent":["import type { GetStyledComponentProps } from '@remember-web/shared';\n\nimport ~~type~~ { ~~RememberLogoProps~~ } from '@/~~Logos/types~~';\nimport { ~~Divider~~ } from '@/~~Common~~';\n\nimport { RememberLogo } from '../RememberLogo';\nimport { StyledServiceLogoRoot } from './style';\n\nexport type GnbNaviLogoProps<As> = GetStyledComponentProps<\n typeof StyledServiceLogoRoot,\n As\n> & {\n label?: string;\n color?: RememberLogoProps['color'];\n};\n\nexport const RememberServiceLogo = <As,>({\n label,\n color = 'black',\n ...props\n}: GnbNaviLogoProps<As>) => (\n <StyledServiceLogoRoot $color={color} {...props}>\n <RememberLogo color={color} />\n {label && (\n <>\n <Divider decorative orientation=\"vertical\" style={{ height: '15px' }} />\n <b>{label}</b>\n </>\n )}\n </StyledServiceLogoRoot>\n);\n"],"names":["RememberServiceLogo","_ref","label","_ref$color","color","props","_objectWithoutProperties","_excluded","_jsxs","StyledServiceLogoRoot","_objectSpread","$color","children","_jsx","RememberLogo","_Fragment","Divider","decorative","orientation","style","height"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;~~IAgBaA,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAC9BC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAAC,UAAA,GAAAF,IAAA,CACLG,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAG,KAAA,CAAA,GAAA,OAAO,GAAAA,UAAA;AACZE,IAAAA,KAAK,GAAAC,yCAAA,CAAAL,IAAA,EAAAM,SAAA,CAAA,CAAA;AAAA,EAAA,oBAERC,eAAA,CAACC,2BAAqB,EAAAC,aAAA,CAAAA,aAAA,CAAA;AAACC,IAAAA,MAAM,EAAEP,KAAAA;AAAM,GAAA,EAAKC,KAAK,CAAA,EAAA,EAAA,EAAA;IAAAO,QAAA,EAAA,cAC7CC,cAAA,CAACC,kBAAY,EAAA;AAACV,MAAAA,KAAK,EAAEA,KAAAA;AAAM,KAAE,CAAC,EAC7BF,KAAK,iBACJM,eAAA,CAAAO,mBAAA,EAAA;MAAAH,QAAA,EAAA,cACEC,cAAA,CAACG,eAAO,EAAA;QAACC,UAAU,EAAA,IAAA;AAACC,QAAAA,WAAW,EAAC,UAAU;AAACC,QAAAA,KAAK,EAAE;AAAEC,UAAAA,MAAM,EAAE,MAAA;AAAO,SAAA;OAAI,CAAC,eACxEP,cAAA,CAAA,GAAA,EAAA;AAAAD,QAAAA,QAAA,EAAIV,KAAAA;AAAK,OAAI,CAAC,CAAA;AAAA,KACd,CACH,CAAA;AAAA,GAAA,CACoB,CAAC,CAAA;AAAA;;;;"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/Logos/RememberServiceLogo/index.tsx"],"sourcesContent":["import type { GetStyledComponentProps } from '@remember-web/shared';\n\nimport { Divider } from '@/Common';\nimport type { RememberLogoProps } from '@/Logos/types';\n\nimport { RememberLogo } from '../RememberLogo';\nimport { StyledServiceLogoRoot } from './style';\n\nexport type GnbNaviLogoProps<As> = GetStyledComponentProps<\n typeof StyledServiceLogoRoot,\n As\n> & {\n label?: string;\n color?: RememberLogoProps['color'];\n};\n\nexport const RememberServiceLogo = <As,>({\n label,\n color = 'black',\n ...props\n}: GnbNaviLogoProps<As>) => (\n <StyledServiceLogoRoot $color={color} {...props}>\n <RememberLogo color={color} />\n {label && (\n <>\n <Divider decorative orientation=\"vertical\" style={{ height: '15px' }} />\n <b>{label}</b>\n </>\n )}\n </StyledServiceLogoRoot>\n);\n"],"names":["RememberServiceLogo","_ref","label","_ref$color","color","props","_objectWithoutProperties","_excluded","_jsxs","StyledServiceLogoRoot","_objectSpread","$color","children","_jsx","RememberLogo","_Fragment","Divider","decorative","orientation","style","height"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;IAgBaA,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAC9BC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAAC,UAAA,GAAAF,IAAA,CACLG,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAG,KAAA,CAAA,GAAA,OAAO,GAAAA,UAAA;AACZE,IAAAA,KAAK,GAAAC,yCAAA,CAAAL,IAAA,EAAAM,SAAA,CAAA,CAAA;AAAA,EAAA,oBAERC,eAAA,CAACC,2BAAqB,EAAAC,aAAA,CAAAA,aAAA,CAAA;AAACC,IAAAA,MAAM,EAAEP,KAAAA;AAAM,GAAA,EAAKC,KAAK,CAAA,EAAA,EAAA,EAAA;IAAAO,QAAA,EAAA,cAC7CC,cAAA,CAACC,kBAAY,EAAA;AAACV,MAAAA,KAAK,EAAEA,KAAAA;AAAM,KAAE,CAAC,EAC7BF,KAAK,iBACJM,eAAA,CAAAO,mBAAA,EAAA;MAAAH,QAAA,EAAA,cACEC,cAAA,CAACG,eAAO,EAAA;QAACC,UAAU,EAAA,IAAA;AAACC,QAAAA,WAAW,EAAC,UAAU;AAACC,QAAAA,KAAK,EAAE;AAAEC,UAAAA,MAAM,EAAE,MAAA;AAAO,SAAA;OAAI,CAAC,eACxEP,cAAA,CAAA,GAAA,EAAA;AAAAD,QAAAA,QAAA,EAAIV,KAAAA;AAAK,OAAI,CAAC,CAAA;AAAA,KACd,CACH,CAAA;AAAA,GAAA,CACoB,CAAC,CAAA;AAAA;;;;"}

package/dist/src/Logos/RememberServiceLogo/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/Logos/RememberServiceLogo/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;~~AAEpE~~,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;~~AAIvD~~,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAEhD,MAAM,MAAM,gBAAgB,CAAC,EAAE,IAAI,uBAAuB,CACxD,OAAO,qBAAqB,EAC5B,EAAE,CACH,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;CACpC,CAAC;AAEF,eAAO,MAAM,mBAAmB,mCAI7B,iBAAiB,EAAE,CAAC,4CAUtB,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/Logos/RememberServiceLogo/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AAGpE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAGvD,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAEhD,MAAM,MAAM,gBAAgB,CAAC,EAAE,IAAI,uBAAuB,CACxD,OAAO,qBAAqB,EAC5B,EAAE,CACH,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;CACpC,CAAC;AAEF,eAAO,MAAM,mBAAmB,mCAI7B,iBAAiB,EAAE,CAAC,4CAUtB,CAAC"}

package/dist/src/Logos/RememberServiceLogo/index.esm.js CHANGED Viewed

@@ -7,6 +7,7 @@ import '@remember-web/icon';
 import '../../Common/Spinner/styles.esm.js';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import 'react';
+import '../../Common/Skeleton/styles.esm.js';
 import '../../Common/Typography/styles.esm.js';
 import { RememberLogo } from '../RememberLogo/index.esm.js';
 import { StyledServiceLogoRoot } from './style.esm.js';

package/dist/src/Logos/RememberServiceLogo/index.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.esm.js","sources":["../../../../src/Logos/RememberServiceLogo/index.tsx"],"sourcesContent":["import type { GetStyledComponentProps } from '@remember-web/shared';\n\nimport ~~type~~ { ~~RememberLogoProps~~ } from '@/~~Logos/types~~';\nimport { ~~Divider~~ } from '@/~~Common~~';\n\nimport { RememberLogo } from '../RememberLogo';\nimport { StyledServiceLogoRoot } from './style';\n\nexport type GnbNaviLogoProps<As> = GetStyledComponentProps<\n typeof StyledServiceLogoRoot,\n As\n> & {\n label?: string;\n color?: RememberLogoProps['color'];\n};\n\nexport const RememberServiceLogo = <As,>({\n label,\n color = 'black',\n ...props\n}: GnbNaviLogoProps<As>) => (\n <StyledServiceLogoRoot $color={color} {...props}>\n <RememberLogo color={color} />\n {label && (\n <>\n <Divider decorative orientation=\"vertical\" style={{ height: '15px' }} />\n <b>{label}</b>\n </>\n )}\n </StyledServiceLogoRoot>\n);\n"],"names":["RememberServiceLogo","_ref","label","_ref$color","color","props","_objectWithoutProperties","_excluded","_jsxs","StyledServiceLogoRoot","_objectSpread","$color","children","_jsx","RememberLogo","_Fragment","Divider","decorative","orientation","style","height"],"mappings":"~~;;;;;;;;;;;;;;;;~~IAgBaA,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAC9BC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAAC,UAAA,GAAAF,IAAA,CACLG,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAG,KAAA,CAAA,GAAA,OAAO,GAAAA,UAAA;AACZE,IAAAA,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA,CAAA,CAAA;AAAA,EAAA,oBAERC,IAAA,CAACC,qBAAqB,EAAAC,aAAA,CAAAA,aAAA,CAAA;AAACC,IAAAA,MAAM,EAAEP,KAAAA;AAAM,GAAA,EAAKC,KAAK,CAAA,EAAA,EAAA,EAAA;IAAAO,QAAA,EAAA,cAC7CC,GAAA,CAACC,YAAY,EAAA;AAACV,MAAAA,KAAK,EAAEA,KAAAA;AAAM,KAAE,CAAC,EAC7BF,KAAK,iBACJM,IAAA,CAAAO,QAAA,EAAA;MAAAH,QAAA,EAAA,cACEC,GAAA,CAACG,OAAO,EAAA;QAACC,UAAU,EAAA,IAAA;AAACC,QAAAA,WAAW,EAAC,UAAU;AAACC,QAAAA,KAAK,EAAE;AAAEC,UAAAA,MAAM,EAAE,MAAA;AAAO,SAAA;OAAI,CAAC,eACxEP,GAAA,CAAA,GAAA,EAAA;AAAAD,QAAAA,QAAA,EAAIV,KAAAA;AAAK,OAAI,CAAC,CAAA;AAAA,KACd,CACH,CAAA;AAAA,GAAA,CACoB,CAAC,CAAA;AAAA;;;;"}
1	+ {"version":3,"file":"index.esm.js","sources":["../../../../src/Logos/RememberServiceLogo/index.tsx"],"sourcesContent":["import type { GetStyledComponentProps } from '@remember-web/shared';\n\nimport { Divider } from '@/Common';\nimport type { RememberLogoProps } from '@/Logos/types';\n\nimport { RememberLogo } from '../RememberLogo';\nimport { StyledServiceLogoRoot } from './style';\n\nexport type GnbNaviLogoProps<As> = GetStyledComponentProps<\n typeof StyledServiceLogoRoot,\n As\n> & {\n label?: string;\n color?: RememberLogoProps['color'];\n};\n\nexport const RememberServiceLogo = <As,>({\n label,\n color = 'black',\n ...props\n}: GnbNaviLogoProps<As>) => (\n <StyledServiceLogoRoot $color={color} {...props}>\n <RememberLogo color={color} />\n {label && (\n <>\n <Divider decorative orientation=\"vertical\" style={{ height: '15px' }} />\n <b>{label}</b>\n </>\n )}\n </StyledServiceLogoRoot>\n);\n"],"names":["RememberServiceLogo","_ref","label","_ref$color","color","props","_objectWithoutProperties","_excluded","_jsxs","StyledServiceLogoRoot","_objectSpread","$color","children","_jsx","RememberLogo","_Fragment","Divider","decorative","orientation","style","height"],"mappings":";;;;;;;;;;;;;;;;;IAgBaA,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAAA;AAAA,EAAA,IAC9BC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAAC,UAAA,GAAAF,IAAA,CACLG,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAG,KAAA,CAAA,GAAA,OAAO,GAAAA,UAAA;AACZE,IAAAA,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA,CAAA,CAAA;AAAA,EAAA,oBAERC,IAAA,CAACC,qBAAqB,EAAAC,aAAA,CAAAA,aAAA,CAAA;AAACC,IAAAA,MAAM,EAAEP,KAAAA;AAAM,GAAA,EAAKC,KAAK,CAAA,EAAA,EAAA,EAAA;IAAAO,QAAA,EAAA,cAC7CC,GAAA,CAACC,YAAY,EAAA;AAACV,MAAAA,KAAK,EAAEA,KAAAA;AAAM,KAAE,CAAC,EAC7BF,KAAK,iBACJM,IAAA,CAAAO,QAAA,EAAA;MAAAH,QAAA,EAAA,cACEC,GAAA,CAACG,OAAO,EAAA;QAACC,UAAU,EAAA,IAAA;AAACC,QAAAA,WAAW,EAAC,UAAU;AAACC,QAAAA,KAAK,EAAE;AAAEC,UAAAA,MAAM,EAAE,MAAA;AAAO,SAAA;OAAI,CAAC,eACxEP,GAAA,CAAA,GAAA,EAAA;AAAAD,QAAAA,QAAA,EAAIV,KAAAA;AAAK,OAAI,CAAC,CAAA;AAAA,KACd,CACH,CAAA;AAAA,GAAA,CACoB,CAAC,CAAA;AAAA;;;;"}

package/dist/src/Logos/RememberServiceLogo/style.cjs.js CHANGED Viewed

@@ -1,8 +1,8 @@
 'use strict';
 var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
-var styled = require('styled-components');
 var mixin = require('@remember-web/mixin');
+var styled = require('styled-components');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/dist/src/Logos/RememberServiceLogo/style.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"style.cjs.js","sources":["../../../../src/Logos/RememberServiceLogo/style.ts"],"sourcesContent":["import ~~styled from 'styled-components';\nimport~~ { contents000, getTypographyStyles } from '@remember-web/mixin';\n\nexport const StyledServiceLogoRoot = styled.a<{ $color?: string }>`\n box-sizing: border-box;\n text-decoration: none;\n color: ${({ $color = contents000 }) => $color};\n\n display: flex;\n align-items: end;\n gap: 8px;\n\n > b {\n ${getTypographyStyles('Title2')};\n text-decoration: none;\n line-height: 16px;\n }\n`;\n"],"names":["StyledServiceLogoRoot","styled","a","_templateObject","_taggedTemplateLiteral","_ref","_ref$$color","$color","contents000","getTypographyStyles"],"mappings":";;;;;;;;;;;;AAGaA,IAAAA,qBAAqB,GAAGC,uBAAM,CAACC,CAAC,CAAAC,eAAA,KAAAA,eAAA,GAAAC,uCAAA,CAAA,CAAA,kEAAA,EAAA,0EAAA,EAAA,8DAAA,CAAA,CAAA,CAAA,EAGlC,UAAAC,IAAA,EAAA;AAAA,EAAA,IAAAC,WAAA,GAAAD,IAAA,CAAGE,MAAM;AAANA,IAAAA,MAAM,GAAAD,WAAA,KAAGE,KAAAA,CAAAA,GAAAA,iBAAW,GAAAF,WAAA,CAAA;AAAA,EAAA,OAAOC,MAAM,CAAA;AAAA,CAAA,EAOzCE,yBAAmB,CAAC,QAAQ,CAAC;;;;"}
1	+ {"version":3,"file":"style.cjs.js","sources":["../../../../src/Logos/RememberServiceLogo/style.ts"],"sourcesContent":["import { contents000, getTypographyStyles } from '@remember-web/mixin';\nimport styled from 'styled-components';\n\nexport const StyledServiceLogoRoot = styled.a<{ $color?: string }>`\n box-sizing: border-box;\n text-decoration: none;\n color: ${({ $color = contents000 }) => $color};\n\n display: flex;\n align-items: end;\n gap: 8px;\n\n > b {\n ${getTypographyStyles('Title2')};\n text-decoration: none;\n line-height: 16px;\n }\n`;\n"],"names":["StyledServiceLogoRoot","styled","a","_templateObject","_taggedTemplateLiteral","_ref","_ref$$color","$color","contents000","getTypographyStyles"],"mappings":";;;;;;;;;;;;AAGaA,IAAAA,qBAAqB,GAAGC,uBAAM,CAACC,CAAC,CAAAC,eAAA,KAAAA,eAAA,GAAAC,uCAAA,CAAA,CAAA,kEAAA,EAAA,0EAAA,EAAA,8DAAA,CAAA,CAAA,CAAA,EAGlC,UAAAC,IAAA,EAAA;AAAA,EAAA,IAAAC,WAAA,GAAAD,IAAA,CAAGE,MAAM;AAANA,IAAAA,MAAM,GAAAD,WAAA,KAAGE,KAAAA,CAAAA,GAAAA,iBAAW,GAAAF,WAAA,CAAA;AAAA,EAAA,OAAOC,MAAM,CAAA;AAAA,CAAA,EAOzCE,yBAAmB,CAAC,QAAQ,CAAC;;;;"}

package/dist/src/Logos/RememberServiceLogo/style.esm.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
-import styled from 'styled-components';
 import { getTypographyStyles, contents000 } from '@remember-web/mixin';
+import styled from 'styled-components';
 var _templateObject;
 var StyledServiceLogoRoot = styled.a(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  box-sizing: border-box;\n  text-decoration: none;\n  color: ", ";\n\n  display: flex;\n  align-items: end;\n  gap: 8px;\n\n  > b {\n    ", ";\n    text-decoration: none;\n    line-height: 16px;\n  }\n"])), function (_ref) {

package/dist/src/Logos/RememberServiceLogo/style.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"style.esm.js","sources":["../../../../src/Logos/RememberServiceLogo/style.ts"],"sourcesContent":["import ~~styled from 'styled-components';\nimport~~ { contents000, getTypographyStyles } from '@remember-web/mixin';\n\nexport const StyledServiceLogoRoot = styled.a<{ $color?: string }>`\n box-sizing: border-box;\n text-decoration: none;\n color: ${({ $color = contents000 }) => $color};\n\n display: flex;\n align-items: end;\n gap: 8px;\n\n > b {\n ${getTypographyStyles('Title2')};\n text-decoration: none;\n line-height: 16px;\n }\n`;\n"],"names":["StyledServiceLogoRoot","styled","a","_templateObject","_taggedTemplateLiteral","_ref","_ref$$color","$color","contents000","getTypographyStyles"],"mappings":";;;;;AAGaA,IAAAA,qBAAqB,GAAGC,MAAM,CAACC,CAAC,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,CAAA,CAAA,kEAAA,EAAA,0EAAA,EAAA,8DAAA,CAAA,CAAA,CAAA,EAGlC,UAAAC,IAAA,EAAA;AAAA,EAAA,IAAAC,WAAA,GAAAD,IAAA,CAAGE,MAAM;AAANA,IAAAA,MAAM,GAAAD,WAAA,KAAGE,KAAAA,CAAAA,GAAAA,WAAW,GAAAF,WAAA,CAAA;AAAA,EAAA,OAAOC,MAAM,CAAA;AAAA,CAAA,EAOzCE,mBAAmB,CAAC,QAAQ,CAAC;;;;"}
1	+ {"version":3,"file":"style.esm.js","sources":["../../../../src/Logos/RememberServiceLogo/style.ts"],"sourcesContent":["import { contents000, getTypographyStyles } from '@remember-web/mixin';\nimport styled from 'styled-components';\n\nexport const StyledServiceLogoRoot = styled.a<{ $color?: string }>`\n box-sizing: border-box;\n text-decoration: none;\n color: ${({ $color = contents000 }) => $color};\n\n display: flex;\n align-items: end;\n gap: 8px;\n\n > b {\n ${getTypographyStyles('Title2')};\n text-decoration: none;\n line-height: 16px;\n }\n`;\n"],"names":["StyledServiceLogoRoot","styled","a","_templateObject","_taggedTemplateLiteral","_ref","_ref$$color","$color","contents000","getTypographyStyles"],"mappings":";;;;;AAGaA,IAAAA,qBAAqB,GAAGC,MAAM,CAACC,CAAC,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,CAAA,CAAA,kEAAA,EAAA,0EAAA,EAAA,8DAAA,CAAA,CAAA,CAAA,EAGlC,UAAAC,IAAA,EAAA;AAAA,EAAA,IAAAC,WAAA,GAAAD,IAAA,CAAGE,MAAM;AAANA,IAAAA,MAAM,GAAAD,WAAA,KAAGE,KAAAA,CAAAA,GAAAA,WAAW,GAAAF,WAAA,CAAA;AAAA,EAAA,OAAOC,MAAM,CAAA;AAAA,CAAA,EAOzCE,mBAAmB,CAAC,QAAQ,CAAC;;;;"}

package/dist/src/Modals/Dialog/index.cjs.js CHANGED Viewed

@@ -45,7 +45,7 @@ Dialog.Content = function (_ref2) {
     props = _objectWithoutProperties__default.default(_ref2, _excluded2);
   return /*#__PURE__*/jsxRuntime.jsxs(DialogPrimitive.Portal, {
     children: [dimmed && /*#__PURE__*/jsxRuntime.jsx(styles.StyledOverlay, {}), /*#__PURE__*/jsxRuntime.jsx(styles.DialogContent, _objectSpread(_objectSpread({}, props), {}, {
-      children: /*#__PURE__*/jsxRuntime.jsx(index, {
+      children: /*#__PURE__*/jsxRuntime.jsx(index.Flex, {
         direction: "column",
         align: "center",
         children: children

package/dist/src/Modals/Dialog/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../src/Modals/Dialog/index.tsx"],"sourcesContent":["'use client';\n\nimport type { DialogContentProps, DialogProps } from '@radix-ui/react-dialog';\nimport { ~~Root~~, ~~Trigger~~, ~~Close~~, ~~Portal~~ } from '@radix-ui/react-dialog';\nimport { IconClose, PictogramAlert, PictogramCheck } from '@remember-web/icon';\n\nimport Flex from '@/Common/Flex';\n\nimport {\n DialogContent,\n DialogDescription,\n DialogIcon,\n DialogTitle,\n IconButton,\n StyledOverlay,\n} from './styles';\n\ninterface ContentProps extends DialogContentProps {\n children: React.ReactNode;\n dimmed?: boolean;\n}\n\n/*\n @prop {React.ReactNode} children\n * @prop {boolean} open\n * @prop {boolean} defaultOpen\n * @prop {(open: boolean) => void} onOpenChange\n * @prop {boolean} modal\n * @prop {string} id\n /\nexport function Dialog({ children, ...props }: DialogProps) {\n return <Root {...props}>{children}</Root>;\n}\n\n/\n @prop {boolean} dimmed\n * @see https://www.radix-ui.com/docs/primitives/components/dialog\n */\nDialog.Content = ({ children, dimmed = true, ...props }: ContentProps) => (\n <Portal>\n {dimmed && <StyledOverlay />}\n <DialogContent {...props}>\n <Flex direction=\"column\" align=\"center\">\n {children}\n </Flex>\n </DialogContent>\n </Portal>\n);\n\nDialog.HeadIcon = ({ type = 'alert' }: { type?: 'alert' \| 'confirm' }) => (\n <DialogIcon>\n {type === 'alert' && <PictogramAlert size={40} />}\n {type === 'confirm' && <PictogramCheck size={40} />}\n </DialogIcon>\n);\n\nDialog.CloseIcon = () => (\n <Close asChild>\n <IconButton type=\"button\" aria-label=\"Close\">\n <IconClose size=\"small\" />\n </IconButton>\n </Close>\n);\n\nDialog.Title = ({ children }: { children: React.ReactNode }) => (\n <DialogTitle>{children}</DialogTitle>\n);\n\nDialog.Description = ({ children }: { children: React.ReactNode }) => (\n <DialogDescription>{children}</DialogDescription>\n);\n\nDialog.Trigger = Trigger;\nDialog.Close = Close;\n"],"names":["props","children","Dialog","dimmed","direction","align","type","size"],"mappings":";;;;;;;;;;;;;;;;AAAa;;AAAA;AAAA;AAsBb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AAAqD;AAAtBA;;AACdC;AAAW;AACnC;;AAEA;AACA;AACA;AACA;AACAC;AAAiB;;AAAaC;AAAkBH;;AACvCC;;AAGGG;AAAmBC;AAAcJ;;AAEhC;AACO;AACT;AAGXC;AAAkB;AAAGI;;AACRL;AAC4BM;;AACEA;AAAS;AAAG;AACxC;AAGfL;;;;AAEgBI;AAAc;;AACbC;;;AACA;AACP;AAGVL;AAAe;;AACDD;AAAU;AAAe;AAGvCC;AAAqB;;AACDD;AAAU;AAAqB;AAGnDC;AACAA;;"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/Modals/Dialog/index.tsx"],"sourcesContent":["'use client';\n\nimport type { DialogContentProps, DialogProps } from '@radix-ui/react-dialog';\nimport { Close, Portal, Root, Trigger } from '@radix-ui/react-dialog';\nimport { IconClose, PictogramAlert, PictogramCheck } from '@remember-web/icon';\n\nimport { Flex } from '@/Common/Flex';\n\nimport {\n DialogContent,\n DialogDescription,\n DialogIcon,\n DialogTitle,\n IconButton,\n StyledOverlay,\n} from './styles';\n\ninterface ContentProps extends DialogContentProps {\n children: React.ReactNode;\n dimmed?: boolean;\n}\n\n/*\n @prop {React.ReactNode} children\n * @prop {boolean} open\n * @prop {boolean} defaultOpen\n * @prop {(open: boolean) => void} onOpenChange\n * @prop {boolean} modal\n * @prop {string} id\n /\nexport function Dialog({ children, ...props }: DialogProps) {\n return <Root {...props}>{children}</Root>;\n}\n\n/\n @prop {boolean} dimmed\n * @see https://www.radix-ui.com/docs/primitives/components/dialog\n */\nDialog.Content = ({ children, dimmed = true, ...props }: ContentProps) => (\n <Portal>\n {dimmed && <StyledOverlay />}\n <DialogContent {...props}>\n <Flex direction=\"column\" align=\"center\">\n {children}\n </Flex>\n </DialogContent>\n </Portal>\n);\n\nDialog.HeadIcon = ({ type = 'alert' }: { type?: 'alert' \| 'confirm' }) => (\n <DialogIcon>\n {type === 'alert' && <PictogramAlert size={40} />}\n {type === 'confirm' && <PictogramCheck size={40} />}\n </DialogIcon>\n);\n\nDialog.CloseIcon = () => (\n <Close asChild>\n <IconButton type=\"button\" aria-label=\"Close\">\n <IconClose size=\"small\" />\n </IconButton>\n </Close>\n);\n\nDialog.Title = ({ children }: { children: React.ReactNode }) => (\n <DialogTitle>{children}</DialogTitle>\n);\n\nDialog.Description = ({ children }: { children: React.ReactNode }) => (\n <DialogDescription>{children}</DialogDescription>\n);\n\nDialog.Trigger = Trigger;\nDialog.Close = Close;\n"],"names":["props","children","Dialog","dimmed","direction","align","type","size"],"mappings":";;;;;;;;;;;;;;;;AAAa;;AAAA;AAAA;AAsBb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AAAqD;AAAtBA;;AACdC;AAAW;AACnC;;AAEA;AACA;AACA;AACA;AACAC;AAAiB;;AAAaC;AAAkBH;;AACvCC;;AAGGG;AAAmBC;AAAcJ;;AAEhC;AACO;AACT;AAGXC;AAAkB;AAAGI;;AACRL;AAC4BM;;AACEA;AAAS;AAAG;AACxC;AAGfL;;;;AAEgBI;AAAc;;AACbC;;;AACA;AACP;AAGVL;AAAe;;AACDD;AAAU;AAAe;AAGvCC;AAAqB;;AACDD;AAAU;AAAqB;AAGnDC;AACAA;;"}

package/dist/src/Modals/Dialog/index.esm.js CHANGED Viewed

@@ -3,7 +3,7 @@ import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import { Root, Portal, Close, Trigger } from '@radix-ui/react-dialog';
 import { PictogramAlert, PictogramCheck, IconClose } from '@remember-web/icon';
-import Flex from '../../Common/Flex/index.esm.js';
+import { Flex } from '../../Common/Flex/index.esm.js';
 import { StyledOverlay, DialogContent, DialogIcon, IconButton, DialogTitle, DialogDescription } from './styles.esm.js';
 import { jsx, jsxs } from 'react/jsx-runtime';

package/dist/src/Modals/Dialog/index.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.esm.js","sources":["../../../../src/Modals/Dialog/index.tsx"],"sourcesContent":["'use client';\n\nimport type { DialogContentProps, DialogProps } from '@radix-ui/react-dialog';\nimport { ~~Root~~, ~~Trigger~~, ~~Close~~, ~~Portal~~ } from '@radix-ui/react-dialog';\nimport { IconClose, PictogramAlert, PictogramCheck } from '@remember-web/icon';\n\nimport Flex from '@/Common/Flex';\n\nimport {\n DialogContent,\n DialogDescription,\n DialogIcon,\n DialogTitle,\n IconButton,\n StyledOverlay,\n} from './styles';\n\ninterface ContentProps extends DialogContentProps {\n children: React.ReactNode;\n dimmed?: boolean;\n}\n\n/*\n @prop {React.ReactNode} children\n * @prop {boolean} open\n * @prop {boolean} defaultOpen\n * @prop {(open: boolean) => void} onOpenChange\n * @prop {boolean} modal\n * @prop {string} id\n /\nexport function Dialog({ children, ...props }: DialogProps) {\n return <Root {...props}>{children}</Root>;\n}\n\n/\n @prop {boolean} dimmed\n * @see https://www.radix-ui.com/docs/primitives/components/dialog\n */\nDialog.Content = ({ children, dimmed = true, ...props }: ContentProps) => (\n <Portal>\n {dimmed && <StyledOverlay />}\n <DialogContent {...props}>\n <Flex direction=\"column\" align=\"center\">\n {children}\n </Flex>\n </DialogContent>\n </Portal>\n);\n\nDialog.HeadIcon = ({ type = 'alert' }: { type?: 'alert' \| 'confirm' }) => (\n <DialogIcon>\n {type === 'alert' && <PictogramAlert size={40} />}\n {type === 'confirm' && <PictogramCheck size={40} />}\n </DialogIcon>\n);\n\nDialog.CloseIcon = () => (\n <Close asChild>\n <IconButton type=\"button\" aria-label=\"Close\">\n <IconClose size=\"small\" />\n </IconButton>\n </Close>\n);\n\nDialog.Title = ({ children }: { children: React.ReactNode }) => (\n <DialogTitle>{children}</DialogTitle>\n);\n\nDialog.Description = ({ children }: { children: React.ReactNode }) => (\n <DialogDescription>{children}</DialogDescription>\n);\n\nDialog.Trigger = Trigger;\nDialog.Close = Close;\n"],"names":["props","children","Dialog","dimmed","direction","align","type","size"],"mappings":";;;;;;;;;AAAa;;AAAA;AAAA;AAsBb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AAAqD;AAAtBA;;AACdC;AAAW;AACnC;;AAEA;AACA;AACA;AACA;AACAC;AAAiB;;AAAaC;AAAkBH;;AACvCC;;AAGGG;AAAmBC;AAAcJ;;AAEhC;AACO;AACT;AAGXC;AAAkB;AAAGI;;AACRL;AAC4BM;;AACEA;AAAS;AAAG;AACxC;AAGfL;;;;AAEgBI;AAAc;;AACbC;;;AACA;AACP;AAGVL;AAAe;;AACDD;AAAU;AAAe;AAGvCC;AAAqB;;AACDD;AAAU;AAAqB;AAGnDC;AACAA;;"}
1	+ {"version":3,"file":"index.esm.js","sources":["../../../../src/Modals/Dialog/index.tsx"],"sourcesContent":["'use client';\n\nimport type { DialogContentProps, DialogProps } from '@radix-ui/react-dialog';\nimport { Close, Portal, Root, Trigger } from '@radix-ui/react-dialog';\nimport { IconClose, PictogramAlert, PictogramCheck } from '@remember-web/icon';\n\nimport { Flex } from '@/Common/Flex';\n\nimport {\n DialogContent,\n DialogDescription,\n DialogIcon,\n DialogTitle,\n IconButton,\n StyledOverlay,\n} from './styles';\n\ninterface ContentProps extends DialogContentProps {\n children: React.ReactNode;\n dimmed?: boolean;\n}\n\n/*\n @prop {React.ReactNode} children\n * @prop {boolean} open\n * @prop {boolean} defaultOpen\n * @prop {(open: boolean) => void} onOpenChange\n * @prop {boolean} modal\n * @prop {string} id\n /\nexport function Dialog({ children, ...props }: DialogProps) {\n return <Root {...props}>{children}</Root>;\n}\n\n/\n @prop {boolean} dimmed\n * @see https://www.radix-ui.com/docs/primitives/components/dialog\n */\nDialog.Content = ({ children, dimmed = true, ...props }: ContentProps) => (\n <Portal>\n {dimmed && <StyledOverlay />}\n <DialogContent {...props}>\n <Flex direction=\"column\" align=\"center\">\n {children}\n </Flex>\n </DialogContent>\n </Portal>\n);\n\nDialog.HeadIcon = ({ type = 'alert' }: { type?: 'alert' \| 'confirm' }) => (\n <DialogIcon>\n {type === 'alert' && <PictogramAlert size={40} />}\n {type === 'confirm' && <PictogramCheck size={40} />}\n </DialogIcon>\n);\n\nDialog.CloseIcon = () => (\n <Close asChild>\n <IconButton type=\"button\" aria-label=\"Close\">\n <IconClose size=\"small\" />\n </IconButton>\n </Close>\n);\n\nDialog.Title = ({ children }: { children: React.ReactNode }) => (\n <DialogTitle>{children}</DialogTitle>\n);\n\nDialog.Description = ({ children }: { children: React.ReactNode }) => (\n <DialogDescription>{children}</DialogDescription>\n);\n\nDialog.Trigger = Trigger;\nDialog.Close = Close;\n"],"names":["props","children","Dialog","dimmed","direction","align","type","size"],"mappings":";;;;;;;;;AAAa;;AAAA;AAAA;AAsBb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AAAqD;AAAtBA;;AACdC;AAAW;AACnC;;AAEA;AACA;AACA;AACA;AACAC;AAAiB;;AAAaC;AAAkBH;;AACvCC;;AAGGG;AAAmBC;AAAcJ;;AAEhC;AACO;AACT;AAGXC;AAAkB;AAAGI;;AACRL;AAC4BM;;AACEA;AAAS;AAAG;AACxC;AAGfL;;;;AAEgBI;AAAc;;AACbC;;;AACA;AACP;AAGVL;AAAe;;AACDD;AAAU;AAAe;AAGvCC;AAAqB;;AACDD;AAAU;AAAqB;AAGnDC;AACAA;;"}

package/dist/src/Modals/Dialog/styles.cjs.js CHANGED Viewed

@@ -2,9 +2,9 @@
 'use strict';
 var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
-var styled = require('styled-components');
 var DialogPrimitive = require('@radix-ui/react-dialog');
 var mixin = require('@remember-web/mixin');
+var styled = require('styled-components');
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -27,8 +27,8 @@ function _interopNamespace(e) {
 }
 var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefault(_taggedTemplateLiteral);
-var styled__default = /*#__PURE__*/_interopDefault(styled);
 var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
+var styled__default = /*#__PURE__*/_interopDefault(styled);
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
 var overlayShow = styled.keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral__default.default(["\n  0% { opacity: 0; }\n  100% { opacity: 1; }\n"])));

package/dist/src/Modals/Dialog/styles.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.cjs.js","sources":["../../../../src/Modals/Dialog/styles.ts"],"sourcesContent":["'use client';\n\nimport ~~styled, { keyframes } from 'styled-components';\nimport~~ * as DialogPrimitive from '@radix-ui/react-dialog';\nimport {\n ~~primary200,\n~~ contents000,\n contents100,\n getTypographyStyles,\n} from '@remember-web/mixin';\n\nexport const overlayShow = keyframes`\n 0% { opacity: 0; }\n 100% { opacity: 1; }\n`;\n\nexport const contentShow = keyframes`\n 0% { opacity: 0; transform: translate(-50%, -48%) scale(.96) }\n 100% { opacity: 1; transform: translate(-50%, -50%) scale(1) }\n`;\n\nexport const StyledOverlay = styled(DialogPrimitive.Overlay)`\n position: fixed;\n inset: 0;\n background-color: rgba(0, 0, 0, 0.3);\n\n @media (prefers-reduced-motion: no-preference) {\n animation: ${overlayShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n`;\n\nexport const DialogContent = styled(DialogPrimitive.Content)`\n box-sizing: border-box;\n background-color: ${primary200};\n border-radius: 8px;\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 90vw;\n max-width: 360px;\n min-width: 300px;\n max-height: 85vh;\n padding: 32px 24px 24px;\n\n &:focus {\n outline: none;\n }\n\n @media (prefers-reduced-motion: no-preference) {\n animation: ${contentShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n`;\n\nexport const DialogIcon = styled.div`\n margin-bottom: 16px;\n`;\n\nexport const IconButton = styled.button`\n all: unset;\n height: 16px;\n width: 16px;\n margin: -8px 0 8px 0;\n align-self: flex-end;\n cursor: pointer;\n`;\n\nexport const DialogTitle = styled(DialogPrimitive.Title)`\n ${getTypographyStyles('Headline4_B')}\n\n color: ${contents000};\n margin: 0;\n padding: 0;\n white-space: pre-line;\n`;\n\nexport const DialogDescription = styled(DialogPrimitive.Description)`\n ${getTypographyStyles('Body1_M')}\n\n color: ${contents100};\n margin: 4px 0 24px;\n text-align: center;\n white-space: pre-line;\n`;\n"],"names":["DialogIcon","IconButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAa;AAWN;AAKA;;;AAsCMA;AAIAC;AASN;AASA;;;;;;;;;"}
1	+ {"version":3,"file":"styles.cjs.js","sources":["../../../../src/Modals/Dialog/styles.ts"],"sourcesContent":["'use client';\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport {\n contents000,\n contents100,\n getTypographyStyles,\n primary200,\n} from '@remember-web/mixin';\nimport styled, { keyframes } from 'styled-components';\n\nexport const overlayShow = keyframes`\n 0% { opacity: 0; }\n 100% { opacity: 1; }\n`;\n\nexport const contentShow = keyframes`\n 0% { opacity: 0; transform: translate(-50%, -48%) scale(.96) }\n 100% { opacity: 1; transform: translate(-50%, -50%) scale(1) }\n`;\n\nexport const StyledOverlay = styled(DialogPrimitive.Overlay)`\n position: fixed;\n inset: 0;\n background-color: rgba(0, 0, 0, 0.3);\n\n @media (prefers-reduced-motion: no-preference) {\n animation: ${overlayShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n`;\n\nexport const DialogContent = styled(DialogPrimitive.Content)`\n box-sizing: border-box;\n background-color: ${primary200};\n border-radius: 8px;\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 90vw;\n max-width: 360px;\n min-width: 300px;\n max-height: 85vh;\n padding: 32px 24px 24px;\n\n &:focus {\n outline: none;\n }\n\n @media (prefers-reduced-motion: no-preference) {\n animation: ${contentShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n`;\n\nexport const DialogIcon = styled.div`\n margin-bottom: 16px;\n`;\n\nexport const IconButton = styled.button`\n all: unset;\n height: 16px;\n width: 16px;\n margin: -8px 0 8px 0;\n align-self: flex-end;\n cursor: pointer;\n`;\n\nexport const DialogTitle = styled(DialogPrimitive.Title)`\n ${getTypographyStyles('Headline4_B')}\n\n color: ${contents000};\n margin: 0;\n padding: 0;\n white-space: pre-line;\n`;\n\nexport const DialogDescription = styled(DialogPrimitive.Description)`\n ${getTypographyStyles('Body1_M')}\n\n color: ${contents100};\n margin: 4px 0 24px;\n text-align: center;\n white-space: pre-line;\n`;\n"],"names":["DialogIcon","IconButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAa;AAWN;AAKA;;;AAsCMA;AAIAC;AASN;AASA;;;;;;;;;"}

package/dist/src/Modals/Dialog/styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/Modals/Dialog/styles.ts"],"names":[],"mappings":";~~AAGA~~,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;~~AAQ1D~~,eAAO,MAAM,WAAW,2DAGvB,CAAC;AAEF,eAAO,MAAM,WAAW,2DAGvB,CAAC;AAEF,eAAO,MAAM,aAAa;;+LAQzB,CAAC;AAEF,eAAO,MAAM,aAAa;;+LAqBzB,CAAC;AAEF,eAAO,MAAM,UAAU,gNAEtB,CAAC;AAEF,eAAO,MAAM,UAAU,4NAOtB,CAAC;AAEF,eAAO,MAAM,WAAW;;iMAOvB,CAAC;AAEF,eAAO,MAAM,iBAAiB;;yMAO7B,CAAC"}
1	+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/Modals/Dialog/styles.ts"],"names":[],"mappings":";AAEA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAS1D,eAAO,MAAM,WAAW,2DAGvB,CAAC;AAEF,eAAO,MAAM,WAAW,2DAGvB,CAAC;AAEF,eAAO,MAAM,aAAa;;+LAQzB,CAAC;AAEF,eAAO,MAAM,aAAa;;+LAqBzB,CAAC;AAEF,eAAO,MAAM,UAAU,gNAEtB,CAAC;AAEF,eAAO,MAAM,UAAU,4NAOtB,CAAC;AAEF,eAAO,MAAM,WAAW;;iMAOvB,CAAC;AAEF,eAAO,MAAM,iBAAiB;;yMAO7B,CAAC"}

package/dist/src/Modals/Dialog/styles.esm.js CHANGED Viewed

@@ -1,8 +1,8 @@
 "use client";
 import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
-import styled, { keyframes } from 'styled-components';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { primary200, getTypographyStyles, contents000, contents100 } from '@remember-web/mixin';
+import styled, { keyframes } from 'styled-components';
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
 var overlayShow = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  0% { opacity: 0; }\n  100% { opacity: 1; }\n"])));

package/dist/src/Modals/Dialog/styles.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"styles.esm.js","sources":["../../../../src/Modals/Dialog/styles.ts"],"sourcesContent":["'use client';\n\nimport ~~styled, { keyframes } from 'styled-components';\nimport~~ * as DialogPrimitive from '@radix-ui/react-dialog';\nimport {\n ~~primary200,\n~~ contents000,\n contents100,\n getTypographyStyles,\n} from '@remember-web/mixin';\n\nexport const overlayShow = keyframes`\n 0% { opacity: 0; }\n 100% { opacity: 1; }\n`;\n\nexport const contentShow = keyframes`\n 0% { opacity: 0; transform: translate(-50%, -48%) scale(.96) }\n 100% { opacity: 1; transform: translate(-50%, -50%) scale(1) }\n`;\n\nexport const StyledOverlay = styled(DialogPrimitive.Overlay)`\n position: fixed;\n inset: 0;\n background-color: rgba(0, 0, 0, 0.3);\n\n @media (prefers-reduced-motion: no-preference) {\n animation: ${overlayShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n`;\n\nexport const DialogContent = styled(DialogPrimitive.Content)`\n box-sizing: border-box;\n background-color: ${primary200};\n border-radius: 8px;\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 90vw;\n max-width: 360px;\n min-width: 300px;\n max-height: 85vh;\n padding: 32px 24px 24px;\n\n &:focus {\n outline: none;\n }\n\n @media (prefers-reduced-motion: no-preference) {\n animation: ${contentShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n`;\n\nexport const DialogIcon = styled.div`\n margin-bottom: 16px;\n`;\n\nexport const IconButton = styled.button`\n all: unset;\n height: 16px;\n width: 16px;\n margin: -8px 0 8px 0;\n align-self: flex-end;\n cursor: pointer;\n`;\n\nexport const DialogTitle = styled(DialogPrimitive.Title)`\n ${getTypographyStyles('Headline4_B')}\n\n color: ${contents000};\n margin: 0;\n padding: 0;\n white-space: pre-line;\n`;\n\nexport const DialogDescription = styled(DialogPrimitive.Description)`\n ${getTypographyStyles('Body1_M')}\n\n color: ${contents100};\n margin: 4px 0 24px;\n text-align: center;\n white-space: pre-line;\n`;\n"],"names":["DialogIcon","IconButton"],"mappings":";;;;;;AAAa;AAWN;AAKA;;;AAsCMA;AAIAC;AASN;AASA;;"}
1	+ {"version":3,"file":"styles.esm.js","sources":["../../../../src/Modals/Dialog/styles.ts"],"sourcesContent":["'use client';\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport {\n contents000,\n contents100,\n getTypographyStyles,\n primary200,\n} from '@remember-web/mixin';\nimport styled, { keyframes } from 'styled-components';\n\nexport const overlayShow = keyframes`\n 0% { opacity: 0; }\n 100% { opacity: 1; }\n`;\n\nexport const contentShow = keyframes`\n 0% { opacity: 0; transform: translate(-50%, -48%) scale(.96) }\n 100% { opacity: 1; transform: translate(-50%, -50%) scale(1) }\n`;\n\nexport const StyledOverlay = styled(DialogPrimitive.Overlay)`\n position: fixed;\n inset: 0;\n background-color: rgba(0, 0, 0, 0.3);\n\n @media (prefers-reduced-motion: no-preference) {\n animation: ${overlayShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n`;\n\nexport const DialogContent = styled(DialogPrimitive.Content)`\n box-sizing: border-box;\n background-color: ${primary200};\n border-radius: 8px;\n position: fixed;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 90vw;\n max-width: 360px;\n min-width: 300px;\n max-height: 85vh;\n padding: 32px 24px 24px;\n\n &:focus {\n outline: none;\n }\n\n @media (prefers-reduced-motion: no-preference) {\n animation: ${contentShow} 150ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n`;\n\nexport const DialogIcon = styled.div`\n margin-bottom: 16px;\n`;\n\nexport const IconButton = styled.button`\n all: unset;\n height: 16px;\n width: 16px;\n margin: -8px 0 8px 0;\n align-self: flex-end;\n cursor: pointer;\n`;\n\nexport const DialogTitle = styled(DialogPrimitive.Title)`\n ${getTypographyStyles('Headline4_B')}\n\n color: ${contents000};\n margin: 0;\n padding: 0;\n white-space: pre-line;\n`;\n\nexport const DialogDescription = styled(DialogPrimitive.Description)`\n ${getTypographyStyles('Body1_M')}\n\n color: ${contents100};\n margin: 4px 0 24px;\n text-align: center;\n white-space: pre-line;\n`;\n"],"names":["DialogIcon","IconButton"],"mappings":";;;;;;AAAa;AAWN;AAKA;;;AAsCMA;AAIAC;AASN;AASA;;"}