@uncinq/component-tokens 1.0.0 → 1.0.1

package/dist/css/components/alert.css

@@ -6,6 +6,8 @@
 @layer config {
   :root {
     --alert-border-radius: var(--radius-none);
+    --alert-border-style: var(--border-style-normal);
+    --alert-border-width: var(--border-width-sm);
     --alert-font-size: var(--font-size-small);
     --alert-gap: var(--spacing-sm);
     --alert-margin: 0;

package/dist/css/components/breadcrumb.css

@@ -5,7 +5,6 @@
 /* components/breadcrumb.css */
 @layer config {
   :root {
-    --breadcrumb-border: var(--breadcrumb-border-width) var(--breadcrumb-border-style) var(--breadcrumb-color-border);
     --breadcrumb-border-style: var(--border-style-normal);
     --breadcrumb-border-width: var(--border-width-sm);
     --breadcrumb-color-border: var(--color-border);

package/dist/css/components/card.css

@@ -5,7 +5,6 @@
 /* components/card.css */
 @layer config {
   :root {
-    --card-border: var(--card-border-width) var(--card-border-style) var(--card-color-border);
     --card-border-radius: var(--item-border-radius);
     --card-border-style: var(--item-border-style);
     --card-border-width: var(--item-border-width);
@@ -26,6 +25,6 @@
     --card-title-font-size: var(--item-title-font-size);
     --card-title-font-weight: var(--item-title-font-weight);
     --card-title-line-height: var(--item-title-line-height);
-    --card-transition: box-shadow var(--duration-normal) var(--easing-default);
+    --card-transition: var(--transition-box-shadow);
   }
 }

package/dist/css/components/embed.css

@@ -5,7 +5,6 @@
 /* components/embed.css */
 @layer config {
   :root {
-    --embed-border: var(--embed-border-width) var(--embed-border-style) var(--embed-color-border);
     --embed-border-radius: var(--radius-none);
     --embed-border-style: var(--border-style-normal);
     --embed-border-width: var(--border-width-sm);

package/dist/css/components/item.css

@@ -22,14 +22,14 @@
     --item-media-color-background: var(--media-color-background);
     --item-media-order: -2;
     --item-media-ratio: var(--media-ratio);
-    --item-metas-border: var(--border-width-sm) var(--border-style-normal) var(--color-border);
     --item-metas-border-end: 0;
     --item-metas-border-start: 0;
     --item-metas-color-background: var(--item-color-background);
     --item-metas-font-size: var(--font-size-2xs);
     --item-metas-order: -1;
     --item-metas-padding-inline: var(--spacing-card);
-    --item-metas-padding-block: var(--spacing-card) 0;
+    --item-metas-padding-block-start: var(--spacing-card);
+    --item-metas-padding-block-end: 0;
     --item-order: none;
     --item-padding-inline: var(--spacing-card);
     --item-padding-block: var(--spacing-card);
@@ -39,6 +39,6 @@
     --item-title-font-size: var(--font-size-md);
     --item-title-font-weight: var(--font-weight-heading);
     --item-title-line-height: var(--line-height-heading);
-    --item-transition: box-shadow var(--duration-normal) var(--easing-default);
+    --item-transition: var(--transition-box-shadow);
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uncinq/component-tokens",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Framework-agnostic CSS design tokens — component layers.",
   "license": "MIT",
   "repository": {

package/tokens/components/alert.json

@@ -4,6 +4,14 @@
       "radius": {
         "$value": "{radius.none}", 
         "$type": "dimension" 
+      },
+      "style":   { 
+        "$value": "{border.style.normal}", 
+        "$type": "strokeStyle" 
+      },
+      "width":   { 
+        "$value": "{border.width.sm}", 
+        "$type": "dimension" 
       }
     },
     "fontSize": {

package/tokens/components/breadcrumb.json

@@ -1,10 +1,6 @@
 {
   "breadcrumb": {
     "border": {
-      "default": { 
-        "$value": "{breadcrumb.border.width} {breadcrumb.border.style} {breadcrumb.color.border}", 
-        "$type": "string" 
-      },
       "style":   { 
         "$value": "{border.style.normal}", 
         "$type": "strokeStyle" 

package/tokens/components/card.json

@@ -1,10 +1,6 @@
 {
   "card": {
     "border": {
-      "default": {
-        "$value": "{card.border.width} {card.border.style} {card.color.border}",
-        "$type": "string"
-      },
       "radius": {
         "$value": "{item.border.radius}",
         "$type": "dimension"
@@ -101,7 +97,7 @@
       }
     },
     "transition": {
-      "$value": "box-shadow var(--duration-normal) var(--easing-default)",
+      "$value": "{transition.boxShadow}",
       "$type": "string"
     }
   }

package/tokens/components/embed.json

@@ -1,10 +1,6 @@
 {
   "embed": {
     "border": {
-      "default": { 
-        "$value": "{embed.border.width} {embed.border.style} {embed.color.border}", 
-        "$type": "string" 
-      },
       "radius":  { 
         "$value": "{radius.none}", 
         "$type": "dimension" 

package/tokens/components/item.json

@@ -88,10 +88,6 @@
     },
     "metas": {
       "border": {
-        "default": {
-          "$value": "{border.width.sm} {border.style.normal} {color.border.default}",
-          "$type": "string"
-        },
         "end": {
           "$value": "0",
           "$type": "dimension"
@@ -121,8 +117,14 @@
           "$type": "dimension"
         },
         "block": {
-          "$value": "{spacing.card} 0",
-          "$type": "string"
+          "start": {
+            "$value": "{spacing.card}",
+            "$type": "dimension"
+          },
+          "end": {
+            "$value": "0",
+            "$type": "dimension"
+          }
         }
       }
     },
@@ -169,7 +171,7 @@
       }
     },
     "transition": { 
-      "$value": "box-shadow var(--duration-normal) var(--easing-default)",
+      "$value": "{transition.boxShadow}",
       "$type": "string" 
     }
   }