@seed-design/css 2.8.3 → 3.0.0

package/vars/component/slider.mjs

@@ -1,78 +0,0 @@
-export const vars = {
-  "base": {
-    "enabled": {
-      "root": {
-        "gap": "var(--seed-dimension-x0_5)"
-      },
-      "control": {
-        "height": "26px"
-      },
-      "track": {
-        "height": "var(--seed-dimension-x1)",
-        "cornerRadius": "var(--seed-radius-full)",
-        "color": "var(--seed-color-palette-gray-400)"
-      },
-      "range": {
-        "cornerRadius": "var(--seed-radius-full)",
-        "color": "var(--seed-color-fg-neutral)",
-        "widthDuration": "var(--seed-duration-d3)",
-        "widthTimingFunction": "var(--seed-timing-function-easing)"
-      },
-      "thumb": {
-        "size": "var(--seed-dimension-x5)",
-        "cornerRadius": "var(--seed-radius-full)",
-        "color": "var(--seed-color-bg-neutral-inverted)"
-      },
-      "valueIndicatorRoot": {
-        "color": "var(--seed-color-bg-neutral-inverted)",
-        "cornerRadius": "var(--seed-radius-r1_5)",
-        "paddingX": "var(--seed-dimension-x2)",
-        "paddingY": "var(--seed-dimension-x1)",
-        "offsetY": "var(--seed-dimension-x3)",
-        "enterScale": "0.9",
-        "enterOpacity": "0",
-        "enterDuration": "var(--seed-duration-d4)",
-        "enterTimingFunction": "var(--seed-timing-function-enter)",
-        "exitScale": "1",
-        "exitOpacity": "0",
-        "exitDuration": "var(--seed-duration-d4)",
-        "exitTimingFunction": "var(--seed-timing-function-easing)",
-        "translateDuration": "var(--seed-duration-d3)",
-        "translateTimingFunction": "var(--seed-timing-function-easing)"
-      },
-      "valueIndicatorArrow": {
-        "color": "var(--seed-color-bg-neutral-inverted)",
-        "width": "var(--seed-dimension-x2)",
-        "height": "var(--seed-dimension-x1_5)",
-        "cornerRadius": "var(--seed-radius-r0_5)",
-        "gutter": "var(--seed-dimension-x0_5)"
-      },
-      "valueIndicatorLabel": {
-        "color": "var(--seed-color-fg-neutral-inverted)",
-        "fontSize": "var(--seed-font-size-t3)",
-        "lineHeight": "var(--seed-line-height-t3)",
-        "fontWeight": "var(--seed-font-weight-medium)"
-      },
-      "marker": {
-        "color": "var(--seed-color-fg-neutral-muted)",
-        "fontWeight": "var(--seed-font-weight-regular)",
-        "fontSize": "var(--seed-font-size-t3)",
-        "lineHeight": "var(--seed-line-height-t3)"
-      }
-    },
-    "disabled": {
-      "track": {
-        "color": "var(--seed-color-bg-disabled)"
-      },
-      "range": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "thumb": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "marker": {
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    }
-  }
-}

package/vars/component/snackbar.d.ts

@@ -1,65 +0,0 @@
-export declare const vars: {
-  "base": {
-    "enabled": {
-      "region": {
-        "paddingX": "var(--seed-dimension-x2)",
-        "paddingY": "var(--seed-dimension-x2)",
-        "offsetDuration": "var(--seed-duration-d4)",
-        "offsetTimingFunction": "var(--seed-timing-function-easing)"
-      },
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted)",
-        "cornerRadius": "var(--seed-radius-r2)",
-        "minHeight": "44px",
-        "maxWidth": "464px",
-        "paddingX": "var(--seed-dimension-x2_5)",
-        "paddingY": "var(--seed-dimension-x2_5)",
-        "enterOpacity": "0",
-        "enterScale": "0.8",
-        "enterDuration": "var(--seed-duration-d3)",
-        "enterTimingFunction": "var(--seed-timing-function-enter)",
-        "exitOpacity": "0",
-        "exitScale": "0.8",
-        "exitDuration": "var(--seed-duration-d2)",
-        "exitTimingFunction": "var(--seed-timing-function-exit)"
-      },
-      "content": {
-        "paddingX": "var(--seed-dimension-x1_5)",
-        "gap": "var(--seed-dimension-x2_5)"
-      },
-      "message": {
-        "color": "var(--seed-color-fg-neutral-inverted)",
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)",
-        "fontWeight": "var(--seed-font-weight-regular)"
-      },
-      "prefixIcon": {
-        "size": "24px",
-        "paddingRight": "var(--seed-dimension-x0_5)"
-      },
-      "actionButton": {
-        "targetPaddingX": "var(--seed-dimension-x2)",
-        "targetMinHeight": "44px",
-        "color": "var(--seed-color-fg-brand)",
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)",
-        "fontWeight": "var(--seed-font-weight-bold)"
-      }
-    }
-  },
-  "variantDefault": {},
-  "variantPositive": {
-    "enabled": {
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-positive)"
-      }
-    }
-  },
-  "variantCritical": {
-    "enabled": {
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-critical)"
-      }
-    }
-  }
-}

package/vars/component/snackbar.mjs

@@ -1,65 +0,0 @@
-export const vars = {
-  "base": {
-    "enabled": {
-      "region": {
-        "paddingX": "var(--seed-dimension-x2)",
-        "paddingY": "var(--seed-dimension-x2)",
-        "offsetDuration": "var(--seed-duration-d4)",
-        "offsetTimingFunction": "var(--seed-timing-function-easing)"
-      },
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted)",
-        "cornerRadius": "var(--seed-radius-r2)",
-        "minHeight": "44px",
-        "maxWidth": "464px",
-        "paddingX": "var(--seed-dimension-x2_5)",
-        "paddingY": "var(--seed-dimension-x2_5)",
-        "enterOpacity": "0",
-        "enterScale": "0.8",
-        "enterDuration": "var(--seed-duration-d3)",
-        "enterTimingFunction": "var(--seed-timing-function-enter)",
-        "exitOpacity": "0",
-        "exitScale": "0.8",
-        "exitDuration": "var(--seed-duration-d2)",
-        "exitTimingFunction": "var(--seed-timing-function-exit)"
-      },
-      "content": {
-        "paddingX": "var(--seed-dimension-x1_5)",
-        "gap": "var(--seed-dimension-x2_5)"
-      },
-      "message": {
-        "color": "var(--seed-color-fg-neutral-inverted)",
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)",
-        "fontWeight": "var(--seed-font-weight-regular)"
-      },
-      "prefixIcon": {
-        "size": "24px",
-        "paddingRight": "var(--seed-dimension-x0_5)"
-      },
-      "actionButton": {
-        "targetPaddingX": "var(--seed-dimension-x2)",
-        "targetMinHeight": "44px",
-        "color": "var(--seed-color-fg-brand)",
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)",
-        "fontWeight": "var(--seed-font-weight-bold)"
-      }
-    }
-  },
-  "variantDefault": {},
-  "variantPositive": {
-    "enabled": {
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-positive)"
-      }
-    }
-  },
-  "variantCritical": {
-    "enabled": {
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-critical)"
-      }
-    }
-  }
-}

package/vars/component/switch.d.ts

@@ -1,56 +0,0 @@
-export declare const vars: {
-  "base": {
-    "enabled": {
-      "label": {
-        "color": "var(--seed-color-fg-neutral)",
-        "fontWeight": "var(--seed-font-weight-medium)"
-      }
-    },
-    "disabled": {
-      "label": {
-        "opacity": "0.58",
-        "opacityDuration": "var(--seed-duration-d1)",
-        "opacityTimingFunction": "var(--seed-timing-function-easing)"
-      }
-    }
-  },
-  "size32": {
-    "enabled": {
-      /** root 전체가 누르는 영역이며, pressed 피드백은 Switchmark의 축소로 표현됩니다. */
-      "root": {
-        "height": "var(--seed-dimension-x8)",
-        "gap": "var(--seed-dimension-x2_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t5)",
-        "lineHeight": "var(--seed-line-height-t5)"
-      }
-    }
-  },
-  "size24": {
-    "enabled": {
-      /** root 전체가 누르는 영역이며, pressed 피드백은 Switchmark의 축소로 표현됩니다. */
-      "root": {
-        "height": "var(--seed-dimension-x6)",
-        "gap": "var(--seed-dimension-x2)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      }
-    }
-  },
-  "size16": {
-    "enabled": {
-      /** root 전체가 누르는 영역이며, pressed 피드백은 Switchmark의 축소로 표현됩니다. */
-      "root": {
-        "height": "var(--seed-dimension-x6)",
-        "gap": "var(--seed-dimension-x1_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t3)",
-        "lineHeight": "var(--seed-line-height-t3)"
-      }
-    }
-  }
-}

package/vars/component/switch.mjs

@@ -1,53 +0,0 @@
-export const vars = {
-  "base": {
-    "enabled": {
-      "label": {
-        "color": "var(--seed-color-fg-neutral)",
-        "fontWeight": "var(--seed-font-weight-medium)"
-      }
-    },
-    "disabled": {
-      "label": {
-        "opacity": "0.58",
-        "opacityDuration": "var(--seed-duration-d1)",
-        "opacityTimingFunction": "var(--seed-timing-function-easing)"
-      }
-    }
-  },
-  "size32": {
-    "enabled": {
-      "root": {
-        "height": "var(--seed-dimension-x8)",
-        "gap": "var(--seed-dimension-x2_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t5)",
-        "lineHeight": "var(--seed-line-height-t5)"
-      }
-    }
-  },
-  "size24": {
-    "enabled": {
-      "root": {
-        "height": "var(--seed-dimension-x6)",
-        "gap": "var(--seed-dimension-x2)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      }
-    }
-  },
-  "size16": {
-    "enabled": {
-      "root": {
-        "height": "var(--seed-dimension-x6)",
-        "gap": "var(--seed-dimension-x1_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t3)",
-        "lineHeight": "var(--seed-line-height-t3)"
-      }
-    }
-  }
-}

package/vars/component/switchmark.d.ts

@@ -1,114 +0,0 @@
-export declare const vars: {
-  "base": {
-    "enabled": {
-      "root": {
-        "cornerRadius": "var(--seed-radius-full)",
-        "color": "var(--seed-color-palette-gray-600)",
-        "colorDuration": "var(--seed-duration-d1)",
-        "colorTimingFunction": "var(--seed-timing-function-easing)",
-        "colorDelay": "20ms"
-      },
-      "thumb": {
-        "cornerRadius": "var(--seed-radius-full)",
-        /** selected 여부에 따른 thumb 크기입니다. pressed 축소는 root에 적용되므로 이 값과 무관합니다. */
-        "scale": "0.8",
-        "scaleDuration": "var(--seed-duration-d3)",
-        "scaleTimingFunction": "var(--seed-timing-function-easing)",
-        "translateDuration": "var(--seed-duration-d3)",
-        "translateTimingFunction": "var(--seed-timing-function-easing)",
-        "colorDuration": "var(--seed-duration-d1)",
-        "colorTimingFunction": "var(--seed-timing-function-easing)",
-        "colorDelay": "20ms"
-      }
-    },
-    "disabled": {
-      "root": {
-        "opacity": "0.38",
-        "opacityDuration": "var(--seed-duration-d1)",
-        "opacityTimingFunction": "var(--seed-timing-function-easing)"
-      }
-    },
-    "selected": {
-      "thumb": {
-        /** selected 여부에 따른 thumb 크기입니다. pressed 축소는 root에 적용되므로 이 값과 무관합니다. */
-        "scale": "1"
-      }
-    }
-  },
-  "toneBrand": {
-    "enabled": {
-      "thumb": {
-        "color": "var(--seed-color-palette-static-white)"
-      }
-    },
-    "enabledSelected": {
-      "root": {
-        "color": "var(--seed-color-bg-brand-solid)"
-      }
-    }
-  },
-  "toneNeutral": {
-    "enabled": {
-      "thumb": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      }
-    },
-    "enabledSelected": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted)"
-      }
-    },
-    "disabled": {
-      "thumb": {
-        "color": "var(--seed-color-palette-static-black-alpha-700)"
-      }
-    },
-    "disabledSelected": {
-      "root": {
-        "color": "var(--seed-color-palette-gray-600)"
-      }
-    }
-  },
-  "size32": {
-    "enabled": {
-      "root": {
-        "height": "32px",
-        "width": "52px",
-        "paddingX": "3px",
-        "paddingY": "3px"
-      },
-      "thumb": {
-        "height": "26px",
-        "width": "26px"
-      }
-    }
-  },
-  "size24": {
-    "enabled": {
-      "root": {
-        "height": "24px",
-        "width": "38px",
-        "paddingX": "2px",
-        "paddingY": "2px"
-      },
-      "thumb": {
-        "height": "20px",
-        "width": "20px"
-      }
-    }
-  },
-  "size16": {
-    "enabled": {
-      "root": {
-        "height": "16px",
-        "width": "26px",
-        "paddingX": "2px",
-        "paddingY": "2px"
-      },
-      "thumb": {
-        "height": "12px",
-        "width": "12px"
-      }
-    }
-  }
-}

package/vars/component/switchmark.mjs

@@ -1,112 +0,0 @@
-export const vars = {
-  "base": {
-    "enabled": {
-      "root": {
-        "cornerRadius": "var(--seed-radius-full)",
-        "color": "var(--seed-color-palette-gray-600)",
-        "colorDuration": "var(--seed-duration-d1)",
-        "colorTimingFunction": "var(--seed-timing-function-easing)",
-        "colorDelay": "20ms"
-      },
-      "thumb": {
-        "cornerRadius": "var(--seed-radius-full)",
-        "scale": "0.8",
-        "scaleDuration": "var(--seed-duration-d3)",
-        "scaleTimingFunction": "var(--seed-timing-function-easing)",
-        "translateDuration": "var(--seed-duration-d3)",
-        "translateTimingFunction": "var(--seed-timing-function-easing)",
-        "colorDuration": "var(--seed-duration-d1)",
-        "colorTimingFunction": "var(--seed-timing-function-easing)",
-        "colorDelay": "20ms"
-      }
-    },
-    "disabled": {
-      "root": {
-        "opacity": "0.38",
-        "opacityDuration": "var(--seed-duration-d1)",
-        "opacityTimingFunction": "var(--seed-timing-function-easing)"
-      }
-    },
-    "selected": {
-      "thumb": {
-        "scale": "1"
-      }
-    }
-  },
-  "toneBrand": {
-    "enabled": {
-      "thumb": {
-        "color": "var(--seed-color-palette-static-white)"
-      }
-    },
-    "enabledSelected": {
-      "root": {
-        "color": "var(--seed-color-bg-brand-solid)"
-      }
-    }
-  },
-  "toneNeutral": {
-    "enabled": {
-      "thumb": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      }
-    },
-    "enabledSelected": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted)"
-      }
-    },
-    "disabled": {
-      "thumb": {
-        "color": "var(--seed-color-palette-static-black-alpha-700)"
-      }
-    },
-    "disabledSelected": {
-      "root": {
-        "color": "var(--seed-color-palette-gray-600)"
-      }
-    }
-  },
-  "size32": {
-    "enabled": {
-      "root": {
-        "height": "32px",
-        "width": "52px",
-        "paddingX": "3px",
-        "paddingY": "3px"
-      },
-      "thumb": {
-        "height": "26px",
-        "width": "26px"
-      }
-    }
-  },
-  "size24": {
-    "enabled": {
-      "root": {
-        "height": "24px",
-        "width": "38px",
-        "paddingX": "2px",
-        "paddingY": "2px"
-      },
-      "thumb": {
-        "height": "20px",
-        "width": "20px"
-      }
-    }
-  },
-  "size16": {
-    "enabled": {
-      "root": {
-        "height": "16px",
-        "width": "26px",
-        "paddingX": "2px",
-        "paddingY": "2px"
-      },
-      "thumb": {
-        "height": "12px",
-        "width": "12px"
-      }
-    }
-  }
-}

package/vars/component/tab.d.ts

@@ -1,47 +0,0 @@
-export declare const vars: {
-  "base": {
-    "enabled": {
-      "label": {
-        "color": "var(--seed-color-fg-neutral-subtle)"
-      }
-    },
-    "selected": {
-      "label": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "disabled": {
-      "label": {
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    }
-  },
-  "sizeMedium": {
-    "enabled": {
-      "root": {
-        "minHeight": "44px",
-        "paddingX": "var(--seed-dimension-x2_5)",
-        "paddingY": "var(--seed-dimension-x2_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t5)",
-        "lineHeight": "var(--seed-line-height-t5)",
-        "fontWeight": "var(--seed-font-weight-bold)"
-      }
-    }
-  },
-  "sizeSmall": {
-    "enabled": {
-      "root": {
-        "minHeight": "40px",
-        "paddingX": "var(--seed-dimension-x2_5)",
-        "paddingY": "var(--seed-dimension-x2_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)",
-        "fontWeight": "var(--seed-font-weight-bold)"
-      }
-    }
-  }
-}

package/vars/component/tab.mjs

@@ -1,47 +0,0 @@
-export const vars = {
-  "base": {
-    "enabled": {
-      "label": {
-        "color": "var(--seed-color-fg-neutral-subtle)"
-      }
-    },
-    "selected": {
-      "label": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "disabled": {
-      "label": {
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    }
-  },
-  "sizeMedium": {
-    "enabled": {
-      "root": {
-        "minHeight": "44px",
-        "paddingX": "var(--seed-dimension-x2_5)",
-        "paddingY": "var(--seed-dimension-x2_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t5)",
-        "lineHeight": "var(--seed-line-height-t5)",
-        "fontWeight": "var(--seed-font-weight-bold)"
-      }
-    }
-  },
-  "sizeSmall": {
-    "enabled": {
-      "root": {
-        "minHeight": "40px",
-        "paddingX": "var(--seed-dimension-x2_5)",
-        "paddingY": "var(--seed-dimension-x2_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)",
-        "fontWeight": "var(--seed-font-weight-bold)"
-      }
-    }
-  }
-}

package/vars/component/tablist.d.ts

@@ -1,51 +0,0 @@
-export declare const vars: {
-  "base": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-layer-default)",
-        "strokeBottomWidth": "1px",
-        "strokeColor": "var(--seed-color-stroke-neutral-muted)"
-      },
-      "indicator": {
-        "height": "2px",
-        "color": "var(--seed-color-fg-neutral)",
-        "transformDuration": "var(--seed-duration-d4)",
-        "transformTimingFunction": "var(--seed-timing-function-easing)"
-      }
-    }
-  },
-  "layoutHug": {
-    "enabled": {
-      "root": {
-        "paddingX": "var(--seed-dimension-spacing-x-global-gutter)"
-      },
-      "indicator": {
-        "insetX": "0px"
-      }
-    }
-  },
-  "layoutFill": {
-    "enabled": {
-      "root": {
-        "paddingX": "0px"
-      },
-      "indicator": {
-        "insetX": "var(--seed-dimension-spacing-x-global-gutter)"
-      }
-    }
-  },
-  "sizeSmall": {
-    "enabled": {
-      "root": {
-        "height": "40px"
-      }
-    }
-  },
-  "sizeMedium": {
-    "enabled": {
-      "root": {
-        "height": "44px"
-      }
-    }
-  }
-}