@seed-design/css 2.8.3 → 3.0.0

package/vars/component/contextual-floating-button.d.ts

@@ -1,144 +0,0 @@
-export declare const vars: {
-  "base": {
-    "enabled": {
-      "root": {
-        "cornerRadius": "var(--seed-radius-full)",
-        "shadow": "var(--seed-shadow-s3)",
-        "colorDuration": "var(--seed-duration-color-transition)",
-        "colorTimingFunction": "var(--seed-timing-function-easing)"
-      },
-      "progressCircle": {
-        "size": "16px",
-        "thickness": "2px"
-      }
-    }
-  },
-  /**
-   * 배경과 대비되는 강조된 보조 액션으로 중요도 높은 행동 유도 시 적합합니다.
-   */
-  "variantSolid": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted)"
-      },
-      "progressCircle": {
-        "trackColor": "var(--seed-color-palette-gray-700)",
-        "rangeColor": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "color": "var(--seed-color-bg-disabled)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    },
-    "loading": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted-pressed)"
-      }
-    }
-  },
-  /**
-   * 시각적 부담 없이 부드럽게 액션을 유도합니다.
-   */
-  "variantLayer": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-layer-floating)"
-      },
-      "progressCircle": {
-        "trackColor": "var(--seed-color-palette-gray-500)",
-        "rangeColor": "var(--seed-color-fg-neutral)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-layer-floating-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "color": "var(--seed-color-bg-disabled)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    },
-    "loading": {
-      "root": {
-        "color": "var(--seed-color-bg-layer-floating-pressed)"
-      }
-    }
-  },
-  /**
-   * label과 prefixIcon을 함께 표시합니다.
-   */
-  "layoutWithText": {
-    "enabled": {
-      "root": {
-        "minHeight": "36px",
-        "paddingX": "var(--seed-dimension-x3_5)",
-        "paddingY": "var(--seed-dimension-x2)",
-        "gap": "var(--seed-dimension-x1)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)",
-        "fontWeight": "var(--seed-font-weight-medium)"
-      },
-      "prefixIcon": {
-        "size": "16px"
-      }
-    }
-  },
-  /**
-   * icon만 표시합니다. 아이콘만으로 의미를 전달하기 때문에 접근성 레이블과 함께 사용해야 합니다.
-   */
-  "layoutIconOnly": {
-    "enabled": {
-      "root": {
-        "size": "44px"
-      },
-      "icon": {
-        "size": "22px"
-      }
-    }
-  }
-}

package/vars/component/contextual-floating-button.mjs

@@ -1,132 +0,0 @@
-export const vars = {
-  "base": {
-    "enabled": {
-      "root": {
-        "cornerRadius": "var(--seed-radius-full)",
-        "shadow": "var(--seed-shadow-s3)",
-        "colorDuration": "var(--seed-duration-color-transition)",
-        "colorTimingFunction": "var(--seed-timing-function-easing)"
-      },
-      "progressCircle": {
-        "size": "16px",
-        "thickness": "2px"
-      }
-    }
-  },
-  "variantSolid": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted)"
-      },
-      "progressCircle": {
-        "trackColor": "var(--seed-color-palette-gray-700)",
-        "rangeColor": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "color": "var(--seed-color-bg-disabled)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    },
-    "loading": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted-pressed)"
-      }
-    }
-  },
-  "variantLayer": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-layer-floating)"
-      },
-      "progressCircle": {
-        "trackColor": "var(--seed-color-palette-gray-500)",
-        "rangeColor": "var(--seed-color-fg-neutral)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-layer-floating-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "color": "var(--seed-color-bg-disabled)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    },
-    "loading": {
-      "root": {
-        "color": "var(--seed-color-bg-layer-floating-pressed)"
-      }
-    }
-  },
-  "layoutWithText": {
-    "enabled": {
-      "root": {
-        "minHeight": "36px",
-        "paddingX": "var(--seed-dimension-x3_5)",
-        "paddingY": "var(--seed-dimension-x2)",
-        "gap": "var(--seed-dimension-x1)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)",
-        "fontWeight": "var(--seed-font-weight-medium)"
-      },
-      "prefixIcon": {
-        "size": "16px"
-      }
-    }
-  },
-  "layoutIconOnly": {
-    "enabled": {
-      "root": {
-        "size": "44px"
-      },
-      "icon": {
-        "size": "22px"
-      }
-    }
-  }
-}

package/vars/component/control-chip.d.ts

@@ -1,158 +0,0 @@
-export declare const vars: {
-  "base": {
-    "enabled": {
-      "root": {
-        "strokeColor": "var(--seed-color-stroke-neutral-muted)",
-        "strokeWidth": "1px",
-        "cornerRadius": "var(--seed-radius-full)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral)",
-        "fontWeight": "var(--seed-font-weight-medium)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral-subtle)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "count": {
-        "color": "var(--seed-color-fg-neutral-muted)",
-        "fontWeight": "var(--seed-font-weight-medium)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-layer-default-pressed)"
-      }
-    },
-    "selected": {
-      "root": {
-        "strokeWidth": "0px",
-        "color": "var(--seed-color-bg-neutral-solid-muted)"
-      },
-      "label": {
-        "color": "var(--seed-color-palette-static-white)",
-        "fontWeight": "var(--seed-font-weight-bold)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-palette-static-white)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-palette-static-white)"
-      },
-      "icon": {
-        "color": "var(--seed-color-palette-static-white)"
-      },
-      "count": {
-        "color": "var(--seed-color-palette-static-white-alpha-800)"
-      }
-    },
-    "selectedPressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-solid-muted-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "color": "var(--seed-color-bg-disabled)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "count": {
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    }
-  },
-  "sizeSmall": {
-    "enabled": {
-      "root": {
-        "minHeight": "var(--seed-dimension-x8)",
-        "paddingY": "var(--seed-dimension-x1_5)",
-        "gap": "var(--seed-dimension-x1)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      },
-      "prefixIcon": {
-        "size": "var(--seed-dimension-x4)"
-      },
-      "suffixIcon": {
-        "size": "var(--seed-dimension-x3_5)"
-      },
-      "count": {
-        "fontSize": "var(--seed-font-size-t4)"
-      }
-    }
-  },
-  "sizeMedium": {
-    "enabled": {
-      "root": {
-        "minHeight": "var(--seed-dimension-x9)",
-        "paddingY": "var(--seed-dimension-x2)",
-        "gap": "var(--seed-dimension-x1)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      },
-      "prefixIcon": {
-        "size": "var(--seed-dimension-x4)"
-      },
-      "suffixIcon": {
-        "size": "var(--seed-dimension-x3_5)"
-      },
-      "count": {
-        "fontSize": "var(--seed-font-size-t4)"
-      }
-    }
-  },
-  "sizeSmallLayoutWithText": {
-    "enabled": {
-      "root": {
-        "paddingX": "var(--seed-dimension-x3)"
-      }
-    }
-  },
-  "sizeSmallLayoutIconOnly": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x8)"
-      },
-      "icon": {
-        "size": "var(--seed-dimension-x4)"
-      }
-    }
-  },
-  "sizeMediumLayoutWithText": {
-    "enabled": {
-      "root": {
-        "paddingX": "var(--seed-dimension-x3_5)"
-      }
-    }
-  },
-  "sizeMediumLayoutIconOnly": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x9)"
-      },
-      "icon": {
-        "size": "var(--seed-dimension-x4)"
-      }
-    }
-  }
-}

package/vars/component/control-chip.mjs

@@ -1,158 +0,0 @@
-export const vars = {
-  "base": {
-    "enabled": {
-      "root": {
-        "strokeColor": "var(--seed-color-stroke-neutral-muted)",
-        "strokeWidth": "1px",
-        "cornerRadius": "var(--seed-radius-full)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral)",
-        "fontWeight": "var(--seed-font-weight-medium)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral-subtle)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "count": {
-        "color": "var(--seed-color-fg-neutral-muted)",
-        "fontWeight": "var(--seed-font-weight-medium)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-layer-default-pressed)"
-      }
-    },
-    "selected": {
-      "root": {
-        "strokeWidth": "0px",
-        "color": "var(--seed-color-bg-neutral-solid-muted)"
-      },
-      "label": {
-        "color": "var(--seed-color-palette-static-white)",
-        "fontWeight": "var(--seed-font-weight-bold)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-palette-static-white)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-palette-static-white)"
-      },
-      "icon": {
-        "color": "var(--seed-color-palette-static-white)"
-      },
-      "count": {
-        "color": "var(--seed-color-palette-static-white-alpha-800)"
-      }
-    },
-    "selectedPressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-solid-muted-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "color": "var(--seed-color-bg-disabled)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-disabled)"
-      },
-      "count": {
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    }
-  },
-  "sizeSmall": {
-    "enabled": {
-      "root": {
-        "minHeight": "var(--seed-dimension-x8)",
-        "paddingY": "var(--seed-dimension-x1_5)",
-        "gap": "var(--seed-dimension-x1)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      },
-      "prefixIcon": {
-        "size": "var(--seed-dimension-x4)"
-      },
-      "suffixIcon": {
-        "size": "var(--seed-dimension-x3_5)"
-      },
-      "count": {
-        "fontSize": "var(--seed-font-size-t4)"
-      }
-    }
-  },
-  "sizeMedium": {
-    "enabled": {
-      "root": {
-        "minHeight": "var(--seed-dimension-x9)",
-        "paddingY": "var(--seed-dimension-x2)",
-        "gap": "var(--seed-dimension-x1)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      },
-      "prefixIcon": {
-        "size": "var(--seed-dimension-x4)"
-      },
-      "suffixIcon": {
-        "size": "var(--seed-dimension-x3_5)"
-      },
-      "count": {
-        "fontSize": "var(--seed-font-size-t4)"
-      }
-    }
-  },
-  "sizeSmallLayoutWithText": {
-    "enabled": {
-      "root": {
-        "paddingX": "var(--seed-dimension-x3)"
-      }
-    }
-  },
-  "sizeSmallLayoutIconOnly": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x8)"
-      },
-      "icon": {
-        "size": "var(--seed-dimension-x4)"
-      }
-    }
-  },
-  "sizeMediumLayoutWithText": {
-    "enabled": {
-      "root": {
-        "paddingX": "var(--seed-dimension-x3_5)"
-      }
-    }
-  },
-  "sizeMediumLayoutIconOnly": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x9)"
-      },
-      "icon": {
-        "size": "var(--seed-dimension-x4)"
-      }
-    }
-  }
-}

package/vars/component/date-picker.d.ts

@@ -1,103 +0,0 @@
-export declare const vars: {
-  "base": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-layer-floating)"
-      },
-      "header": {
-        "height": "var(--seed-dimension-x12)"
-      },
-      "headerLabel": {
-        "paddingX": "var(--seed-dimension-x1)",
-        "gap": "var(--seed-dimension-x1)",
-        "iconSize": "var(--seed-dimension-x5)",
-        "fontSize": "var(--seed-font-size-t5)",
-        "lineHeight": "var(--seed-line-height-t5)",
-        "fontWeight": "var(--seed-font-weight-bold)",
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "months": {
-        "gap": "var(--seed-dimension-x6)"
-      },
-      "continuousScroll": {
-        "fogHeight": "96px"
-      },
-      "weekday": {
-        "height": "var(--seed-dimension-x12)",
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)",
-        "fontWeight": "var(--seed-font-weight-medium)",
-        "color": "var(--seed-color-fg-neutral-subtle)"
-      },
-      "monthLabel": {
-        "height": "var(--seed-dimension-x12)",
-        "fontSize": "var(--seed-font-size-t5)",
-        "lineHeight": "var(--seed-line-height-t5)",
-        "fontWeight": "var(--seed-font-weight-bold)",
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "dateCell": {
-        "minHeight": "var(--seed-dimension-x12)"
-      },
-      "dateVisual": {
-        "size": "42px",
-        "cornerRadius": "var(--seed-radius-full)",
-        "color": "var(--seed-color-bg-transparent)"
-      },
-      "dateContent": {
-        "fontSize": "var(--seed-font-size-t5)",
-        "lineHeight": "var(--seed-line-height-t5)",
-        "fontWeight": "var(--seed-font-weight-medium)",
-        "color": "var(--seed-color-fg-neutral-muted)"
-      },
-      "rangeBackground": {
-        "color": "var(--seed-color-bg-neutral-weak)"
-      },
-      "wheelSelectionIndicator": {
-        "cornerRadius": "var(--seed-radius-r2)",
-        "color": "var(--seed-color-bg-neutral-weak)"
-      },
-      "wheelContainer": {
-        "height": "336px"
-      },
-      "wheelItem": {
-        "paddingX": "var(--seed-dimension-x4)",
-        "fontSize": "var(--seed-font-size-t10-static)",
-        "lineHeight": "var(--seed-line-height-t10-static)",
-        "fontWeight": "var(--seed-font-weight-medium)",
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    },
-    "pressed": {
-      "dateVisual": {
-        "color": "var(--seed-color-bg-transparent-pressed)"
-      }
-    },
-    "today": {
-      "dateVisual": {
-        "color": "var(--seed-color-bg-neutral-weak)"
-      }
-    },
-    "selected": {
-      "dateVisual": {
-        "color": "var(--seed-color-bg-neutral-inverted)"
-      },
-      "dateContent": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "wheelItem": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "readOnly": {
-      "dateVisual": {
-        "color": "var(--seed-color-palette-gray-600)"
-      }
-    },
-    "disabled": {
-      "dateContent": {
-        "color": "var(--seed-color-fg-disabled)"
-      }
-    }
-  }
-}