@lablup/ui-common 0.1.0-alpha.1 → 0.1.0-alpha.11

package/dist/styles/themes/bliss-dark.css

@@ -1,123 +0,0 @@
-/**
- * @lablup/ui-common theme tokens: bliss-dark
- *
- * Overrides for the subset of the 104-token contract (see
- * ../base.css) that this theme customizes. Import at most one
- * theme file alongside base.css; components never import a
- * theme file themselves.
- */
-
-[data-theme="bliss-dark"] {
-  --token-boxShadow: 0 1px 3px rgba(0, 0, 0, 0.3);
-  --token-boxShadowSecondary: 0 2px 10px rgba(0, 0, 0, 0.4);
-  --token-buttonActiveTransform: translateY(1px);
-  --token-buttonBorderRadius: 3px;
-  --token-buttonDangerBg: linear-gradient(
-    180deg,
-    #ff7070 0%,
-    #ff5c5c 45%,
-    #e04040 100%
-  );
-  --token-buttonDangerBgActive: #cc3333;
-  --token-buttonDangerBgHover: linear-gradient(
-    180deg,
-    #ff8585 0%,
-    #ff7070 45%,
-    #ff5c5c 100%
-  );
-  --token-buttonDangerBorder: 1px solid #b52828;
-  --token-buttonDangerShadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 3px rgba(0, 0, 0, 0.4);
-  --token-buttonDangerText: white;
-  --token-buttonGhostBackdrop: none;
-  --token-buttonGhostBg: transparent;
-  --token-buttonGhostBgActive: rgba(255, 255, 255, 0.1);
-  --token-buttonGhostBgHover: rgba(255, 255, 255, 0.06);
-  --token-buttonGhostBorder: 1px solid transparent;
-  --token-buttonGhostBorderHover: 1px solid rgba(255, 255, 255, 0.1);
-  --token-buttonGhostShadow: none;
-  --token-buttonGhostShadowHover: none;
-  --token-buttonHoverTransform: none;
-  --token-buttonPrimaryBg: linear-gradient(
-    180deg,
-    #5a96f7 0%,
-    #4b8bf5 45%,
-    #3570d4 100%
-  );
-  --token-buttonPrimaryBgHover: linear-gradient(
-    180deg,
-    #6ba3f5 0%,
-    #5a96f7 45%,
-    #4b8bf5 100%
-  );
-  --token-buttonPrimaryBorder: 1px solid #1b4aaf;
-  --token-buttonPrimaryShadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 3px rgba(0, 0, 0, 0.4);
-  --token-buttonPrimaryShadowHover:
-    inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 4px rgba(0, 0, 0, 0.45);
-  --token-buttonSecondaryBackdrop: none;
-  --token-buttonSecondaryBg: linear-gradient(180deg, #3a3e48 0%, #2e323c 100%);
-  --token-buttonSecondaryBgActive: linear-gradient(
-    180deg,
-    #1e2228 0%,
-    #262a32 8%,
-    #282c34 94%,
-    #2e323c 100%
-  );
-  --token-buttonSecondaryBgHover: linear-gradient(180deg, #444854 0%, #3a3e48 100%);
-  --token-buttonSecondaryBorder: 1px solid #4a4e58;
-  --token-buttonSecondaryBorderHover: 1px solid #5a5e68;
-  --token-buttonSecondaryShadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.08), inset 0 -1px 0 rgba(0, 0, 0, 0.15),
-    0 1px 2px rgba(0, 0, 0, 0.3);
-  --token-buttonSuccessBg: linear-gradient(
-    180deg,
-    #5cbf60 0%,
-    #4caf50 45%,
-    #43a047 100%
-  );
-  --token-buttonSuccessBgHover: linear-gradient(
-    180deg,
-    #6dcd70 0%,
-    #5cbf60 45%,
-    #4caf50 100%
-  );
-  --token-buttonSuccessBorder: 1px solid #2e7d32;
-  --token-buttonSuccessShadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 3px rgba(0, 0, 0, 0.4);
-  --token-colorBgContainer: #22262e;
-  --token-colorBgElevated: #2a2e38;
-  --token-colorBgLayout: #1a1d24;
-  --token-colorBorder: #3a3e48;
-  --token-colorBorderSecondary: #2e323c;
-  --token-colorError: #ff5c5c;
-  --token-colorFillQuaternary: rgba(255, 255, 255, 0.02);
-  --token-colorFillSecondary: rgba(255, 255, 255, 0.06);
-  --token-colorFillTertiary: rgba(255, 255, 255, 0.04);
-  --token-colorInfo: #4b8bf5;
-  --token-colorLink: #4b8bf5;
-  --token-colorPrimary: #4b8bf5;
-  --token-colorPrimaryActive: #245edc;
-  --token-colorPrimaryBg: rgba(75, 139, 245, 0.12);
-  --token-colorPrimaryBorder: rgba(75, 139, 245, 0.3);
-  --token-colorSuccess: #4caf50;
-  --token-colorSuccessActive: #43a047;
-  --token-colorSuccessBg: rgba(76, 175, 80, 0.12);
-  --token-colorSuccessBorder: rgba(76, 175, 80, 0.4);
-  --token-colorSuccessBorderHover: rgba(76, 175, 80, 0.6);
-  --token-colorSuccessBoxShadow: 0 2px 6px rgba(76, 175, 80, 0.2);
-  --token-colorText: #e8e6e0;
-  --token-colorTextSecondary: #b5b3ac;
-  --token-colorTextTertiary: #908e88;
-  --token-colorWarning: #ffb74d;
-  --token-focusRingColor: #4b8bf5;
-  --token-focusRingOffset: 2px;
-  --token-focusRingStyle: solid;
-  --token-focusRingWidth: 2px;
-  --token-fontFamily:
-    "Tahoma", "Gulim", system-ui, -apple-system, BlinkMacSystemFont, "Ubuntu Sans",
-    "Pretendard Variable", "Segoe UI", Roboto, sans-serif;
-  --token-tabActiveBg: rgba(75, 139, 245, 0.1);
-  --token-tabFocusShadow: 0 0 0 2px rgba(75, 139, 245, 0.2);
-  --token-tabHoverBg: rgba(255, 255, 255, 0.06);
-}

package/dist/styles/themes/bliss-light.css

@@ -1,123 +0,0 @@
-/**
- * @lablup/ui-common theme tokens: bliss-light
- *
- * Overrides for the subset of the 104-token contract (see
- * ../base.css) that this theme customizes. Import at most one
- * theme file alongside base.css; components never import a
- * theme file themselves.
- */
-
-[data-theme="bliss-light"] {
-  --token-boxShadow: 0 1px 2px rgba(0, 0, 0, 0.1);
-  --token-boxShadowSecondary: 0 2px 8px rgba(0, 0, 0, 0.15);
-  --token-buttonActiveTransform: translateY(1px);
-  --token-buttonBorderRadius: 3px;
-  --token-buttonDangerBg: linear-gradient(
-    180deg,
-    #e05050 0%,
-    #c00000 45%,
-    #a30000 100%
-  );
-  --token-buttonDangerBgActive: #a30000;
-  --token-buttonDangerBgHover: linear-gradient(
-    180deg,
-    #ea6060 0%,
-    #d01010 45%,
-    #c00000 100%
-  );
-  --token-buttonDangerBorder: 1px solid #8b0000;
-  --token-buttonDangerShadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
-  --token-buttonDangerText: white;
-  --token-buttonGhostBackdrop: none;
-  --token-buttonGhostBg: transparent;
-  --token-buttonGhostBgActive: rgba(36, 94, 220, 0.12);
-  --token-buttonGhostBgHover: rgba(36, 94, 220, 0.06);
-  --token-buttonGhostBorder: 1px solid transparent;
-  --token-buttonGhostBorderHover: 1px solid rgba(36, 94, 220, 0.2);
-  --token-buttonGhostShadow: none;
-  --token-buttonGhostShadowHover: none;
-  --token-buttonHoverTransform: none;
-  --token-buttonPrimaryBg: linear-gradient(
-    180deg,
-    #4f8fef 0%,
-    #245edc 45%,
-    #1b4aaf 100%
-  );
-  --token-buttonPrimaryBgHover: linear-gradient(
-    180deg,
-    #6ba3f5 0%,
-    #3b7aee 45%,
-    #245edc 100%
-  );
-  --token-buttonPrimaryBorder: 1px solid #003ca0;
-  --token-buttonPrimaryShadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
-  --token-buttonPrimaryShadowHover:
-    inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 3px rgba(0, 0, 0, 0.25);
-  --token-buttonSecondaryBackdrop: none;
-  --token-buttonSecondaryBg: linear-gradient(180deg, #ffffff 0%, #ece9d8 100%);
-  --token-buttonSecondaryBgActive: linear-gradient(
-    180deg,
-    rgba(205, 202, 195, 1) 0%,
-    rgba(227, 227, 219, 1) 8%,
-    rgba(229, 229, 222, 1) 94%,
-    rgba(242, 242, 241, 1) 100%
-  );
-  --token-buttonSecondaryBgHover: linear-gradient(180deg, #ffffff 0%, #f1efe2 100%);
-  --token-buttonSecondaryBorder: 1px solid #aca899;
-  --token-buttonSecondaryBorderHover: 1px solid #8e8b7a;
-  --token-buttonSecondaryShadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.8), inset 0 -1px 0 rgba(0, 0, 0, 0.08),
-    0 1px 0 rgba(0, 0, 0, 0.05);
-  --token-buttonSuccessBg: linear-gradient(
-    180deg,
-    #5cad4e 0%,
-    #3c8d2f 45%,
-    #2d7a1e 100%
-  );
-  --token-buttonSuccessBgHover: linear-gradient(
-    180deg,
-    #6dbd5e 0%,
-    #4a9d3d 45%,
-    #3c8d2f 100%
-  );
-  --token-buttonSuccessBorder: 1px solid #1f5a14;
-  --token-buttonSuccessShadow:
-    inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
-  --token-colorBgContainer: #ffffff;
-  --token-colorBgElevated: #ffffff;
-  --token-colorBgLayout: #ece9d8;
-  --token-colorBorder: #aca899;
-  --token-colorBorderSecondary: #d2cfc3;
-  --token-colorError: #c00000;
-  --token-colorFillQuaternary: #faf9f5;
-  --token-colorFillSecondary: #f1efe2;
-  --token-colorFillTertiary: #f5f3ea;
-  --token-colorInfo: #245edc;
-  --token-colorLink: #245edc;
-  --token-colorPrimary: #245edc;
-  --token-colorPrimaryActive: #1b4aaf;
-  --token-colorPrimaryBg: #d6e4f9;
-  --token-colorPrimaryBorder: rgba(36, 94, 220, 0.25);
-  --token-colorSuccess: #2d7a1e;
-  --token-colorSuccessActive: #1f5a14;
-  --token-colorSuccessBg: rgba(60, 141, 47, 0.06);
-  --token-colorSuccessBorder: rgba(60, 141, 47, 0.4);
-  --token-colorSuccessBorderHover: rgba(60, 141, 47, 0.6);
-  --token-colorSuccessBoxShadow: 0 2px 6px rgba(60, 141, 47, 0.15);
-  --token-colorText: #000000;
-  --token-colorTextSecondary: #4d4d4d;
-  --token-colorTextTertiary: #6e6e6e;
-  --token-colorWarning: #9a5700;
-  --token-focusRingColor: #245edc;
-  --token-focusRingOffset: 2px;
-  --token-focusRingStyle: solid;
-  --token-focusRingWidth: 2px;
-  --token-fontFamily:
-    "Tahoma", "Gulim", system-ui, -apple-system, BlinkMacSystemFont, "Ubuntu Sans",
-    "Pretendard Variable", "Segoe UI", Roboto, sans-serif;
-  --token-tabActiveBg: rgba(36, 94, 220, 0.08);
-  --token-tabFocusShadow: 0 0 0 2px rgba(36, 94, 220, 0.15);
-  --token-tabHoverBg: #f1efe2;
-}

package/dist/styles/themes/glass-dark.css

@@ -1,124 +0,0 @@
-/**
- * @lablup/ui-common theme tokens: glass-dark
- *
- * Overrides for the subset of the 104-token contract (see
- * ../base.css) that this theme customizes. Import at most one
- * theme file alongside base.css; components never import a
- * theme file themselves.
- */
-
-[data-theme="glass-dark"] {
-  --token-boxShadow: 0 1px 3px 0 rgba(0, 0, 0, 0.3), 0 1px 2px -1px rgba(0, 0, 0, 0.2);
-  --token-boxShadowSecondary:
-    0 4px 12px 0 rgba(0, 0, 0, 0.4), 0 2px 4px -2px rgba(0, 0, 0, 0.3);
-  --token-buttonActiveTransform: scale(0.97);
-  --token-buttonBorderRadius: 624.9375rem;
-  --token-buttonDangerBg:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.15) 0%,
-      rgba(255, 255, 255, 0.04) 40%,
-      transparent 100%
-    ),
-    #ff453a;
-  --token-buttonDangerBgActive: #e03e35;
-  --token-buttonDangerBgHover:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.2) 0%,
-      rgba(255, 255, 255, 0.05) 40%,
-      transparent 100%
-    ),
-    #ff5c54;
-  --token-buttonDangerBorder: 1px solid rgba(255, 255, 255, 0.1);
-  --token-buttonDangerShadow: 0 1px 3px rgba(255, 69, 58, 0.25);
-  --token-buttonDangerText: white;
-  --token-buttonGhostBackdrop: none;
-  --token-buttonGhostBg: transparent;
-  --token-buttonGhostBgActive: rgba(255, 255, 255, 0.12);
-  --token-buttonGhostBgHover: rgba(255, 255, 255, 0.08);
-  --token-buttonGhostBorder: 1px solid transparent;
-  --token-buttonGhostBorderHover: 1px solid rgba(255, 255, 255, 0.06);
-  --token-buttonGhostShadow: none;
-  --token-buttonGhostShadowHover: none;
-  --token-buttonHoverTransform: translateY(-1px);
-  --token-buttonPrimaryBg:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.15) 0%,
-      rgba(255, 255, 255, 0.04) 40%,
-      transparent 100%
-    ),
-    var(--token-colorPrimary);
-  --token-buttonPrimaryBgHover:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.2) 0%,
-      rgba(255, 255, 255, 0.05) 40%,
-      transparent 100%
-    ),
-    #409cff;
-  --token-buttonPrimaryBorder: 1px solid rgba(255, 255, 255, 0.1);
-  --token-buttonPrimaryShadow: 0 1px 3px rgba(10, 132, 255, 0.25);
-  --token-buttonPrimaryShadowHover: 0 3px 8px rgba(10, 132, 255, 0.35);
-  --token-buttonSecondaryBackdrop: blur(12px);
-  --token-buttonSecondaryBg: rgba(255, 255, 255, 0.1);
-  --token-buttonSecondaryBgActive: rgba(255, 255, 255, 0.18);
-  --token-buttonSecondaryBgHover: rgba(255, 255, 255, 0.14);
-  --token-buttonSecondaryBorder: 1px solid rgba(255, 255, 255, 0.08);
-  --token-buttonSecondaryBorderHover: 1px solid rgba(255, 255, 255, 0.12);
-  --token-buttonSecondaryShadow: 0 1px 2px rgba(0, 0, 0, 0.15);
-  --token-buttonSuccessBg:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.15) 0%,
-      rgba(255, 255, 255, 0.04) 40%,
-      transparent 100%
-    ),
-    var(--token-colorSuccess);
-  --token-buttonSuccessBgHover:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.2) 0%,
-      rgba(255, 255, 255, 0.05) 40%,
-      transparent 100%
-    ),
-    #30db75;
-  --token-buttonSuccessBorder: 1px solid rgba(255, 255, 255, 0.1);
-  --token-buttonSuccessShadow: 0 1px 3px rgba(50, 215, 75, 0.25);
-  --token-colorBgContainer: rgba(28, 28, 30, 0.92);
-  --token-colorBgElevated: rgba(44, 44, 46, 0.95);
-  --token-colorBgLayout: rgba(0, 0, 0, 0.95);
-  --token-colorBorder: rgba(255, 255, 255, 0.1);
-  --token-colorBorderSecondary: rgba(255, 255, 255, 0.06);
-  --token-colorError: #ff453a;
-  --token-colorFillQuaternary: rgba(116, 116, 128, 0.08);
-  --token-colorFillSecondary: rgba(120, 120, 128, 0.16);
-  --token-colorFillTertiary: rgba(118, 118, 128, 0.12);
-  --token-colorInfo: #0a84ff;
-  --token-colorLink: #0a84ff;
-  --token-colorPrimary: #0a84ff;
-  --token-colorPrimaryActive: #0062cc;
-  --token-colorPrimaryBg: rgba(10, 132, 255, 0.12);
-  --token-colorPrimaryBorder: rgba(10, 132, 255, 0.3);
-  --token-colorSuccess: #32d74b;
-  --token-colorSuccessActive: #30e078;
-  --token-colorSuccessBg: rgba(50, 215, 75, 0.15);
-  --token-colorSuccessBorder: rgba(50, 215, 75, 0.4);
-  --token-colorSuccessBorderHover: rgba(50, 215, 75, 0.6);
-  --token-colorSuccessBoxShadow: 0 4px 12px rgba(50, 215, 75, 0.2);
-  --token-colorText: #f5f5f7;
-  --token-colorTextSecondary: #b8b8bc;
-  --token-colorTextTertiary: #98989d;
-  --token-colorWarning: #ff9f0a;
-  --token-focusRingColor: #409cff;
-  --token-focusRingOffset: 2px;
-  --token-focusRingStyle: solid;
-  --token-focusRingWidth: 2px;
-  --token-fontFamily:
-    system-ui, -apple-system, BlinkMacSystemFont, "Ubuntu Sans", "Pretendard Variable",
-    "Segoe UI", Roboto, sans-serif;
-  --token-tabActiveBg: rgba(10, 132, 255, 0.1);
-  --token-tabFocusShadow: 0 0 0 3px rgba(10, 132, 255, 0.2);
-  --token-tabHoverBg: rgba(120, 120, 128, 0.16);
-}

package/dist/styles/themes/glass-light.css

@@ -1,125 +0,0 @@
-/**
- * @lablup/ui-common theme tokens: glass-light
- *
- * Overrides for the subset of the 104-token contract (see
- * ../base.css) that this theme customizes. Import at most one
- * theme file alongside base.css; components never import a
- * theme file themselves.
- */
-
-[data-theme="glass-light"] {
-  --token-boxShadow:
-    0 1px 3px 0 rgba(0, 0, 0, 0.04), 0 1px 2px -1px rgba(0, 0, 0, 0.02);
-  --token-boxShadowSecondary:
-    0 4px 12px 0 rgba(0, 0, 0, 0.08), 0 2px 4px -2px rgba(0, 0, 0, 0.06);
-  --token-buttonActiveTransform: scale(0.97);
-  --token-buttonBorderRadius: 624.9375rem;
-  --token-buttonDangerBg:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.18) 0%,
-      rgba(255, 255, 255, 0.05) 40%,
-      transparent 100%
-    ),
-    #ff3b30;
-  --token-buttonDangerBgActive: #c22d26;
-  --token-buttonDangerBgHover:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.22) 0%,
-      rgba(255, 255, 255, 0.06) 40%,
-      transparent 100%
-    ),
-    #e0342b;
-  --token-buttonDangerBorder: 1px solid rgba(255, 255, 255, 0.15);
-  --token-buttonDangerShadow: 0 1px 3px rgba(255, 59, 48, 0.2);
-  --token-buttonDangerText: white;
-  --token-buttonGhostBackdrop: none;
-  --token-buttonGhostBg: transparent;
-  --token-buttonGhostBgActive: rgba(142, 142, 147, 0.16);
-  --token-buttonGhostBgHover: rgba(142, 142, 147, 0.1);
-  --token-buttonGhostBorder: 1px solid transparent;
-  --token-buttonGhostBorderHover: 1px solid rgba(0, 0, 0, 0.04);
-  --token-buttonGhostShadow: none;
-  --token-buttonGhostShadowHover: none;
-  --token-buttonHoverTransform: translateY(-1px);
-  --token-buttonPrimaryBg:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.18) 0%,
-      rgba(255, 255, 255, 0.05) 40%,
-      transparent 100%
-    ),
-    var(--token-colorPrimary);
-  --token-buttonPrimaryBgHover:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.22) 0%,
-      rgba(255, 255, 255, 0.06) 40%,
-      transparent 100%
-    ),
-    #0062cc;
-  --token-buttonPrimaryBorder: 1px solid rgba(255, 255, 255, 0.15);
-  --token-buttonPrimaryShadow: 0 1px 3px rgba(0, 122, 255, 0.2);
-  --token-buttonPrimaryShadowHover: 0 3px 8px rgba(0, 122, 255, 0.25);
-  --token-buttonSecondaryBackdrop: blur(12px);
-  --token-buttonSecondaryBg: rgba(142, 142, 147, 0.12);
-  --token-buttonSecondaryBgActive: rgba(142, 142, 147, 0.24);
-  --token-buttonSecondaryBgHover: rgba(142, 142, 147, 0.18);
-  --token-buttonSecondaryBorder: 1px solid rgba(0, 0, 0, 0.04);
-  --token-buttonSecondaryBorderHover: 1px solid rgba(0, 0, 0, 0.06);
-  --token-buttonSecondaryShadow: 0 1px 2px rgba(0, 0, 0, 0.04);
-  --token-buttonSuccessBg:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.18) 0%,
-      rgba(255, 255, 255, 0.05) 40%,
-      transparent 100%
-    ),
-    var(--token-colorSuccess);
-  --token-buttonSuccessBgHover:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.22) 0%,
-      rgba(255, 255, 255, 0.06) 40%,
-      transparent 100%
-    ),
-    #1a6d3b;
-  --token-buttonSuccessBorder: 1px solid rgba(255, 255, 255, 0.15);
-  --token-buttonSuccessShadow: 0 1px 3px rgba(52, 199, 89, 0.2);
-  --token-colorBgContainer: rgba(255, 255, 255, 0.92);
-  --token-colorBgElevated: rgba(255, 255, 255, 0.95);
-  --token-colorBgLayout: rgba(242, 242, 247, 0.95);
-  --token-colorBorder: rgba(0, 0, 0, 0.08);
-  --token-colorBorderSecondary: rgba(0, 0, 0, 0.05);
-  --token-colorError: #c22d26;
-  --token-colorFillQuaternary: rgba(116, 116, 128, 0.04);
-  --token-colorFillSecondary: rgba(120, 120, 128, 0.08);
-  --token-colorFillTertiary: rgba(118, 118, 128, 0.06);
-  --token-colorInfo: #005eb8;
-  --token-colorLink: #007aff;
-  --token-colorPrimary: #007aff;
-  --token-colorPrimaryActive: #004999;
-  --token-colorPrimaryBg: rgba(0, 122, 255, 0.08);
-  --token-colorPrimaryBorder: rgba(0, 122, 255, 0.2);
-  --token-colorSuccess: #1d7d43;
-  --token-colorSuccessActive: #165c33;
-  --token-colorSuccessBg: rgba(52, 199, 89, 0.05);
-  --token-colorSuccessBorder: rgba(52, 199, 89, 0.4);
-  --token-colorSuccessBorderHover: rgba(52, 199, 89, 0.6);
-  --token-colorSuccessBoxShadow: 0 4px 12px rgba(52, 199, 89, 0.15);
-  --token-colorText: #1d1d1f;
-  --token-colorTextSecondary: #545458;
-  --token-colorTextTertiary: #6e6e73;
-  --token-colorWarning: #9a5700;
-  --token-focusRingColor: #007aff;
-  --token-focusRingOffset: 2px;
-  --token-focusRingStyle: solid;
-  --token-focusRingWidth: 2px;
-  --token-fontFamily:
-    system-ui, -apple-system, BlinkMacSystemFont, "Ubuntu Sans", "Pretendard Variable",
-    "Segoe UI", Roboto, sans-serif;
-  --token-tabActiveBg: rgba(0, 122, 255, 0.08);
-  --token-tabFocusShadow: 0 0 0 3px rgba(0, 122, 255, 0.12);
-  --token-tabHoverBg: rgba(120, 120, 128, 0.08);
-}

package/dist/styles/themes/reverie-dark.css

@@ -1,104 +0,0 @@
-/**
- * @lablup/ui-common theme tokens: reverie-dark
- *
- * Overrides for the subset of the 104-token contract (see
- * ../base.css) that this theme customizes. Import at most one
- * theme file alongside base.css; components never import a
- * theme file themselves.
- */
-
-[data-theme="reverie-dark"] {
-  --token-boxShadow:
-    0 1px 2px 0 rgba(0, 0, 0, 0.15), 0 1px 6px -1px rgba(0, 0, 0, 0.1),
-    0 2px 4px 0 rgba(0, 0, 0, 0.1);
-  --token-boxShadowSecondary:
-    0 6px 16px 0 rgba(0, 0, 0, 0.2), 0 3px 6px -4px rgba(0, 0, 0, 0.24),
-    0 9px 28px 8px rgba(0, 0, 0, 0.15);
-  --token-buttonGhostBackdrop: none;
-  --token-buttonGhostBg: rgba(253, 164, 175, 0.04);
-  --token-buttonGhostBgHover: rgba(253, 164, 175, 0.1);
-  --token-buttonGhostBorder: 1px solid transparent;
-  --token-buttonGhostShadow: none;
-  --token-buttonGhostShadowHover: 0 0 14px rgba(253, 164, 175, 0.1);
-  --token-buttonPrimaryBg:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.2) 0%,
-      rgba(255, 255, 255, 0.03) 50%,
-      transparent 100%
-    ),
-    var(--token-colorPrimary);
-  --token-buttonPrimaryBgHover:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.3) 0%,
-      rgba(255, 255, 255, 0.06) 50%,
-      transparent 100%
-    ),
-    #fb7185;
-  --token-buttonPrimaryBorder: 1px solid rgba(255, 255, 255, 0.15);
-  --token-buttonPrimaryShadow:
-    0 2px 8px rgba(253, 164, 175, 0.35), 0 0 20px rgba(253, 164, 175, 0.12),
-    inset 0 1px 1px rgba(255, 255, 255, 0.2);
-  --token-buttonPrimaryShadowHover:
-    0 4px 14px rgba(253, 164, 175, 0.45), 0 0 24px rgba(253, 164, 175, 0.18),
-    inset 0 1px 1px rgba(255, 255, 255, 0.25);
-  --token-buttonSecondaryBackdrop: blur(4px);
-  --token-buttonSecondaryBg: rgba(253, 164, 175, 0.08);
-  --token-buttonSecondaryBgHover: rgba(253, 164, 175, 0.14);
-  --token-buttonSecondaryBorder: 1px solid rgba(253, 164, 175, 0.2);
-  --token-buttonSecondaryBorderHover: 1px solid rgba(253, 164, 175, 0.35);
-  --token-buttonSecondaryShadow:
-    0 1px 4px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.05);
-  --token-buttonSuccessBg:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.2) 0%,
-      rgba(255, 255, 255, 0.03) 50%,
-      transparent 100%
-    ),
-    var(--token-colorSuccess);
-  --token-buttonSuccessBgHover:
-    linear-gradient(
-      180deg,
-      rgba(255, 255, 255, 0.3) 0%,
-      rgba(255, 255, 255, 0.06) 50%,
-      transparent 100%
-    ),
-    #04b898;
-  --token-buttonSuccessBorder: 1px solid rgba(255, 255, 255, 0.15);
-  --token-buttonSuccessShadow:
-    0 2px 8px rgba(3, 164, 135, 0.35), inset 0 1px 1px rgba(255, 255, 255, 0.2);
-  --token-colorBgContainer: #1f1f1f;
-  --token-colorBgElevated: #262626;
-  --token-colorBgLayout: #121212;
-  --token-colorBorder: #424242;
-  --token-colorBorderSecondary: #303030;
-  --token-colorError: #dc4446;
-  --token-colorFillQuaternary: rgba(255, 255, 255, 0.04);
-  --token-colorFillSecondary: #262626;
-  --token-colorFillTertiary: #1a1a1a;
-  --token-colorInfo: #009bdd;
-  --token-colorLink: #fda4af;
-  --token-colorPrimary: #fda4af;
-  --token-colorPrimaryActive: #f43f5e;
-  --token-colorPrimaryBg: rgba(253, 164, 175, 0.12);
-  --token-colorPrimaryBorder: rgba(253, 164, 175, 0.25);
-  --token-colorSuccess: #03a487;
-  --token-colorSuccessActive: #05cca8;
-  --token-colorSuccessBg: rgba(3, 164, 135, 0.15);
-  --token-colorSuccessBorder: rgba(3, 164, 135, 0.4);
-  --token-colorSuccessBorderHover: rgba(3, 164, 135, 0.6);
-  --token-colorSuccessBoxShadow: 0 4px 12px rgba(3, 164, 135, 0.2);
-  --token-colorText: #ffffff;
-  --token-colorTextSecondary: #b3b3b3;
-  --token-colorTextTertiary: #8c8c8c;
-  --token-colorWarning: #d89614;
-  --token-focusRingColor: #fda4af;
-  --token-focusRingOffset: 2px;
-  --token-focusRingStyle: solid;
-  --token-focusRingWidth: 2px;
-  --token-tabActiveBg: rgba(253, 164, 175, 0.1);
-  --token-tabFocusShadow: 0 0 0 3px rgba(253, 164, 175, 0.2);
-  --token-tabHoverBg: rgba(255, 255, 255, 0.05);
-}