@remember-web/mixin 0.1.11 → 0.1.13

package/dist/mixin/src/typography/const.d.ts

@@ -0,0 +1,102 @@
+export declare const TYPOGRAPHY_STYLES: {
+    readonly Headline: {
+        readonly fontSize: 24;
+        readonly lineHeight: 34;
+        readonly fontWeight: 600;
+    };
+    readonly Title1: {
+        readonly fontSize: 20;
+        readonly lineHeight: 26;
+        readonly fontWeight: 600;
+    };
+    readonly Display: {
+        readonly fontSize: 20;
+        readonly lineHeight: 26;
+        readonly fontWeight: 400;
+    };
+    readonly Title2: {
+        readonly fontSize: 16;
+        readonly lineHeight: 26;
+        readonly fontWeight: 600;
+    };
+    readonly ArticleBody: {
+        readonly fontSize: 16;
+        readonly lineHeight: 26;
+        readonly fontWeight: 400;
+    };
+    readonly Subtitle1: {
+        readonly fontSize: 14;
+        readonly lineHeight: 24;
+        readonly fontWeight: 600;
+    };
+    readonly Body1: {
+        readonly fontSize: 14;
+        readonly lineHeight: 24;
+        readonly fontWeight: 400;
+    };
+    readonly Subtitle2: {
+        readonly fontSize: 12;
+        readonly lineHeight: 19;
+        readonly fontWeight: 600;
+    };
+    readonly Body2: {
+        readonly fontSize: 12;
+        readonly lineHeight: 19;
+        readonly fontWeight: 400;
+    };
+    readonly Caption: {
+        readonly fontSize: 10;
+        readonly lineHeight: 14;
+        readonly fontWeight: 600;
+    };
+    readonly Headline2_B: {
+        readonly fontSize: 24;
+        readonly lineHeight: 34;
+        readonly fontWeight: 600;
+    };
+    readonly Headline3_B: {
+        readonly fontSize: 20;
+        readonly lineHeight: 26;
+        readonly fontWeight: 600;
+    };
+    readonly Headline4_B: {
+        readonly fontSize: 16;
+        readonly lineHeight: 26;
+        readonly fontWeight: 600;
+    };
+    readonly Headline4_M: {
+        readonly fontSize: 16;
+        readonly lineHeight: 26;
+        readonly fontWeight: 400;
+    };
+    readonly Body1_B: {
+        readonly fontSize: 14;
+        readonly lineHeight: 24;
+        readonly fontWeight: 600;
+    };
+    readonly Body1_M: {
+        readonly fontSize: 14;
+        readonly lineHeight: 24;
+        readonly fontWeight: 400;
+    };
+    readonly Body2_B: {
+        readonly fontSize: 12;
+        readonly lineHeight: 19;
+        readonly fontWeight: 600;
+    };
+    readonly Body2_M: {
+        readonly fontSize: 12;
+        readonly lineHeight: 19;
+        readonly fontWeight: 400;
+    };
+    readonly Caption_B: {
+        readonly fontSize: 10;
+        readonly lineHeight: 14;
+        readonly fontWeight: 600;
+    };
+};
+/**
+ * {@link https://github.com/orioncactus/pretendard#html-1}
+ */
+export declare 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";
+//# sourceMappingURL=const.d.ts.map

package/dist/mixin/src/typography/const.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../../../src/typography/const.ts"],"names":[],"mappings":"AAkDA,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDpB,CAAC;AAEX;;GAEG;AACH,eAAO,MAAM,sBAAsB,iOAC6L,CAAC"}

package/dist/mixin/src/typography/const.esm.js

@@ -0,0 +1,113 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+/* eslint-disable @typescript-eslint/naming-convention */
+
+var 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
+  }
+};
+var TYPOGRAPHY_STYLES = _objectSpread(_objectSpread({}, 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}
+ */
+var 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.esm.js.map

package/dist/mixin/src/typography/const.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"const.esm.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":["LEGACY_TYPOGRAPHY_STYLES","Headline2_B","fontSize","lineHeight","fontWeight","Headline3_B","Headline4_B","Headline4_M","Body1_B","Body1_M","Body2_B","Body2_M","Caption_B","TYPOGRAPHY_STYLES","_objectSpread","Headline","Title1","Display","Title2","ArticleBody","Subtitle1","Body1","Subtitle2","Body2","Caption","PRETENDARD_FONT_FAMILY"],"mappings":"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"}

package/dist/mixin/src/typography/index.d.ts

@@ -0,0 +1,4 @@
+export * from './const';
+export * from './types';
+export * from './utils';
+//# sourceMappingURL=index.d.ts.map

package/dist/mixin/src/typography/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/typography/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}

package/dist/mixin/src/typography/types.d.ts

@@ -0,0 +1,3 @@
+import type { TYPOGRAPHY_STYLES } from './const';
+export type TypographyStyle = keyof typeof TYPOGRAPHY_STYLES;
+//# sourceMappingURL=types.d.ts.map

package/dist/mixin/src/typography/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/typography/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,iBAAiB,CAAC"}

package/dist/mixin/src/typography/utils.cjs.js

@@ -0,0 +1,60 @@
+"use client";
+'use strict';
+
+var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
+var styledComponents = require('styled-components');
+var _const = require('./const.cjs.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefault(_taggedTemplateLiteral);
+
+var _templateObject, _templateObject2, _templateObject3;
+/**
+ * 해당 스타일명에 해당하는 css 조각을 반환
+ * @see TYPOGRAPHY_STYLES
+ */
+var getTypographyStyles = function getTypographyStyles(typographyStyle) {
+  var _TYPOGRAPHY_STYLES$ty = _const.TYPOGRAPHY_STYLES[typographyStyle],
+    fontSize = _TYPOGRAPHY_STYLES$ty.fontSize,
+    lineHeight = _TYPOGRAPHY_STYLES$ty.lineHeight,
+    fontWeight = _TYPOGRAPHY_STYLES$ty.fontWeight;
+  return styledComponents.css(_templateObject || (_templateObject = _taggedTemplateLiteral__default.default(["\n    font-family: ", ";\n    font-size: ", "px;\n    line-height: ", "px;\n    font-weight: ", ";\n  "])), _const.PRETENDARD_FONT_FAMILY, fontSize, lineHeight, fontWeight);
+};
+
+/**
+ * 말줄임표 표시 (1줄)
+ *
+ * white-space: nowrap; \
+ * overflow: hidden; \
+ * text-overflow: ellipsis;
+ */
+var textEllipsis = styledComponents.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default.default(["\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])));
+
+/**
+ * 말줄임표 표시
+ *
+ * line = 1 인 경우, \
+ * white-space: nowrap; \
+ * overflow: hidden; \
+ * text-overflow: ellipsis;
+ *
+ * line > 1 인 경우, \
+ * overflow: hidden; \
+ * text-overflow: ellipsis; \
+ * display: -webkit-box; \
+ * -webkit-box-orient: vertical; \
+ * -webkit-line-clamp: ${line};
+ */
+var ellipsis = function ellipsis() {
+  var line = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+  if (line === 1) {
+    return textEllipsis;
+  }
+  return styledComponents.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default.default(["\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: ", ";\n  "])), line);
+};
+
+exports.ellipsis = ellipsis;
+exports.getTypographyStyles = getTypographyStyles;
+exports.textEllipsis = textEllipsis;
+//# sourceMappingURL=utils.cjs.js.map

package/dist/mixin/src/typography/utils.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.cjs.js","sources":["../../../../src/typography/utils.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\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":";;;;;;;;;;;AAAa;AAOb;AACA;AACA;AACA;;AAEE;;;;AAEA;AAMF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;;AAMP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACsC;;AAElC;AACF;;AASF;;;;"}

package/dist/mixin/src/typography/utils.d.ts

@@ -0,0 +1,31 @@
+import type { TypographyStyle } from './types';
+/**
+ * 해당 스타일명에 해당하는 css 조각을 반환
+ * @see TYPOGRAPHY_STYLES
+ */
+export declare const getTypographyStyles: (typographyStyle: TypographyStyle) => import("styled-components").RuleSet<object>;
+/**
+ * 말줄임표 표시 (1줄)
+ *
+ * white-space: nowrap; \
+ * overflow: hidden; \
+ * text-overflow: ellipsis;
+ */
+export declare const textEllipsis: import("styled-components").RuleSet<object>;
+/**
+ * 말줄임표 표시
+ *
+ * line = 1 인 경우, \
+ * white-space: nowrap; \
+ * overflow: hidden; \
+ * text-overflow: ellipsis;
+ *
+ * line > 1 인 경우, \
+ * overflow: hidden; \
+ * text-overflow: ellipsis; \
+ * display: -webkit-box; \
+ * -webkit-box-orient: vertical; \
+ * -webkit-line-clamp: ${line};
+ */
+export declare const ellipsis: (line?: number) => import("styled-components").RuleSet<object>;
+//# sourceMappingURL=utils.d.ts.map

package/dist/mixin/src/typography/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/typography/utils.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C;;;GAGG;AACH,eAAO,MAAM,mBAAmB,oBAAqB,eAAe,gDASnE,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,YAAY,6CAIxB,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,QAAQ,gEAYpB,CAAC"}

package/dist/mixin/src/typography/utils.esm.js

@@ -0,0 +1,52 @@
+"use client";
+import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
+import { css } from 'styled-components';
+import { TYPOGRAPHY_STYLES, PRETENDARD_FONT_FAMILY } from './const.esm.js';
+
+var _templateObject, _templateObject2, _templateObject3;
+/**
+ * 해당 스타일명에 해당하는 css 조각을 반환
+ * @see TYPOGRAPHY_STYLES
+ */
+var getTypographyStyles = function getTypographyStyles(typographyStyle) {
+  var _TYPOGRAPHY_STYLES$ty = TYPOGRAPHY_STYLES[typographyStyle],
+    fontSize = _TYPOGRAPHY_STYLES$ty.fontSize,
+    lineHeight = _TYPOGRAPHY_STYLES$ty.lineHeight,
+    fontWeight = _TYPOGRAPHY_STYLES$ty.fontWeight;
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    font-family: ", ";\n    font-size: ", "px;\n    line-height: ", "px;\n    font-weight: ", ";\n  "])), PRETENDARD_FONT_FAMILY, fontSize, lineHeight, fontWeight);
+};
+
+/**
+ * 말줄임표 표시 (1줄)
+ *
+ * white-space: nowrap; \
+ * overflow: hidden; \
+ * text-overflow: ellipsis;
+ */
+var textEllipsis = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])));
+
+/**
+ * 말줄임표 표시
+ *
+ * line = 1 인 경우, \
+ * white-space: nowrap; \
+ * overflow: hidden; \
+ * text-overflow: ellipsis;
+ *
+ * line > 1 인 경우, \
+ * overflow: hidden; \
+ * text-overflow: ellipsis; \
+ * display: -webkit-box; \
+ * -webkit-box-orient: vertical; \
+ * -webkit-line-clamp: ${line};
+ */
+var ellipsis = function ellipsis() {
+  var line = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+  if (line === 1) {
+    return textEllipsis;
+  }
+  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: ", ";\n  "])), line);
+};
+
+export { ellipsis, getTypographyStyles, textEllipsis };
+//# sourceMappingURL=utils.esm.js.map

package/dist/mixin/src/typography/utils.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.esm.js","sources":["../../../../src/typography/utils.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\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":";;;;;AAAa;AAOb;AACA;AACA;AACA;;AAEE;;;;AAEA;AAMF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;;AAMP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACsC;;AAElC;AACF;;AASF;;"}

package/dist/shared/utils/common.cjs.js

@@ -0,0 +1,8 @@
+'use strict';
+
+var isSSR = function isSSR() {
+  return typeof window === 'undefined';
+};
+
+exports.isSSR = isSSR;
+//# sourceMappingURL=common.cjs.js.map

package/dist/shared/utils/common.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.cjs.js","sources":["../../../../shared/utils/common.ts"],"sourcesContent":["export const range = (start: number, end: number) => {\n  if (end < start) {\n    return []; // 유효하지 않은 입력값 처리\n  }\n  return Array(end - start + 1)\n    .fill(0)\n    .map((_, idx) => start + idx);\n};\nexport const isSSR = () => typeof window === 'undefined';\n"],"names":["isSSR","window"],"mappings":";;AAQaA,IAAAA,KAAK,GAAG,SAARA,KAAKA,GAAA;EAAA,OAAS,OAAOC,MAAM,KAAK,WAAW,CAAA;AAAA;;;;"}

package/dist/shared/utils/common.d.ts

@@ -0,0 +1,3 @@
+export declare const range: (start: number, end: number) => number[];
+export declare const isSSR: () => boolean;
+//# sourceMappingURL=common.d.ts.map

package/dist/shared/utils/common.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../../shared/utils/common.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,KAAK,UAAW,MAAM,OAAO,MAAM,aAO/C,CAAC;AACF,eAAO,MAAM,KAAK,eAAsC,CAAC"}

package/dist/shared/utils/common.esm.js

@@ -0,0 +1,6 @@
+var isSSR = function isSSR() {
+  return typeof window === 'undefined';
+};
+
+export { isSSR };
+//# sourceMappingURL=common.esm.js.map

package/dist/shared/utils/common.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.esm.js","sources":["../../../../shared/utils/common.ts"],"sourcesContent":["export const range = (start: number, end: number) => {\n  if (end < start) {\n    return []; // 유효하지 않은 입력값 처리\n  }\n  return Array(end - start + 1)\n    .fill(0)\n    .map((_, idx) => start + idx);\n};\nexport const isSSR = () => typeof window === 'undefined';\n"],"names":["isSSR","window"],"mappings":"AAQaA,IAAAA,KAAK,GAAG,SAARA,KAAKA,GAAA;EAAA,OAAS,OAAOC,MAAM,KAAK,WAAW,CAAA;AAAA;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remember-web/mixin",
-  "version": "0.1.11",
+  "version": "0.1.13",
   "description": "Remember Web Mixins",
   "homepage": "https://dramancompany.github.io/remember-web-packages/",
   "author": "Remember",
@@ -16,9 +16,8 @@
   "scripts": {
     "build": "rollup -c && yarn fix:dts-alias",
     "fix:dts-alias": "yarn tsc-alias -p tsconfig.alias.json",
-    "type-check": "tsc -p ./tsconfig.json",
-    "lint": "eslint src --fix --ext .js,.jsx,.ts,.tsx --cache",
-    "release": "yarn build && npm publish"
+    "type-check": "tsc -p ./tsconfig.cli.json",
+    "lint": "eslint src --fix --ext .js,.jsx,.ts,.tsx --cache"
   },
   "files": [
     "dist",

package/src/colors/color.stories.tsx

@@ -0,0 +1,67 @@
+import type { Meta } from '@storybook/react';
+import { useRUI } from '@remember-web/mixin';
+import { Grid, Typography } from '@remember-web/primitive';
+
+import type { RUIColorVariable, ThemeType } from './types';
+import * as colors from './variables';
+import { getHexFromRuiCssVariable, getRgba } from './utils';
+
+const meta = {
+  title: 'Mixins/Colors',
+} satisfies Meta;
+
+const ColorChip = ({
+  colorName,
+  color,
+  theme,
+}: {
+  colorName: string;
+  color: string;
+  theme: ThemeType;
+}) => (
+  <div
+    style={{
+      borderRadius: 4,
+      overflow: 'hidden',
+      boxShadow: `0 3px 12px 0px ${getRgba(colors.contents000, 0.1)}`,
+    }}
+  >
+    <div style={{ backgroundColor: color, width: '100%', height: '100px' }} />
+    <div
+      style={{ padding: 8, display: 'flex', justifyContent: 'space-between' }}
+    >
+      <Typography variant="Title1">{colorName}</Typography>
+      <Typography variant="Body1" color={colors.contents100}>
+        {getHexFromRuiCssVariable({
+          colorVariable: color as RUIColorVariable,
+          theme,
+        })}
+      </Typography>
+    </div>
+  </div>
+);
+
+export const Overview = {
+  render: () => {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    const { currentTheme } = useRUI();
+
+    return (
+      <div>
+        <Typography variant="Headline">Colors</Typography>
+        <Grid columns={2} columnGap="16px" rowGap="16px">
+          {Object.entries(colors).map(([key, value]) => (
+            <ColorChip
+              key={value}
+              colorName={key}
+              color={value}
+              theme={currentTheme}
+            />
+          ))}
+        </Grid>
+      </div>
+    );
+  },
+};
+
+export default meta;

package/src/provider/index.tsx

@@ -47,7 +47,7 @@ export function useRUI() {
   const ruiContextValue = useContext(RUIContext);
 
   if (ruiContextValue === null) {
-    throw new Error('useRUI must be used within RUIProvider');
+    throw new Error('useRUI must be used within RUIProvider!');
   }
 
   return ruiContextValue;