shad-m 1.0.0

package/dist/theme.mjs

@@ -0,0 +1,327 @@
+const baseFontSizes = {
+  // Typography classes theo design system mới
+  // Format: T{size}SB (Semi bold / 500), T{size}M (Medium / 500), T{size} (Regular / 400)
+  // T56 (56px font size, 72px line height) - tracking -1%
+  // Regular = 400, Semibold = 500
+  t56sb: ["56px", { lineHeight: "72px", fontWeight: "500", letterSpacing: "-0.01em" }],
+  t56m: ["56px", { lineHeight: "72px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  t56: ["56px", { lineHeight: "72px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  // T48 (48px font size, 64px line height) - tracking -1%
+  t48sb: ["48px", { lineHeight: "64px", fontWeight: "500", letterSpacing: "-0.01em" }],
+  t48m: ["48px", { lineHeight: "64px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  t48: ["48px", { lineHeight: "64px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  // T36 (36px font size, 44px line height) - tracking -1%
+  t36sb: ["36px", { lineHeight: "44px", fontWeight: "500", letterSpacing: "-0.01em" }],
+  t36m: ["36px", { lineHeight: "44px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  t36: ["36px", { lineHeight: "44px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  // T32 (32px font size, 40px line height) - tracking -1%
+  t32sb: ["32px", { lineHeight: "40px", fontWeight: "500", letterSpacing: "-0.01em" }],
+  t32m: ["32px", { lineHeight: "40px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  t32: ["32px", { lineHeight: "40px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  // T24 (24px font size, 32px line height) - tracking -1%
+  t24sb: ["24px", { lineHeight: "32px", fontWeight: "500", letterSpacing: "-0.01em" }],
+  t24m: ["24px", { lineHeight: "32px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  t24: ["24px", { lineHeight: "32px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  // T20 (20px font size, 28px line height) - tracking -1%
+  t20sb: ["20px", { lineHeight: "28px", fontWeight: "500", letterSpacing: "-0.01em" }],
+  t20m: ["20px", { lineHeight: "28px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  t20: ["20px", { lineHeight: "28px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  // T18 (18px font size, 28px line height) - tracking -1%
+  // From T12 to T18: Regular = 400, Medium = 400, Semibold = 500
+  t18sb: ["18px", { lineHeight: "28px", fontWeight: "500", letterSpacing: "-0.01em" }],
+  t18m: ["18px", { lineHeight: "28px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  t18: ["18px", { lineHeight: "28px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  // T16 (16px font size, 24px line height) - tracking -1%
+  t16sb: ["16px", { lineHeight: "24px", fontWeight: "500", letterSpacing: "-0.01em" }],
+  t16m: ["16px", { lineHeight: "24px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  t16: ["16px", { lineHeight: "24px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  // T14 (14px font size, 20px line height) - tracking -1%
+  t14sb: ["14px", { lineHeight: "20px", fontWeight: "500", letterSpacing: "-0.01em" }],
+  t14m: ["14px", { lineHeight: "20px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  t14: ["14px", { lineHeight: "20px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  // T12 (12px font size, 16px line height) - tracking -1%
+  t12sb: ["12px", { lineHeight: "16px", fontWeight: "500", letterSpacing: "-0.01em" }],
+  t12m: ["12px", { lineHeight: "16px", fontWeight: "400", letterSpacing: "-0.01em" }],
+  t12: ["12px", { lineHeight: "16px", fontWeight: "400", letterSpacing: "-0.01em" }]
+};
+const TYPOGRAPHY = {
+  // Font sizes với line heights và font weight tương ứng
+  fontSize: {
+    ...baseFontSizes,
+    // Tailwind base sizes (bảo đảm tương thích)
+    xs: baseFontSizes.t12,
+    sm: baseFontSizes.t14,
+    base: baseFontSizes.t16,
+    lg: baseFontSizes.t18,
+    xl: baseFontSizes.t20,
+    "2xl": baseFontSizes.t24,
+    "3xl": baseFontSizes.t32,
+    "4xl": baseFontSizes.t36,
+    "5xl": baseFontSizes.t48,
+    "6xl": baseFontSizes.t56
+  },
+  fontWeight: {
+    normal: "400",
+    medium: "500",
+    semibold: "500",
+    bold: "500"
+  },
+  // Font families
+  fontFamily: {
+    sans: ["var(--font-inter)", "Inter", "sans-serif"]
+  }
+};
+const COLORS = {
+  // Hệ thống màu cơ bản theo yêu cầu mới (HSL format)
+  blue: {
+    100: "225 100% 97%",
+    // #eff3ff
+    200: "224 100% 92%",
+    // #d7e2ff
+    300: "223 100% 83%",
+    // #a8c0ff
+    400: "223 90% 63%",
+    // #4b7bf6
+    500: "223 93% 50%",
+    // #094bf4
+    600: "223 93% 35%",
+    // #0635ad
+    700: "223 92% 21%",
+    // #042066
+    800: "223 100% 13%"
+    // #001342
+  },
+  red: {
+    100: "3 100% 96%",
+    // #ffeeed
+    200: "3 100% 93%",
+    // #ffdcda
+    300: "4 100% 82%",
+    // #ffabab
+    400: "4 93% 67%",
+    // #f9655b
+    500: "4 79% 52%",
+    // #e52e22
+    600: "4 84% 42%",
+    // #f9655b
+    700: "4 89% 31%",
+    // #f9655b
+    800: "4 88% 23%"
+    // #f9655b
+  },
+  green: {
+    100: "143 69% 95%",
+    // #e9fbf0
+    200: "145 86% 86%",
+    // #bffad8
+    300: "144 81% 77%",
+    // #95f4bb
+    400: "145 75% 57%",
+    // #3fe382
+    500: "144 84% 43%",
+    // #12ca5b
+    600: "144 80% 36%",
+    // #3fe382
+    700: "144 86% 25%",
+    // #3fe382
+    800: "144 84% 18%"
+    // #3fe382
+  },
+  orange: {
+    100: "29 100% 95%",
+    // #fff3e8
+    200: "29 100% 86%",
+    // #ffdab7
+    300: "29 100% 75%",
+    // #ffbe80
+    400: "29 100% 64%",
+    // #ff9f46
+    500: "29 100% 55%",
+    // #ff8718
+    600: "29 97% 40%",
+    // #ff9f46
+    700: "29 91% 29%",
+    // #ff9f46
+    800: "25 94% 21%"
+    // #ff9f46
+  },
+  yellow: {
+    100: "50 100% 95%",
+    // #fffdf5
+    200: "50 100% 88%",
+    // #fff1b8
+    300: "50 100% 77%",
+    // #ffe47a
+    400: "50 100% 67%",
+    // #ffd83d
+    500: "50 100% 55%",
+    // #ffd603
+    600: "47 91% 46%",
+    // #c29b00
+    700: "43 86% 40%",
+    // #856a00
+    800: "44 95% 25%"
+    // #473900
+  },
+  purple: {
+    100: "258 100% 98%",
+    // #f8f5ff
+    200: "259 100% 86%",
+    // #cfb8ff
+    300: "260 100% 74%",
+    // #a77eff
+    400: "260 100% 62%",
+    // #7e5dff
+    500: "263 100% 51%",
+    // #6203ff
+    600: "260 100% 38%",
+    // #4100c2
+    700: "260 100% 26%",
+    // #2c0085
+    800: "260 100% 14%"
+    // #180047
+  },
+  cyan: {
+    100: "192 100% 98%",
+    // #f5fdff
+    200: "189 100% 86%",
+    // #b8f4ff
+    300: "189 100% 74%",
+    // #7aebff
+    400: "189 100% 62%",
+    // #3de1ff
+    500: "189 100% 50%",
+    // #02d8ff
+    600: "189 100% 38%",
+    // #00a4c2
+    700: "189 100% 26%",
+    // #007084
+    800: "188 100% 14%"
+    // #003d47
+  },
+  // Ink variants với opacity và solid versions (HSL format)
+  // Ink variants với opacity và solid versions (HSL format)
+  ink: {
+    "50": "0 0% 96% / 0.04",
+    // rgba(0, 0, 0, 0.04)
+    "100": "0 0% 0% / 0.08",
+    // rgba(0, 0, 0, 0.08)
+    "200": "0 0% 0% / 0.12",
+    // rgba(0, 0, 0, 0.12)
+    "300": "0 0% 0% / 0.35",
+    // rgba(0, 0, 0, 0.35)
+    "400": "0 0% 0% / 0.55",
+    // rgba(0, 0, 0, 0.55)
+    "500": "0 0% 0%",
+    // #000000
+    "50s": "0 0% 96%",
+    // #f4f4f4
+    "100s": "0 0% 92%",
+    // #eaeaea
+    "200s": "0 0% 87%",
+    // #dfdfe7 (corrected)
+    "300s": "0 0% 62%",
+    // #bbbbbb
+    "400s": "0 0% 44%",
+    // #6f6f6f
+    "500s": "0 0% 0%"
+    // #000000
+  },
+  white: {
+    "100": "0 0% 100% / 0.05",
+    // rgba(255, 255, 255, 0.05)
+    "200": "0 0% 100% / 0.1",
+    // rgba(255, 255, 255, 0.1)
+    "300": "0 0% 100% / 0.3",
+    // rgba(255, 255, 255, 0.3)
+    "400": "0 0% 100% / 0.5",
+    // rgba(255, 255, 255, 0.5)
+    "500": "0 0% 100%",
+    // #FFFFFF
+    "500s": "0 0% 100%",
+    // #FFFFFF
+    DEFAULT: "0 0% 100%"
+    // #FFFFFF
+  },
+  black: {
+    DEFAULT: "0 0% 0%"
+    // #000000
+  },
+  // Màu trạng thái (HSL format)
+  primary: {
+    DEFAULT: "223 93% 50%",
+    // #094bf4 (corrected)
+    foreground: "210 40% 98%"
+    // #f8fafc
+  },
+  error: {
+    DEFAULT: "4 79% 52%"
+    // #e52e22 (corrected from HSL picker)
+  },
+  success: {
+    DEFAULT: "162 83% 42%"
+    // #12c58e (corrected)
+  },
+  warning: {
+    DEFAULT: "27 89% 52%"
+    // #f17818 (corrected)
+  },
+  info: {
+    DEFAULT: "223 93% 50%"
+    // #094bf4 (corrected)
+  }
+};
+const EFFECTS = {
+  boxShadow: {
+    "8": "0 8px 24px -4px hsl(224 100% 17% / 0.1)",
+    // rgba(0, 9, 87, 0.1) -> HSL
+    "24": "0 24px 28px -8px hsl(224 100% 17% / 0.1)",
+    // rgba(0, 9, 87, 0.1) -> HSL
+    "32": "0 20px 48px -12px hsl(224 100% 17% / 0.1)"
+    // rgba(0, 9, 87, 0.1) -> HSL
+  }
+};
+const SCREENS = {
+  screens: {
+    sm: "375px",
+    md: "790px",
+    // tablet lớn / laptop nhỏ
+    lg: "1280px",
+    // desktop chuẩn
+    xl: "1440px"
+    // desktop lớn / full HD
+    // '2xl': '1652px', // wide / 2K screen
+  },
+  container: {
+    padding: {
+      DEFAULT: "16px",
+      md: "20px",
+      // tablet
+      xl: "38px",
+      // desktop
+      "2xl": "20px"
+      // wide
+    },
+    center: true,
+    screens: {
+      xs: "100%",
+      // mobile
+      md: "754px",
+      // tablet
+      xl: "1164px",
+      // desktop
+      "2xl": "1612px"
+      // wide
+    }
+  }
+};
+const THEME = {
+  ...TYPOGRAPHY,
+  ...SCREENS,
+  colors: COLORS,
+  ...EFFECTS
+};
+
+export { COLORS, EFFECTS, SCREENS, THEME, TYPOGRAPHY };
+//# sourceMappingURL=theme.mjs.map
+//# sourceMappingURL=theme.mjs.map

package/dist/theme.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/theme.ts"],"names":[],"mappings":"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","file":"theme.mjs","sourcesContent":["/**\n * Design System\n * Định nghĩa các tokens cho hệ thống thiết kế\n */\n\nconst baseFontSizes = {\n  // Typography classes theo design system mới\n  // Format: T{size}SB (Semi bold / 500), T{size}M (Medium / 500), T{size} (Regular / 400)\n\n  // T56 (56px font size, 72px line height) - tracking -1%\n  // Regular = 400, Semibold = 500\n  t56sb: ['56px', { lineHeight: '72px', fontWeight: '500', letterSpacing: '-0.01em' }],\n  t56m: ['56px', { lineHeight: '72px', fontWeight: '400', letterSpacing: '-0.01em' }],\n  t56: ['56px', { lineHeight: '72px', fontWeight: '400', letterSpacing: '-0.01em' }],\n\n  // T48 (48px font size, 64px line height) - tracking -1%\n  t48sb: ['48px', { lineHeight: '64px', fontWeight: '500', letterSpacing: '-0.01em' }],\n  t48m: ['48px', { lineHeight: '64px', fontWeight: '400', letterSpacing: '-0.01em' }],\n  t48: ['48px', { lineHeight: '64px', fontWeight: '400', letterSpacing: '-0.01em' }],\n\n  // T36 (36px font size, 44px line height) - tracking -1%\n  t36sb: ['36px', { lineHeight: '44px', fontWeight: '500', letterSpacing: '-0.01em' }],\n  t36m: ['36px', { lineHeight: '44px', fontWeight: '400', letterSpacing: '-0.01em' }],\n  t36: ['36px', { lineHeight: '44px', fontWeight: '400', letterSpacing: '-0.01em' }],\n\n  // T32 (32px font size, 40px line height) - tracking -1%\n  t32sb: ['32px', { lineHeight: '40px', fontWeight: '500', letterSpacing: '-0.01em' }],\n  t32m: ['32px', { lineHeight: '40px', fontWeight: '400', letterSpacing: '-0.01em' }],\n  t32: ['32px', { lineHeight: '40px', fontWeight: '400', letterSpacing: '-0.01em' }],\n\n  // T24 (24px font size, 32px line height) - tracking -1%\n  t24sb: ['24px', { lineHeight: '32px', fontWeight: '500', letterSpacing: '-0.01em' }],\n  t24m: ['24px', { lineHeight: '32px', fontWeight: '400', letterSpacing: '-0.01em' }],\n  t24: ['24px', { lineHeight: '32px', fontWeight: '400', letterSpacing: '-0.01em' }],\n\n  // T20 (20px font size, 28px line height) - tracking -1%\n  t20sb: ['20px', { lineHeight: '28px', fontWeight: '500', letterSpacing: '-0.01em' }],\n  t20m: ['20px', { lineHeight: '28px', fontWeight: '400', letterSpacing: '-0.01em' }],\n  t20: ['20px', { lineHeight: '28px', fontWeight: '400', letterSpacing: '-0.01em' }],\n\n  // T18 (18px font size, 28px line height) - tracking -1%\n  // From T12 to T18: Regular = 400, Medium = 400, Semibold = 500\n  t18sb: ['18px', { lineHeight: '28px', fontWeight: '500', letterSpacing: '-0.01em' }],\n  t18m: ['18px', { lineHeight: '28px', fontWeight: '400', letterSpacing: '-0.01em' }],\n  t18: ['18px', { lineHeight: '28px', fontWeight: '400', letterSpacing: '-0.01em' }],\n\n  // T16 (16px font size, 24px line height) - tracking -1%\n  t16sb: ['16px', { lineHeight: '24px', fontWeight: '500', letterSpacing: '-0.01em' }],\n  t16m: ['16px', { lineHeight: '24px', fontWeight: '400', letterSpacing: '-0.01em' }],\n  t16: ['16px', { lineHeight: '24px', fontWeight: '400', letterSpacing: '-0.01em' }],\n\n  // T14 (14px font size, 20px line height) - tracking -1%\n  t14sb: ['14px', { lineHeight: '20px', fontWeight: '500', letterSpacing: '-0.01em' }],\n  t14m: ['14px', { lineHeight: '20px', fontWeight: '400', letterSpacing: '-0.01em' }],\n  t14: ['14px', { lineHeight: '20px', fontWeight: '400', letterSpacing: '-0.01em' }],\n\n  // T12 (12px font size, 16px line height) - tracking -1%\n  t12sb: ['12px', { lineHeight: '16px', fontWeight: '500', letterSpacing: '-0.01em' }],\n  t12m: ['12px', { lineHeight: '16px', fontWeight: '400', letterSpacing: '-0.01em' }],\n  t12: ['12px', { lineHeight: '16px', fontWeight: '400', letterSpacing: '-0.01em' }],\n};\n\n// Typography\nexport const TYPOGRAPHY: any = {\n  // Font sizes với line heights và font weight tương ứng\n  fontSize: {\n    ...baseFontSizes,\n\n    // Tailwind base sizes (bảo đảm tương thích)\n    xs: baseFontSizes.t12,\n    sm: baseFontSizes.t14,\n    base: baseFontSizes.t16,\n    lg: baseFontSizes.t18,\n    xl: baseFontSizes.t20,\n    '2xl': baseFontSizes.t24,\n    '3xl': baseFontSizes.t32,\n    '4xl': baseFontSizes.t36,\n    '5xl': baseFontSizes.t48,\n    '6xl': baseFontSizes.t56,\n  },\n\n  fontWeight: {\n    normal: '400',\n    medium: '500',\n    semibold: '500',\n    bold: '500',\n  },\n\n  // Font families\n  fontFamily: {\n    sans: ['var(--font-inter)', 'Inter', 'sans-serif'],\n  },\n};\n\n// Colors (converted to HSL format)\nexport const COLORS: any = {\n  // Hệ thống màu cơ bản theo yêu cầu mới (HSL format)\n  blue: {\n    100: '225 100% 97%', // #eff3ff\n    200: '224 100% 92%', // #d7e2ff\n    300: '223 100% 83%', // #a8c0ff\n    400: '223 90% 63%', // #4b7bf6\n    500: '223 93% 50%', // #094bf4\n    600: '223 93% 35%', // #0635ad\n    700: '223 92% 21%', // #042066\n    800: '223 100% 13%', // #001342\n  },\n  red: {\n    100: '3 100% 96%', // #ffeeed\n    200: '3 100% 93%', // #ffdcda\n    300: '4 100% 82%', // #ffabab\n    400: '4 93% 67%', // #f9655b\n    500: '4 79% 52%', // #e52e22\n    600: '4 84% 42%', // #f9655b\n    700: '4 89% 31%', // #f9655b\n    800: '4 88% 23%', // #f9655b\n  },\n  green: {\n    100: '143 69% 95%', // #e9fbf0\n    200: '145 86% 86%', // #bffad8\n    300: '144 81% 77%', // #95f4bb\n    400: '145 75% 57%', // #3fe382\n    500: '144 84% 43%', // #12ca5b\n    600: '144 80% 36%', // #3fe382\n    700: '144 86% 25%', // #3fe382\n    800: '144 84% 18%', // #3fe382\n  },\n  orange: {\n    100: '29 100% 95%', // #fff3e8\n    200: '29 100% 86%', // #ffdab7\n    300: '29 100% 75%', // #ffbe80\n    400: '29 100% 64%', // #ff9f46\n    500: '29 100% 55%', // #ff8718\n    600: '29 97% 40%', // #ff9f46\n    700: '29 91% 29%', // #ff9f46\n    800: '25 94% 21%', // #ff9f46\n  },\n  yellow: {\n    100: '50 100% 95%', // #fffdf5\n    200: '50 100% 88%', // #fff1b8\n    300: '50 100% 77%', // #ffe47a\n    400: '50 100% 67%', // #ffd83d\n    500: '50 100% 55%', // #ffd603\n    600: '47 91% 46%', // #c29b00\n    700: '43 86% 40%', // #856a00\n    800: '44 95% 25%', // #473900\n  },\n  purple: {\n    100: '258 100% 98%', // #f8f5ff\n    200: '259 100% 86%', // #cfb8ff\n    300: '260 100% 74%', // #a77eff\n    400: '260 100% 62%', // #7e5dff\n    500: '263 100% 51%', // #6203ff\n    600: '260 100% 38%', // #4100c2\n    700: '260 100% 26%', // #2c0085\n    800: '260 100% 14%', // #180047\n  },\n  cyan: {\n    100: '192 100% 98%', // #f5fdff\n    200: '189 100% 86%', // #b8f4ff\n    300: '189 100% 74%', // #7aebff\n    400: '189 100% 62%', // #3de1ff\n    500: '189 100% 50%', // #02d8ff\n    600: '189 100% 38%', // #00a4c2\n    700: '189 100% 26%', // #007084\n    800: '188 100% 14%', // #003d47\n  },\n  // Ink variants với opacity và solid versions (HSL format)\n  // Ink variants với opacity và solid versions (HSL format)\n  ink: {\n    '50': '0 0% 96% / 0.04', // rgba(0, 0, 0, 0.04)\n    '100': '0 0% 0% / 0.08', // rgba(0, 0, 0, 0.08)\n    '200': '0 0% 0% / 0.12', // rgba(0, 0, 0, 0.12)\n    '300': '0 0% 0% / 0.35', // rgba(0, 0, 0, 0.35)\n    '400': '0 0% 0% / 0.55', // rgba(0, 0, 0, 0.55)\n    '500': '0 0% 0%', // #000000\n    '50s': '0 0% 96%', // #f4f4f4\n    '100s': '0 0% 92%', // #eaeaea\n    '200s': '0 0% 87%', // #dfdfe7 (corrected)\n    '300s': '0 0% 62%', // #bbbbbb\n    '400s': '0 0% 44%', // #6f6f6f\n    '500s': '0 0% 0%', // #000000\n  },\n  white: {\n    '100': '0 0% 100% / 0.05', // rgba(255, 255, 255, 0.05)\n    '200': '0 0% 100% / 0.1', // rgba(255, 255, 255, 0.1)\n    '300': '0 0% 100% / 0.3', // rgba(255, 255, 255, 0.3)\n    '400': '0 0% 100% / 0.5', // rgba(255, 255, 255, 0.5)\n    '500': '0 0% 100%', // #FFFFFF\n    '500s': '0 0% 100%', // #FFFFFF\n    DEFAULT: '0 0% 100%', // #FFFFFF\n  },\n  black: {\n    DEFAULT: '0 0% 0%', // #000000\n  },\n\n  // Màu trạng thái (HSL format)\n  primary: {\n    DEFAULT: '223 93% 50%', // #094bf4 (corrected)\n    foreground: '210 40% 98%', // #f8fafc\n  },\n  error: {\n    DEFAULT: '4 79% 52%', // #e52e22 (corrected from HSL picker)\n  },\n  success: {\n    DEFAULT: '162 83% 42%', // #12c58e (corrected)\n  },\n  warning: {\n    DEFAULT: '27 89% 52%', // #f17818 (corrected)\n  },\n  info: {\n    DEFAULT: '223 93% 50%', // #094bf4 (corrected)\n  },\n};\n\n// Shadow và các hiệu ứng theo yêu cầu mới (đã loại bỏ tiền tố om)\nexport const EFFECTS: any = {\n  boxShadow: {\n    '8': '0 8px 24px -4px hsl(224 100% 17% / 0.1)', // rgba(0, 9, 87, 0.1) -> HSL\n    '24': '0 24px 28px -8px hsl(224 100% 17% / 0.1)', // rgba(0, 9, 87, 0.1) -> HSL\n    '32': '0 20px 48px -12px hsl(224 100% 17% / 0.1)', // rgba(0, 9, 87, 0.1) -> HSL\n  },\n};\n\n// Breakpoints và containers theo yêu cầu grid system\nexport const SCREENS: any = {\n  screens: {\n    sm: '375px',\n    md: '790px', // tablet lớn / laptop nhỏ\n    lg: '1280px', // desktop chuẩn\n    xl: '1440px', // desktop lớn / full HD\n    // '2xl': '1652px', // wide / 2K screen\n  },\n  container: {\n    padding: {\n      DEFAULT: '16px',\n      md: '20px', // tablet\n      xl: '38px', // desktop\n      '2xl': '20px', // wide\n    },\n    center: true,\n    screens: {\n      xs: '100%', // mobile\n      md: '754px', // tablet\n      xl: '1164px', // desktop\n      '2xl': '1612px', // wide\n    },\n  },\n};\n\n// Tất cả theme\nexport const THEME: any = {\n  ...TYPOGRAPHY,\n  ...SCREENS,\n  colors: COLORS,\n  ...EFFECTS,\n};\n"]}

package/package.json

@@ -0,0 +1,252 @@
+{
+  "name": "shad-m",
+  "version": "1.0.0",
+  "private": false,
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "sideEffects": [
+    "**/*.css",
+    "./src/globals.css",
+    "./dist/globals.css",
+    "./src/providers/**/*.tsx",
+    "./src/providers/**/*.ts",
+    "./src/common/interactive/select.tsx",
+    "./src/common/interactive/select/**/*.css"
+  ],
+  "exports": {
+    "./globals.css": {
+      "import": "./dist/globals.css",
+      "require": "./dist/globals.css",
+      "default": "./dist/globals.css"
+    },
+    "./postcss.config": "./postcss.config.mjs",
+    "./tailwind.config": "./tailwind.config.ts",
+    "./theme": {
+      "types": "./dist/theme.d.ts",
+      "import": "./dist/theme.mjs",
+      "require": "./dist/theme.js",
+      "default": "./dist/theme.js"
+    },
+    "./lib/*": {
+      "types": "./dist/lib/*.d.ts",
+      "import": "./dist/lib/*.mjs",
+      "require": "./dist/lib/*.js",
+      "default": "./dist/lib/*.js"
+    },
+    "./hooks/*": {
+      "types": "./dist/hooks/*.d.ts",
+      "import": "./dist/hooks/*.mjs",
+      "require": "./dist/hooks/*.js",
+      "default": "./dist/hooks/*.js"
+    },
+    "./components/*": {
+      "types": "./dist/components/*.d.ts",
+      "import": "./dist/components/*.mjs",
+      "require": "./dist/components/*.js",
+      "default": "./dist/components/*.js"
+    },
+    "./components/lottie": {
+      "types": "./dist/components/lottie.d.ts",
+      "import": "./dist/components/lottie.mjs",
+      "require": "./dist/components/lottie.js",
+      "default": "./dist/components/lottie.js"
+    },
+    "./providers": {
+      "types": "./dist/providers/index.d.ts",
+      "import": "./dist/providers/index.mjs",
+      "require": "./dist/providers/index.js",
+      "default": "./dist/providers/index.js"
+    },
+    "./providers/*": {
+      "types": "./dist/providers/*.d.ts",
+      "import": "./dist/providers/*.mjs",
+      "require": "./dist/providers/*.js",
+      "default": "./dist/providers/*.js"
+    },
+    "./common/pages/page-404": {
+      "types": "./dist/common/pages/page-404.d.ts",
+      "import": "./dist/common/pages/page-404.mjs",
+      "require": "./dist/common/pages/page-404.js",
+      "default": "./dist/common/pages/page-404.js"
+    },
+    "./common/pages/page-500": {
+      "types": "./dist/common/pages/page-500.d.ts",
+      "import": "./dist/common/pages/page-500.mjs",
+      "require": "./dist/common/pages/page-500.js",
+      "default": "./dist/common/pages/page-500.js"
+    },
+    "./common/interactive/date-picker": {
+      "types": "./dist/common/interactive/date-picker.d.ts",
+      "import": "./dist/common/interactive/date-picker.mjs",
+      "require": "./dist/common/interactive/date-picker.js",
+      "default": "./dist/common/interactive/date-picker.js"
+    },
+    "./common/interactive": {
+      "types": "./dist/common/interactive/index.d.ts",
+      "import": "./dist/common/interactive/index.mjs",
+      "require": "./dist/common/interactive/index.js",
+      "default": "./dist/common/interactive/index.js"
+    },
+    "./common/display/display-html-string": {
+      "types": "./dist/common/display/display-html-string.d.ts",
+      "import": "./dist/common/display/display-html-string.mjs",
+      "require": "./dist/common/display/display-html-string.js",
+      "default": "./dist/common/display/display-html-string.js"
+    },
+    "./common/forms/*": {
+      "types": "./dist/common/forms/*.d.ts",
+      "import": "./dist/common/forms/*.mjs",
+      "require": "./dist/common/forms/*.js",
+      "default": "./dist/common/forms/*.js"
+    },
+    "./common/pages/*": {
+      "types": "./dist/common/pages/*.d.ts",
+      "import": "./dist/common/pages/*.mjs",
+      "require": "./dist/common/pages/*.js",
+      "default": "./dist/common/pages/*.js"
+    },
+    "./common/interactive/*": {
+      "types": "./dist/common/interactive/*.d.ts",
+      "import": "./dist/common/interactive/*.mjs",
+      "require": "./dist/common/interactive/*.js",
+      "default": "./dist/common/interactive/*.js"
+    },
+    "./common/display/*": {
+      "types": "./dist/common/display/*.d.ts",
+      "import": "./dist/common/display/*.mjs",
+      "require": "./dist/common/display/*.js",
+      "default": "./dist/common/display/*.js"
+    },
+    "./common/*": {
+      "types": "./dist/common/*.d.ts",
+      "import": "./dist/common/*.mjs",
+      "require": "./dist/common/*.js",
+      "default": "./dist/common/*.js"
+    },
+    "./icons": {
+      "types": "./dist/icons.d.ts",
+      "import": "./dist/icons.mjs",
+      "require": "./dist/icons.js",
+      "default": "./dist/icons.js"
+    },
+    "./assets/Icon": {
+      "types": "./dist/assets/Icon/index.d.ts",
+      "import": "./dist/assets/Icon/index.mjs",
+      "require": "./dist/assets/Icon/index.js",
+      "default": "./dist/assets/Icon/index.js"
+    },
+    "./assets/Image": {
+      "types": "./dist/assets/Image/index.d.ts",
+      "import": "./dist/assets/Image/index.mjs",
+      "require": "./dist/assets/Image/index.js",
+      "default": "./dist/assets/Image/index.js"
+    },
+    "./assets/Banner": {
+      "types": "./dist/assets/Banner/index.d.ts",
+      "import": "./dist/assets/Banner/index.mjs",
+      "require": "./dist/assets/Banner/index.js",
+      "default": "./dist/assets/Banner/index.js"
+    },
+    "./assets/Animation": {
+      "types": "./dist/assets/Animation/index.d.ts",
+      "import": "./dist/assets/Animation/index.mjs",
+      "require": "./dist/assets/Animation/index.js",
+      "default": "./dist/assets/Animation/index.js"
+    }
+  },
+  "scripts": {
+    "build": "pnpm build:js && pnpm build:types && pnpm build:copy-css",
+    "build:js": "tsup",
+    "build:types": "tsc --emitDeclarationOnly",
+    "build:copy-css": "cp src/globals.css dist/globals.css && mkdir -p dist/common/interactive/select && cp src/common/interactive/select/select.css dist/common/interactive/select/select.css",
+    "dev": "tsup --watch",
+    "ui": "pnpm dlx shadcn@latest",
+    "lint": "eslint .",
+    "type-check": "tsc --noEmit",
+    "test": "echo \"No tests for ui package\"",
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist && find src -name '*.js' -delete && find src -name '*.d.ts' -delete && find src -name '*.d.ts.map' -delete && rm -f *.d.ts *.d.ts.map tsconfig.tsbuildinfo",
+    "prepublishOnly": "pnpm run build"
+  },
+  "peerDependencies": {
+    "next": ">=13",
+    "react": "^18"
+  },
+  "peerDependenciesMeta": {
+    "next": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@repo/shared-config": "workspace:*",
+    "@repo/tracking-sdk": "workspace:*",
+    "@types/node": "^20",
+    "@types/react": "^18.3.11",
+    "@types/react-lottie": "^1.2.10",
+    "autoprefixer": "^10.4.21",
+    "eslint": "^8.57.0",
+    "postcss": "^8.4.47",
+    "postcss-load-config": "^6",
+    "tailwindcss": "^3.4.13",
+    "tsup": "^8.5.1",
+    "typescript": "^5.6.3"
+  },
+  "dependencies": {
+    "@radix-ui/react-accordion": "^1.2.2",
+    "@radix-ui/react-alert-dialog": "^1.1.4",
+    "@radix-ui/react-aspect-ratio": "^1.1.1",
+    "@radix-ui/react-avatar": "^1.1.2",
+    "@radix-ui/react-checkbox": "^1.1.3",
+    "@radix-ui/react-collapsible": "^1.1.2",
+    "@radix-ui/react-context-menu": "^2.2.4",
+    "@radix-ui/react-dialog": "^1.1.4",
+    "@radix-ui/react-dropdown-menu": "^2.1.4",
+    "@radix-ui/react-hover-card": "^1.1.4",
+    "@radix-ui/react-label": "^2.1.1",
+    "@radix-ui/react-menubar": "^1.1.4",
+    "@radix-ui/react-navigation-menu": "^1.2.3",
+    "@radix-ui/react-popover": "^1.1.4",
+    "@radix-ui/react-progress": "^1.1.1",
+    "@radix-ui/react-radio-group": "^1.2.2",
+    "@radix-ui/react-scroll-area": "^1.2.2",
+    "@radix-ui/react-separator": "^1.1.1",
+    "@radix-ui/react-slider": "^1.2.2",
+    "@radix-ui/react-slot": "1.2.3",
+    "@radix-ui/react-switch": "^1.1.2",
+    "@radix-ui/react-tabs": "^1.1.2",
+    "@radix-ui/react-toggle": "^1.1.1",
+    "@radix-ui/react-toggle-group": "^1.1.1",
+    "@radix-ui/react-tooltip": "^1.1.6",
+    "@radix-ui/react-use-controllable-state": "^1.1.0",
+    "@tailwindcss/aspect-ratio": "^0.4.2",
+    "@tailwindcss/container-queries": "^0.1.1",
+    "@tailwindcss/forms": "^0.5.10",
+    "@tailwindcss/typography": "^0.5.16",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "cmdk": "^1.0.4",
+    "date-fns": "^3.6.0",
+    "dompurify": "^3.2.3",
+    "embla-carousel-react": "^8.5.1",
+    "embla-carousel-wheel-gestures": "^8.0.2",
+    "fuse.js": "^7.0.0",
+    "input-otp": "^1.4.2",
+    "lucide-react": "^0.451.0",
+    "motion": "^12.23.24",
+    "react": "^18.3.1",
+    "react-day-picker": "^9.4.3",
+    "react-hook-form": "^7.54.1",
+    "react-infinite-scroll-component": "^6.1.0",
+    "react-lottie": "^1.2.4",
+    "react-number-format": "^5.4.4",
+    "react-resizable-panels": "^2.1.7",
+    "react-virtuoso": "^4.12.0",
+    "read-vietnamese-number": "2.2.1",
+    "recharts": "^2.9.3",
+    "sonner": "^2.0.5",
+    "tailwind-merge": "^2.5.4",
+    "tailwindcss-animate": "^1.0.7",
+    "vaul": "^1.1.1",
+    "zustand": "^5.0.5"
+  }
+}

package/postcss.config.mjs

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+};