@remember-web/mixin 0.1.0 → 0.1.2

package/dist/colors/theme.js

@@ -1,74 +0,0 @@
-/**
- * {@link https://www.figma.com/file/2qQ5eJPRTiAKyz6Q1IzfMJ/WEB?node-id=2570%3A12136&viewport=347%2C475%2C0.47}
- */
-const RUI_COLOR_THEME = {
-    light: {
-        '--rui-primary100': '#000000',
-        '--rui-primary200': '#FFFFFF',
-        '--rui-secondary100': '#FF6A0D',
-        '--rui-contents000': '#000000',
-        '--rui-contents100': '#424242',
-        '--rui-contents150': '#808080',
-        '--rui-contents200': '#BDBDBD',
-        '--rui-contents300': '#D4D4D4',
-        '--rui-contents999': '#FFFFFF',
-        '--rui-disabled': '#D4D4D4',
-        '--rui-disabled-role-red': '#F7ABAB',
-        '--rui-disabled-secondary': '#FFE3D1',
-        '--rui-role-red': '#ED4E4E',
-        '--rui-role-yellow': '#EDC84E',
-        '--rui-role-blue': '#2679ED',
-        '--rui-role-green': '#21C798',
-        '--rui-bg100': '#FFFFFF',
-        '--rui-bg200': '#FAFAFA',
-        '--rui-bg300': '#F2F2F2',
-        '--rui-bg-modal100': '#FFFFFF',
-        '--rui-bg-modal200': '#FAFAFA',
-        '--rui-bg-role-red': '#FFF5F5',
-        '--rui-bg-secondary100': '#FFF4ED',
-        '--rui-bg-highlight': '#FCF5DC',
-        '--rui-bg-role-yellow': '#FFFDF5',
-        '--rui-bg-role-blue': '#EDF4FF',
-        '--rui-bg-role-green': '#D9FCF2',
-        '--rui-divider': '#D4D4D4',
-        '--rui-fixed-white': '#FFFFFF',
-        '--rui-fixed-black': '#000000',
-        '--rui-fixed-bg-white': '#FFFFFF',
-    },
-    dark: {
-        '--rui-primary100': '#FFFFFF',
-        '--rui-primary200': '#000000',
-        '--rui-secondary100': '#FF6A0D',
-        '--rui-contents000': '#FFFFFF',
-        '--rui-contents100': '#EBEBEB',
-        '--rui-contents150': '#D4D4D4',
-        '--rui-contents200': '#BDBDBD',
-        '--rui-contents300': '#808080',
-        '--rui-contents999': '#000000',
-        '--rui-disabled': '#808080',
-        '--rui-disabled-role-red': '#6B2424',
-        '--rui-disabled-secondary': '#4D2A14',
-        '--rui-role-red': '#D13636',
-        '--rui-role-yellow': '#D1AD36',
-        '--rui-role-blue': '#085DD4',
-        '--rui-role-green': '#22B28A',
-        '--rui-bg100': '#1A1A1A',
-        '--rui-bg200': '#000000',
-        '--rui-bg300': '#000000',
-        '--rui-bg-modal100': '#2E2E2E',
-        '--rui-bg-modal200': '#424242',
-        '--rui-bg-role-red': '#381515',
-        '--rui-bg-secondary100': '#331D0F',
-        '--rui-bg-highlight': '#383015',
-        '--rui-bg-role-yellow': '#383015',
-        '--rui-bg-role-blue': '#002861',
-        '--rui-bg-role-green': '#15382E',
-        '--rui-divider': '#424242',
-        '--rui-fixed-white': '#FFFFFF',
-        '--rui-fixed-black': '#000000',
-        '--rui-fixed-bg-white': '#FFFFFF',
-    },
-};
-
-export { RUI_COLOR_THEME };
-//# sourceMappingURL=theme.js.map

package/dist/colors/theme.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"theme.js","sources":["../../src/colors/theme.ts"],"sourcesContent":["import type { RUIColorThemeType } from './types';\n\n/**\n * {@link https://www.figma.com/file/2qQ5eJPRTiAKyz6Q1IzfMJ/WEB?node-id=2570%3A12136&viewport=347%2C475%2C0.47}\n */\nexport const RUI_COLOR_THEME: RUIColorThemeType = {\n  light: {\n    '--rui-primary100': '#000000',\n    '--rui-primary200': '#FFFFFF',\n    '--rui-secondary100': '#FF6A0D',\n    '--rui-contents000': '#000000',\n    '--rui-contents100': '#424242',\n    '--rui-contents150': '#808080',\n    '--rui-contents200': '#BDBDBD',\n    '--rui-contents300': '#D4D4D4',\n    '--rui-contents999': '#FFFFFF',\n    '--rui-disabled': '#D4D4D4',\n    '--rui-disabled-role-red': '#F7ABAB',\n    '--rui-disabled-secondary': '#FFE3D1',\n    '--rui-role-red': '#ED4E4E',\n    '--rui-role-yellow': '#EDC84E',\n    '--rui-role-blue': '#2679ED',\n    '--rui-role-green': '#21C798',\n    '--rui-bg100': '#FFFFFF',\n    '--rui-bg200': '#FAFAFA',\n    '--rui-bg300': '#F2F2F2',\n    '--rui-bg-modal100': '#FFFFFF',\n    '--rui-bg-modal200': '#FAFAFA',\n    '--rui-bg-role-red': '#FFF5F5',\n    '--rui-bg-secondary100': '#FFF4ED',\n    '--rui-bg-highlight': '#FCF5DC',\n    '--rui-bg-role-yellow': '#FFFDF5',\n    '--rui-bg-role-blue': '#EDF4FF',\n    '--rui-bg-role-green': '#D9FCF2',\n    '--rui-divider': '#D4D4D4',\n    '--rui-fixed-white': '#FFFFFF',\n    '--rui-fixed-black': '#000000',\n    '--rui-fixed-bg-white': '#FFFFFF',\n  },\n  dark: {\n    '--rui-primary100': '#FFFFFF',\n    '--rui-primary200': '#000000',\n    '--rui-secondary100': '#FF6A0D',\n    '--rui-contents000': '#FFFFFF',\n    '--rui-contents100': '#EBEBEB',\n    '--rui-contents150': '#D4D4D4',\n    '--rui-contents200': '#BDBDBD',\n    '--rui-contents300': '#808080',\n    '--rui-contents999': '#000000',\n    '--rui-disabled': '#808080',\n    '--rui-disabled-role-red': '#6B2424',\n    '--rui-disabled-secondary': '#4D2A14',\n    '--rui-role-red': '#D13636',\n    '--rui-role-yellow': '#D1AD36',\n    '--rui-role-blue': '#085DD4',\n    '--rui-role-green': '#22B28A',\n    '--rui-bg100': '#1A1A1A',\n    '--rui-bg200': '#000000',\n    '--rui-bg300': '#000000',\n    '--rui-bg-modal100': '#2E2E2E',\n    '--rui-bg-modal200': '#424242',\n    '--rui-bg-role-red': '#381515',\n    '--rui-bg-secondary100': '#331D0F',\n    '--rui-bg-highlight': '#383015',\n    '--rui-bg-role-yellow': '#383015',\n    '--rui-bg-role-blue': '#002861',\n    '--rui-bg-role-green': '#15382E',\n    '--rui-divider': '#424242',\n    '--rui-fixed-white': '#FFFFFF',\n    '--rui-fixed-black': '#000000',\n    '--rui-fixed-bg-white': '#FFFFFF',\n  },\n};\n"],"names":[],"mappings":"AAEA;;AAEG;AACU,MAAA,eAAe,GAAsB;AAChD,IAAA,KAAK,EAAE;AACL,QAAA,kBAAkB,EAAE,SAAS;AAC7B,QAAA,kBAAkB,EAAE,SAAS;AAC7B,QAAA,oBAAoB,EAAE,SAAS;AAC/B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,gBAAgB,EAAE,SAAS;AAC3B,QAAA,yBAAyB,EAAE,SAAS;AACpC,QAAA,0BAA0B,EAAE,SAAS;AACrC,QAAA,gBAAgB,EAAE,SAAS;AAC3B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,kBAAkB,EAAE,SAAS;AAC7B,QAAA,aAAa,EAAE,SAAS;AACxB,QAAA,aAAa,EAAE,SAAS;AACxB,QAAA,aAAa,EAAE,SAAS;AACxB,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,uBAAuB,EAAE,SAAS;AAClC,QAAA,oBAAoB,EAAE,SAAS;AAC/B,QAAA,sBAAsB,EAAE,SAAS;AACjC,QAAA,oBAAoB,EAAE,SAAS;AAC/B,QAAA,qBAAqB,EAAE,SAAS;AAChC,QAAA,eAAe,EAAE,SAAS;AAC1B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,sBAAsB,EAAE,SAAS;AAClC,KAAA;AACD,IAAA,IAAI,EAAE;AACJ,QAAA,kBAAkB,EAAE,SAAS;AAC7B,QAAA,kBAAkB,EAAE,SAAS;AAC7B,QAAA,oBAAoB,EAAE,SAAS;AAC/B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,gBAAgB,EAAE,SAAS;AAC3B,QAAA,yBAAyB,EAAE,SAAS;AACpC,QAAA,0BAA0B,EAAE,SAAS;AACrC,QAAA,gBAAgB,EAAE,SAAS;AAC3B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,kBAAkB,EAAE,SAAS;AAC7B,QAAA,aAAa,EAAE,SAAS;AACxB,QAAA,aAAa,EAAE,SAAS;AACxB,QAAA,aAAa,EAAE,SAAS;AACxB,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,uBAAuB,EAAE,SAAS;AAClC,QAAA,oBAAoB,EAAE,SAAS;AAC/B,QAAA,sBAAsB,EAAE,SAAS;AACjC,QAAA,oBAAoB,EAAE,SAAS;AAC/B,QAAA,qBAAqB,EAAE,SAAS;AAChC,QAAA,eAAe,EAAE,SAAS;AAC1B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,mBAAmB,EAAE,SAAS;AAC9B,QAAA,sBAAsB,EAAE,SAAS;AAClC,KAAA;;;;;"}

package/dist/colors/utils.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/colors/utils.d.ts

@@ -1,21 +0,0 @@
-import { ColorVariable, ColorVariableName, RUIColorVariable, ThemeType } from "../chunks/57135e08/types.js";
-/** var(color)로 된 string을 color로 변경해줄 때 사용 */
-declare function getColorVariableName<V extends string = string>(color: ColorVariable<V>): ColorVariableName<V>;
-/** RDS컬러의 rgb값이 필요할 때 사용ValidityState
- * @example css`color: rgba(${getRgb(contents000)},0.5)`
- */
-declare function getRgb(color: ColorVariable): string;
-/** RDS컬러를 통해서 css의 rgba함수를 사용
- * @example css`color: ${getRgb(contents000, 0.5)}`
- * @example css`box-shadow: 0 0 0 5px ${getRgb(contents000, 0.5)}`
- */
-declare function getRgba(color: ColorVariable, opacity: number | `${number}%`): string;
-/** hex로 된 컬러값을 rgb값으로 변경해줌 */
-declare function hexToRgb(colorHex: string): string;
-declare function getBrowserTheme(): ThemeType;
-/** css variable을 hex로 반환 */
-declare function getHexFromRuiCssVariable({ colorVariable, theme, }: {
-    theme: ThemeType;
-    colorVariable: RUIColorVariable;
-}): string;
-export { getColorVariableName, getRgb, getRgba, hexToRgb, getBrowserTheme, getHexFromRuiCssVariable };

package/dist/colors/utils.js

@@ -1,47 +0,0 @@
-import { isSSR } from '../shared/utils/common.js';
-import { RUI_COLOR_THEME } from './theme.js';
-
-/** var(color)로 된 string을 color로 변경해줄 때 사용 */
-function getColorVariableName(color) {
-    return color.slice(4, -1);
-}
-/** RDS컬러의 rgb값이 필요할 때 사용ValidityState
- * @example css`color: rgba(${getRgb(contents000)},0.5)`
- */
-function getRgb(color) {
-    return `var(${getColorVariableName(color)}__rgb)`;
-}
-/** RDS컬러를 통해서 css의 rgba함수를 사용
- * @example css`color: ${getRgb(contents000, 0.5)}`
- * @example css`box-shadow: 0 0 0 5px ${getRgb(contents000, 0.5)}`
- */
-function getRgba(color, opacity) {
-    return `rgba(${getRgb(color)},${opacity})`;
-}
-/** hex로 된 컬러값을 rgb값으로 변경해줌 */
-function hexToRgb(colorHex) {
-    let hexWithoutHash = colorHex.replace('#', '');
-    if (hexWithoutHash.length !== 3 && hexWithoutHash.length !== 6) {
-        throw new Error('Invalid hex color');
-    }
-    if (hexWithoutHash.length === 3) {
-        hexWithoutHash = [...hexWithoutHash].map((hex) => hex.repeat(2)).join();
-    }
-    const [, r, g, b] = hexWithoutHash
-        .split(/(..)(..)(..)/)
-        .map((hex) => parseInt(hex, 16));
-    return `${r},${g},${b}`;
-}
-function getBrowserTheme() {
-    if (!isSSR() && window.matchMedia('(prefers-color-scheme: dark)').matches) {
-        return 'dark';
-    }
-    return 'light';
-}
-/** css variable을 hex로 반환 */
-function getHexFromRuiCssVariable({ colorVariable, theme, }) {
-    return RUI_COLOR_THEME[theme][getColorVariableName(colorVariable)];
-}
-
-export { getBrowserTheme, getColorVariableName, getHexFromRuiCssVariable, getRgb, getRgba, hexToRgb };
-//# sourceMappingURL=utils.js.map

package/dist/colors/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sources":["../../src/colors/utils.ts"],"sourcesContent":["import { isSSR } from '@remember-web/shared/utils/common';\n\nimport type {\n  ColorVariable,\n  ColorVariableName,\n  RUIColorVariable,\n  ThemeType,\n} from './types';\nimport { RUI_COLOR_THEME } from './theme';\n\n/** var(color)로 된 string을 color로 변경해줄 때 사용 */\nexport function getColorVariableName<V extends string = string>(\n  color: ColorVariable<V>\n) {\n  return color.slice(4, -1) as ColorVariableName<V>;\n}\n\n/** RDS컬러의 rgb값이 필요할 때 사용ValidityState\n * @example css`color: rgba(${getRgb(contents000)},0.5)`\n */\nexport function getRgb(color: ColorVariable) {\n  return `var(${getColorVariableName(color)}__rgb)`;\n}\n\n/** RDS컬러를 통해서 css의 rgba함수를 사용\n * @example css`color: ${getRgb(contents000, 0.5)}`\n * @example css`box-shadow: 0 0 0 5px ${getRgb(contents000, 0.5)}`\n */\nexport function getRgba(color: ColorVariable, opacity: number | `${number}%`) {\n  return `rgba(${getRgb(color)},${opacity})`;\n}\n\n/** hex로 된 컬러값을 rgb값으로 변경해줌 */\nexport function hexToRgb(colorHex: string) {\n  let hexWithoutHash = colorHex.replace('#', '');\n\n  if (hexWithoutHash.length !== 3 && hexWithoutHash.length !== 6) {\n    throw new Error('Invalid hex color');\n  }\n\n  if (hexWithoutHash.length === 3) {\n    hexWithoutHash = [...hexWithoutHash].map((hex) => hex.repeat(2)).join();\n  }\n\n  const [, r, g, b] = hexWithoutHash\n    .split(/(..)(..)(..)/)\n    .map((hex) => parseInt(hex, 16));\n\n  return `${r},${g},${b}`;\n}\n\nexport function getBrowserTheme(): ThemeType {\n  if (!isSSR() && window.matchMedia('(prefers-color-scheme: dark)').matches) {\n    return 'dark';\n  }\n  return 'light';\n}\n\n/** css variable을 hex로 반환 */\nexport function getHexFromRuiCssVariable({\n  colorVariable,\n  theme,\n}: {\n  theme: ThemeType;\n  colorVariable: RUIColorVariable;\n}) {\n  return RUI_COLOR_THEME[theme][getColorVariableName(colorVariable)];\n}\n"],"names":[],"mappings":";;;AAUA;AACM,SAAU,oBAAoB,CAClC,KAAuB,EAAA;IAEvB,OAAO,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAyB,CAAC;AACpD,CAAC;AAED;;AAEG;AACG,SAAU,MAAM,CAAC,KAAoB,EAAA;AACzC,IAAA,OAAO,OAAO,oBAAoB,CAAC,KAAK,CAAC,QAAQ,CAAC;AACpD,CAAC;AAED;;;AAGG;AACa,SAAA,OAAO,CAAC,KAAoB,EAAE,OAA8B,EAAA;IAC1E,OAAO,CAAA,KAAA,EAAQ,MAAM,CAAC,KAAK,CAAC,CAAI,CAAA,EAAA,OAAO,GAAG,CAAC;AAC7C,CAAC;AAED;AACM,SAAU,QAAQ,CAAC,QAAgB,EAAA;IACvC,IAAI,cAAc,GAAG,QAAQ,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;AAE/C,IAAA,IAAI,cAAc,CAAC,MAAM,KAAK,CAAC,IAAI,cAAc,CAAC,MAAM,KAAK,CAAC,EAAE;AAC9D,QAAA,MAAM,IAAI,KAAK,CAAC,mBAAmB,CAAC,CAAC;KACtC;AAED,IAAA,IAAI,cAAc,CAAC,MAAM,KAAK,CAAC,EAAE;QAC/B,cAAc,GAAG,CAAC,GAAG,cAAc,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;KACzE;IAED,MAAM,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,GAAG,cAAc;SAC/B,KAAK,CAAC,cAAc,CAAC;AACrB,SAAA,GAAG,CAAC,CAAC,GAAG,KAAK,QAAQ,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC;AAEnC,IAAA,OAAO,GAAG,CAAC,CAAA,CAAA,EAAI,CAAC,CAAI,CAAA,EAAA,CAAC,EAAE,CAAC;AAC1B,CAAC;SAEe,eAAe,GAAA;AAC7B,IAAA,IAAI,CAAC,KAAK,EAAE,IAAI,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC,OAAO,EAAE;AACzE,QAAA,OAAO,MAAM,CAAC;KACf;AACD,IAAA,OAAO,OAAO,CAAC;AACjB,CAAC;AAED;SACgB,wBAAwB,CAAC,EACvC,aAAa,EACb,KAAK,GAIN,EAAA;IACC,OAAO,eAAe,CAAC,KAAK,CAAC,CAAC,oBAAoB,CAAC,aAAa,CAAC,CAAC,CAAC;AACrE;;;;"}

package/dist/colors/variables.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"variables.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/colors/variables.d.ts

@@ -1,32 +0,0 @@
-declare const primary100 = "var(--rui-primary100)";
-declare const primary200 = "var(--rui-primary200)";
-declare const secondary100 = "var(--rui-secondary100)";
-declare const contents000 = "var(--rui-contents000)";
-declare const contents100 = "var(--rui-contents100)";
-declare const contents150 = "var(--rui-contents150)";
-declare const contents200 = "var(--rui-contents200)";
-declare const contents300 = "var(--rui-contents300)";
-declare const contents999 = "var(--rui-contents999)";
-declare const disabled = "var(--rui-disabled)";
-declare const disabledRoleRed = "var(--rui-disabled-role-red)";
-declare const disabledSecondary = "var(--rui-disabled-secondary)";
-declare const roleRed = "var(--rui-role-red)";
-declare const roleYellow = "var(--rui-role-yellow)";
-declare const roleBlue = "var(--rui-role-blue)";
-declare const roleGreen = "var(--rui-role-green)";
-declare const bg100 = "var(--rui-bg100)";
-declare const bg200 = "var(--rui-bg200)";
-declare const bg300 = "var(--rui-bg300)";
-declare const bgModal100 = "var(--rui-bg-modal100)";
-declare const bgModal200 = "var(--rui-bg-modal200)";
-declare const bgRoleRed = "var(--rui-bg-role-red)";
-declare const bgSecondary100 = "var(--rui-bg-secondary100)";
-declare const bgHighlight = "var(--rui-bg-highlight)";
-declare const bgRoleYellow = "var(--rui-bg-role-yellow)";
-declare const bgRoleBlue = "var(--rui-bg-role-blue)";
-declare const bgRoleGreen = "var(--rui-bg-role-green)";
-declare const divider = "var(--rui-divider)";
-declare const fixedWhite = "var(--rui-fixed-white)";
-declare const fixedBgWhite = "var(--rui-fixed-bg-white)";
-declare const fixedBlack = "var(--rui-fixed-black)";
-export { primary100, primary200, secondary100, contents000, contents100, contents150, contents200, contents300, contents999, disabled, disabledRoleRed, disabledSecondary, roleRed, roleYellow, roleBlue, roleGreen, bg100, bg200, bg300, bgModal100, bgModal200, bgRoleRed, bgSecondary100, bgHighlight, bgRoleYellow, bgRoleBlue, bgRoleGreen, divider, fixedWhite, fixedBgWhite, fixedBlack };

package/dist/colors/variables.js

@@ -1,40 +0,0 @@
-const primary100 = 'var(--rui-primary100)';
-const primary200 = 'var(--rui-primary200)';
-const secondary100 = 'var(--rui-secondary100)';
-// Contents  txt/ label/ border/ divider
-const contents000 = 'var(--rui-contents000)';
-const contents100 = 'var(--rui-contents100)';
-const contents150 = 'var(--rui-contents150)';
-const contents200 = 'var(--rui-contents200)';
-const contents300 = 'var(--rui-contents300)';
-const contents999 = 'var(--rui-contents999)';
-// Disable disabled CTA
-const disabled = 'var(--rui-disabled)';
-const disabledRoleRed = 'var(--rui-disabled-role-red)';
-const disabledSecondary = 'var(--rui-disabled-secondary)';
-// Accent Error/ Link/
-const roleRed = 'var(--rui-role-red)';
-const roleYellow = 'var(--rui-role-yellow)';
-const roleBlue = 'var(--rui-role-blue)';
-const roleGreen = 'var(--rui-role-green)';
-// Background
-const bg100 = 'var(--rui-bg100)';
-const bg200 = 'var(--rui-bg200)';
-const bg300 = 'var(--rui-bg300)';
-const bgModal100 = 'var(--rui-bg-modal100)';
-const bgModal200 = 'var(--rui-bg-modal200)';
-const bgRoleRed = 'var(--rui-bg-role-red)';
-const bgSecondary100 = 'var(--rui-bg-secondary100)';
-const bgHighlight = 'var(--rui-bg-highlight)';
-const bgRoleYellow = 'var(--rui-bg-role-yellow)';
-const bgRoleBlue = 'var(--rui-bg-role-blue)';
-const bgRoleGreen = 'var(--rui-bg-role-green)';
-// Divider
-const divider = 'var(--rui-divider)';
-// Fixed
-const fixedWhite = 'var(--rui-fixed-white)';
-const fixedBgWhite = 'var(--rui-fixed-bg-white)';
-const fixedBlack = 'var(--rui-fixed-black)';
-
-export { bg100, bg200, bg300, bgHighlight, bgModal100, bgModal200, bgRoleBlue, bgRoleGreen, bgRoleRed, bgRoleYellow, bgSecondary100, contents000, contents100, contents150, contents200, contents300, contents999, disabled, disabledRoleRed, disabledSecondary, divider, fixedBgWhite, fixedBlack, fixedWhite, primary100, primary200, roleBlue, roleGreen, roleRed, roleYellow, secondary100 };
-//# sourceMappingURL=variables.js.map

package/dist/colors/variables.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"variables.js","sources":["../../src/colors/variables.ts"],"sourcesContent":["export const primary100 = 'var(--rui-primary100)';\nexport const primary200 = 'var(--rui-primary200)';\nexport const secondary100 = 'var(--rui-secondary100)';\n\n// Contents  txt/ label/ border/ divider\nexport const contents000 = 'var(--rui-contents000)';\nexport const contents100 = 'var(--rui-contents100)';\nexport const contents150 = 'var(--rui-contents150)';\nexport const contents200 = 'var(--rui-contents200)';\nexport const contents300 = 'var(--rui-contents300)';\nexport const contents999 = 'var(--rui-contents999)';\n\n// Disable disabled CTA\nexport const disabled = 'var(--rui-disabled)';\nexport const disabledRoleRed = 'var(--rui-disabled-role-red)';\nexport const disabledSecondary = 'var(--rui-disabled-secondary)';\n\n// Accent Error/ Link/\nexport const roleRed = 'var(--rui-role-red)';\nexport const roleYellow = 'var(--rui-role-yellow)';\nexport const roleBlue = 'var(--rui-role-blue)';\nexport const roleGreen = 'var(--rui-role-green)';\n\n// Background\nexport const bg100 = 'var(--rui-bg100)';\nexport const bg200 = 'var(--rui-bg200)';\nexport const bg300 = 'var(--rui-bg300)';\nexport const bgModal100 = 'var(--rui-bg-modal100)';\nexport const bgModal200 = 'var(--rui-bg-modal200)';\nexport const bgRoleRed = 'var(--rui-bg-role-red)';\nexport const bgSecondary100 = 'var(--rui-bg-secondary100)';\nexport const bgHighlight = 'var(--rui-bg-highlight)';\nexport const bgRoleYellow = 'var(--rui-bg-role-yellow)';\nexport const bgRoleBlue = 'var(--rui-bg-role-blue)';\nexport const bgRoleGreen = 'var(--rui-bg-role-green)';\n\n// Divider\nexport const divider = 'var(--rui-divider)';\n\n// Fixed\nexport const fixedWhite = 'var(--rui-fixed-white)';\nexport const fixedBgWhite = 'var(--rui-fixed-bg-white)';\nexport const fixedBlack = 'var(--rui-fixed-black)';\n"],"names":[],"mappings":"AAAO,MAAM,UAAU,GAAG,wBAAwB;AAC3C,MAAM,UAAU,GAAG,wBAAwB;AAC3C,MAAM,YAAY,GAAG,0BAA0B;AAEtD;AACO,MAAM,WAAW,GAAG,yBAAyB;AAC7C,MAAM,WAAW,GAAG,yBAAyB;AAC7C,MAAM,WAAW,GAAG,yBAAyB;AAC7C,MAAM,WAAW,GAAG,yBAAyB;AAC7C,MAAM,WAAW,GAAG,yBAAyB;AAC7C,MAAM,WAAW,GAAG,yBAAyB;AAEpD;AACO,MAAM,QAAQ,GAAG,sBAAsB;AACvC,MAAM,eAAe,GAAG,+BAA+B;AACvD,MAAM,iBAAiB,GAAG,gCAAgC;AAEjE;AACO,MAAM,OAAO,GAAG,sBAAsB;AACtC,MAAM,UAAU,GAAG,yBAAyB;AAC5C,MAAM,QAAQ,GAAG,uBAAuB;AACxC,MAAM,SAAS,GAAG,wBAAwB;AAEjD;AACO,MAAM,KAAK,GAAG,mBAAmB;AACjC,MAAM,KAAK,GAAG,mBAAmB;AACjC,MAAM,KAAK,GAAG,mBAAmB;AACjC,MAAM,UAAU,GAAG,yBAAyB;AAC5C,MAAM,UAAU,GAAG,yBAAyB;AAC5C,MAAM,SAAS,GAAG,yBAAyB;AAC3C,MAAM,cAAc,GAAG,6BAA6B;AACpD,MAAM,WAAW,GAAG,0BAA0B;AAC9C,MAAM,YAAY,GAAG,4BAA4B;AACjD,MAAM,UAAU,GAAG,0BAA0B;AAC7C,MAAM,WAAW,GAAG,2BAA2B;AAEtD;AACO,MAAM,OAAO,GAAG,qBAAqB;AAE5C;AACO,MAAM,UAAU,GAAG,yBAAyB;AAC5C,MAAM,YAAY,GAAG,4BAA4B;AACjD,MAAM,UAAU,GAAG;;;;"}

package/dist/index.d.ts

@@ -1,5 +0,0 @@
-export * from "./colors/variables.js";
-export * from "./colors/utils.js";
-export * from "./mediaQuery/index.js";
-export * from "./typography/index.js";
-//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts","../src/colors/index.ts"],"names":[],"mappings":";;AACA,sCAA6B;AAC7B,sCAA6B"}

package/dist/mediaQuery/const.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"const.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/mediaQuery/const.d.ts

@@ -1,3 +0,0 @@
-declare const DESKTOP_WIDTH = 768;
-declare const PHONE_WIDTH = 430;
-export { DESKTOP_WIDTH, PHONE_WIDTH };

package/dist/mediaQuery/const.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"const.js","sources":["../../src/mediaQuery/const.ts"],"sourcesContent":["export const DESKTOP_WIDTH = 768;\nexport const PHONE_WIDTH = 430;\n"],"names":[],"mappings":"AAAO,MAAM,aAAa,GAAG,IAAI;AAC1B,MAAM,WAAW,GAAG;;;;"}

package/dist/mediaQuery/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/mediaQuery/index.d.ts

@@ -1,10 +0,0 @@
-import { CSSProp } from 'styled-components';
-declare function getDeviceWidthMediaQuery({ maxWidth, minWidth, }: {
-    maxWidth?: number | string;
-    minWidth?: number | string;
-}): (cssInterpolation: CSSProp) => import("styled-components").RuleSet<object>;
-declare const mobileOnly: (cssInterpolation: CSSProp) => import("styled-components").RuleSet<object>;
-declare const desktopOnly: (cssInterpolation: CSSProp) => import("styled-components").RuleSet<object>;
-declare const phoneOnly: (cssInterpolation: CSSProp) => import("styled-components").RuleSet<object>;
-export * from "./const.js";
-export { getDeviceWidthMediaQuery, mobileOnly, desktopOnly, phoneOnly };

package/dist/mediaQuery/index.js

@@ -1,30 +0,0 @@
-"use client";
-import { css } from 'styled-components';
-import { DESKTOP_WIDTH, PHONE_WIDTH } from './const.js';
-
-function getDeviceWidthMediaQuery({ maxWidth, minWidth, }) {
-    const mediaQueries = [];
-    if (maxWidth) {
-        mediaQueries.push(`(max-width: ${typeof maxWidth === 'string' ? maxWidth : `${maxWidth}px`})`);
-    }
-    if (minWidth) {
-        mediaQueries.push(`(min-width: ${typeof minWidth === 'string' ? minWidth : `${minWidth}px`})`);
-    }
-    return (cssInterpolation) => css `
-    @media ${mediaQueries.join(' and ')} {
-      ${cssInterpolation}
-    }
-  `;
-}
-const mobileOnly = getDeviceWidthMediaQuery({
-    maxWidth: DESKTOP_WIDTH - 1,
-});
-const desktopOnly = getDeviceWidthMediaQuery({
-    minWidth: DESKTOP_WIDTH,
-});
-const phoneOnly = getDeviceWidthMediaQuery({
-    maxWidth: PHONE_WIDTH,
-});
-
-export { DESKTOP_WIDTH, PHONE_WIDTH, desktopOnly, getDeviceWidthMediaQuery, mobileOnly, phoneOnly };
-//# sourceMappingURL=index.js.map

package/dist/mediaQuery/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../src/mediaQuery/index.ts"],"sourcesContent":["'use client';\n\nimport { css } from 'styled-components';\nimport type { CSSProp } from 'styled-components';\n\nimport { DESKTOP_WIDTH, PHONE_WIDTH } from './const';\n\nexport * from './const';\n\nexport function getDeviceWidthMediaQuery({\n  maxWidth,\n  minWidth,\n}: {\n  maxWidth?: number | string;\n  minWidth?: number | string;\n}) {\n  const mediaQueries: string[] = [];\n\n  if (maxWidth) {\n    mediaQueries.push(\n      `(max-width: ${\n        typeof maxWidth === 'string' ? maxWidth : `${maxWidth}px`\n      })`\n    );\n  }\n\n  if (minWidth) {\n    mediaQueries.push(\n      `(min-width: ${\n        typeof minWidth === 'string' ? minWidth : `${minWidth}px`\n      })`\n    );\n  }\n\n  return (cssInterpolation: CSSProp) => css`\n    @media ${mediaQueries.join(' and ')} {\n      ${cssInterpolation}\n    }\n  `;\n}\n\nexport const mobileOnly = getDeviceWidthMediaQuery({\n  maxWidth: DESKTOP_WIDTH - 1,\n});\nexport const desktopOnly = getDeviceWidthMediaQuery({\n  minWidth: DESKTOP_WIDTH,\n});\nexport const phoneOnly = getDeviceWidthMediaQuery({\n  maxWidth: PHONE_WIDTH,\n});\n"],"names":[],"mappings":";;;;;;;;;;;;AAkCE;AACW;;;;AAIb;AAEO;;AAEN;AACM;AACL;AACD;AACM;AACL;AACD;;"}

package/dist/typography/const.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"const.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/typography/const.js

@@ -1,108 +0,0 @@
-/* eslint-disable @typescript-eslint/naming-convention */
-const LEGACY_TYPOGRAPHY_STYLES = {
-    Headline2_B: {
-        fontSize: 24,
-        lineHeight: 34,
-        fontWeight: 600,
-    },
-    Headline3_B: {
-        fontSize: 20,
-        lineHeight: 26,
-        fontWeight: 600,
-    },
-    Headline4_B: {
-        fontSize: 16,
-        lineHeight: 26,
-        fontWeight: 600,
-    },
-    Headline4_M: {
-        fontSize: 16,
-        lineHeight: 26,
-        fontWeight: 400,
-    },
-    Body1_B: {
-        fontSize: 14,
-        lineHeight: 24,
-        fontWeight: 600,
-    },
-    Body1_M: {
-        fontSize: 14,
-        lineHeight: 24,
-        fontWeight: 400,
-    },
-    Body2_B: {
-        fontSize: 12,
-        lineHeight: 19,
-        fontWeight: 600,
-    },
-    Body2_M: {
-        fontSize: 12,
-        lineHeight: 19,
-        fontWeight: 400,
-    },
-    Caption_B: {
-        fontSize: 10,
-        lineHeight: 14,
-        fontWeight: 600,
-    },
-};
-const TYPOGRAPHY_STYLES = {
-    ...LEGACY_TYPOGRAPHY_STYLES,
-    Headline: {
-        fontSize: 24,
-        lineHeight: 34,
-        fontWeight: 600,
-    },
-    Title1: {
-        fontSize: 20,
-        lineHeight: 26,
-        fontWeight: 600,
-    },
-    Display: {
-        fontSize: 20,
-        lineHeight: 26,
-        fontWeight: 400,
-    },
-    Title2: {
-        fontSize: 16,
-        lineHeight: 26,
-        fontWeight: 600,
-    },
-    ArticleBody: {
-        fontSize: 16,
-        lineHeight: 26,
-        fontWeight: 400,
-    },
-    Subtitle1: {
-        fontSize: 14,
-        lineHeight: 24,
-        fontWeight: 600,
-    },
-    Body1: {
-        fontSize: 14,
-        lineHeight: 24,
-        fontWeight: 400,
-    },
-    Subtitle2: {
-        fontSize: 12,
-        lineHeight: 19,
-        fontWeight: 600,
-    },
-    Body2: {
-        fontSize: 12,
-        lineHeight: 19,
-        fontWeight: 400,
-    },
-    Caption: {
-        fontSize: 10,
-        lineHeight: 14,
-        fontWeight: 600,
-    },
-};
-/**
- * {@link https://github.com/orioncactus/pretendard#html-1}
- */
-const PRETENDARD_FONT_FAMILY = "Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif";
-
-export { PRETENDARD_FONT_FAMILY, TYPOGRAPHY_STYLES };
-//# sourceMappingURL=const.js.map

package/dist/typography/const.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"const.js","sources":["../../src/typography/const.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\n\nconst LEGACY_TYPOGRAPHY_STYLES = {\n  Headline2_B: {\n    fontSize: 24,\n    lineHeight: 34,\n    fontWeight: 600,\n  },\n  Headline3_B: {\n    fontSize: 20,\n    lineHeight: 26,\n    fontWeight: 600,\n  },\n  Headline4_B: {\n    fontSize: 16,\n    lineHeight: 26,\n    fontWeight: 600,\n  },\n  Headline4_M: {\n    fontSize: 16,\n    lineHeight: 26,\n    fontWeight: 400,\n  },\n  Body1_B: {\n    fontSize: 14,\n    lineHeight: 24,\n    fontWeight: 600,\n  },\n  Body1_M: {\n    fontSize: 14,\n    lineHeight: 24,\n    fontWeight: 400,\n  },\n  Body2_B: {\n    fontSize: 12,\n    lineHeight: 19,\n    fontWeight: 600,\n  },\n  Body2_M: {\n    fontSize: 12,\n    lineHeight: 19,\n    fontWeight: 400,\n  },\n  Caption_B: {\n    fontSize: 10,\n    lineHeight: 14,\n    fontWeight: 600,\n  },\n} as const;\n\nexport const TYPOGRAPHY_STYLES = {\n  ...LEGACY_TYPOGRAPHY_STYLES,\n  Headline: {\n    fontSize: 24,\n    lineHeight: 34,\n    fontWeight: 600,\n  },\n  Title1: {\n    fontSize: 20,\n    lineHeight: 26,\n    fontWeight: 600,\n  },\n  Display: {\n    fontSize: 20,\n    lineHeight: 26,\n    fontWeight: 400,\n  },\n  Title2: {\n    fontSize: 16,\n    lineHeight: 26,\n    fontWeight: 600,\n  },\n  ArticleBody: {\n    fontSize: 16,\n    lineHeight: 26,\n    fontWeight: 400,\n  },\n  Subtitle1: {\n    fontSize: 14,\n    lineHeight: 24,\n    fontWeight: 600,\n  },\n  Body1: {\n    fontSize: 14,\n    lineHeight: 24,\n    fontWeight: 400,\n  },\n  Subtitle2: {\n    fontSize: 12,\n    lineHeight: 19,\n    fontWeight: 600,\n  },\n  Body2: {\n    fontSize: 12,\n    lineHeight: 19,\n    fontWeight: 400,\n  },\n  Caption: {\n    fontSize: 10,\n    lineHeight: 14,\n    fontWeight: 600,\n  },\n} as const;\n\n/**\n * {@link https://github.com/orioncactus/pretendard#html-1}\n */\nexport const PRETENDARD_FONT_FAMILY =\n  \"Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif\";\n"],"names":[],"mappings":"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"}

package/dist/typography/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/typography/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../src/typography/index.ts"],"sourcesContent":["'use client';\n\nimport { css } from 'styled-components';\n\nimport { PRETENDARD_FONT_FAMILY, TYPOGRAPHY_STYLES } from './const';\nimport type { TypographyStyle } from './types';\n\nexport * from './const';\nexport * from './types';\n\n/**\n * 해당 스타일명에 해당하는 css 조각을 반환\n * @see TYPOGRAPHY_STYLES\n */\nexport const getTypographyStyles = (typographyStyle: TypographyStyle) => {\n  const { fontSize, lineHeight, fontWeight } =\n    TYPOGRAPHY_STYLES[typographyStyle];\n  return css`\n    font-family: ${PRETENDARD_FONT_FAMILY};\n    font-size: ${fontSize}px;\n    line-height: ${lineHeight}px;\n    font-weight: ${fontWeight};\n  `;\n};\n\n/**\n * 말줄임표 표시 (1줄)\n *\n * white-space: nowrap; \\\n * overflow: hidden; \\\n * text-overflow: ellipsis;\n */\nexport const textEllipsis = css`\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n`;\n\n/**\n * 말줄임표 표시\n *\n * line = 1 인 경우, \\\n * white-space: nowrap; \\\n * overflow: hidden; \\\n * text-overflow: ellipsis;\n *\n * line > 1 인 경우, \\\n * overflow: hidden; \\\n * text-overflow: ellipsis; \\\n * display: -webkit-box; \\\n * -webkit-box-orient: vertical; \\\n * -webkit-line-clamp: ${line};\n */\nexport const ellipsis = (line = 1) => {\n  if (line === 1) {\n    return textEllipsis;\n  }\n\n  return css`\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: ${line};\n  `;\n};\n"],"names":[],"mappings":";;;;AAUA;;;AAGG;AACU;AACX;AAEA;;;;;;AAMF;AAEA;;;;;;AAMG;AACI;;;;;AAMP;;;;;;;;;;;;;;AAcG;;AAED;AACE;;AAGF;;;;;;;AAOF;;"}