@seed-design/css 2.9.0 → 3.0.0

package/vars/component/chip.d.ts

@@ -1,321 +0,0 @@
-export declare const vars: {
-  "base": {
-    "enabled": {
-      "root": {
-        "colorDuration": "var(--seed-duration-color-transition)",
-        "colorTimingFunction": "var(--seed-timing-function-easing)",
-        "cornerRadius": "var(--seed-radius-full)"
-      },
-      /** Icon, Avatar, Image를 넣을 수 있습니다. 들어오는 요소에 따라 좌측 여백이 달라집니다. */
-      "prefixIcon": {
-        "paddingLeft": "var(--seed-dimension-x1_5)"
-      },
-      "prefixAvatar": {
-        "size": "var(--seed-dimension-x6)"
-      },
-      "suffixIcon": {
-        "paddingRight": "var(--seed-dimension-x1_5)"
-      },
-      "label": {
-        "fontWeight": "var(--seed-font-weight-medium)",
-        "paddingX": "var(--seed-dimension-x1_5)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    }
-  },
-  /**
-   * 기본 스타일입니다.
-   */
-  "variantSolid": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-weak-alpha)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      /** Icon, Avatar, Image를 넣을 수 있습니다. 들어오는 요소에 따라 좌측 여백이 달라집니다. */
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-weak-alpha-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    },
-    "selected": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      /** Icon, Avatar, Image를 넣을 수 있습니다. 들어오는 요소에 따라 좌측 여백이 달라집니다. */
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      }
-    },
-    "selectedPressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted-pressed)"
-      }
-    },
-    "selectedDisabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    }
-  },
-  /**
-   * 명확한 구분이 필요한 경우 사용합니다.
-   */
-  "variantOutlineStrong": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-transparent)",
-        "strokeColor": "var(--seed-color-stroke-neutral-muted)",
-        "strokeWidth": "1px"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      /** Icon, Avatar, Image를 넣을 수 있습니다. 들어오는 요소에 따라 좌측 여백이 달라집니다. */
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-transparent-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    },
-    "selected": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      /** Icon, Avatar, Image를 넣을 수 있습니다. 들어오는 요소에 따라 좌측 여백이 달라집니다. */
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      }
-    },
-    "selectedPressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted-pressed)"
-      }
-    },
-    "selectedDisabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    }
-  },
-  /**
-   * Selection 사용 시 주목도가 낮은 스타일로 권장됩니다.
-   */
-  "variantOutlineWeak": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-transparent)",
-        "strokeColor": "var(--seed-color-stroke-neutral-muted)",
-        "strokeWidth": "1px"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      /** Icon, Avatar, Image를 넣을 수 있습니다. 들어오는 요소에 따라 좌측 여백이 달라집니다. */
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-transparent-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    },
-    "selected": {
-      "root": {
-        "strokeColor": "var(--seed-color-stroke-neutral-contrast)",
-        "color": "var(--seed-color-bg-neutral-weak)"
-      }
-    },
-    "selectedPressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-weak-pressed)"
-      }
-    },
-    "selectedDisabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    }
-  },
-  "sizeSmall": {
-    "enabled": {
-      "root": {
-        "height": "32px",
-        "paddingX": "var(--seed-dimension-x1_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      },
-      /** Icon, Avatar, Image를 넣을 수 있습니다. 들어오는 요소에 따라 좌측 여백이 달라집니다. */
-      "prefixIcon": {
-        "size": "var(--seed-dimension-x3_5)"
-      },
-      "suffixIcon": {
-        "size": "var(--seed-dimension-x3_5)"
-      },
-      "prefixAvatar": {
-        "size": "var(--seed-dimension-x5)"
-      },
-      "icon": {
-        "size": "var(--seed-dimension-x3_5)"
-      }
-    }
-  },
-  "sizeMedium": {
-    "enabled": {
-      "root": {
-        "height": "36px",
-        "paddingX": "var(--seed-dimension-x2)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      },
-      /** Icon, Avatar, Image를 넣을 수 있습니다. 들어오는 요소에 따라 좌측 여백이 달라집니다. */
-      "prefixIcon": {
-        "size": "var(--seed-dimension-x4)"
-      },
-      "suffixIcon": {
-        "size": "var(--seed-dimension-x3_5)"
-      },
-      "prefixAvatar": {
-        "size": "var(--seed-dimension-x6)"
-      },
-      "icon": {
-        "size": "var(--seed-dimension-x4)"
-      }
-    }
-  },
-  "sizeLarge": {
-    "enabled": {
-      "root": {
-        "height": "40px",
-        "paddingX": "var(--seed-dimension-x2_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      },
-      /** Icon, Avatar, Image를 넣을 수 있습니다. 들어오는 요소에 따라 좌측 여백이 달라집니다. */
-      "prefixIcon": {
-        "size": "var(--seed-dimension-x4)",
-        "paddingLeft": "var(--seed-dimension-x1_5)"
-      },
-      "suffixIcon": {
-        "size": "var(--seed-dimension-x4)"
-      },
-      "prefixAvatar": {
-        "size": "var(--seed-dimension-x7)"
-      },
-      "icon": {
-        "size": "var(--seed-dimension-x4)"
-      }
-    }
-  },
-  "sizeSmallLayoutWithText": {
-    "enabled": {
-      "root": {
-        "minWidth": "44px"
-      }
-    }
-  },
-  "sizeMediumLayoutWithText": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x12)"
-      }
-    }
-  },
-  "sizeLargeLayoutWithText": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x13)"
-      }
-    }
-  },
-  "sizeSmallLayoutIconOnly": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x8)"
-      }
-    }
-  },
-  "sizeMediumLayoutIconOnly": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x9)"
-      }
-    }
-  },
-  "sizeLargeLayoutIconOnly": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x10)"
-      }
-    }
-  }
-}

package/vars/component/chip.mjs

@@ -1,303 +0,0 @@
-export const vars = {
-  "base": {
-    "enabled": {
-      "root": {
-        "colorDuration": "var(--seed-duration-color-transition)",
-        "colorTimingFunction": "var(--seed-timing-function-easing)",
-        "cornerRadius": "var(--seed-radius-full)"
-      },
-      "prefixIcon": {
-        "paddingLeft": "var(--seed-dimension-x1_5)"
-      },
-      "prefixAvatar": {
-        "size": "var(--seed-dimension-x6)"
-      },
-      "suffixIcon": {
-        "paddingRight": "var(--seed-dimension-x1_5)"
-      },
-      "label": {
-        "fontWeight": "var(--seed-font-weight-medium)",
-        "paddingX": "var(--seed-dimension-x1_5)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    }
-  },
-  "variantSolid": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-weak-alpha)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-weak-alpha-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    },
-    "selected": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      }
-    },
-    "selectedPressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted-pressed)"
-      }
-    },
-    "selectedDisabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    }
-  },
-  "variantOutlineStrong": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-transparent)",
-        "strokeColor": "var(--seed-color-stroke-neutral-muted)",
-        "strokeWidth": "1px"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-transparent-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    },
-    "selected": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted)"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral-inverted)"
-      }
-    },
-    "selectedPressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-inverted-pressed)"
-      }
-    },
-    "selectedDisabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    }
-  },
-  "variantOutlineWeak": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-bg-transparent)",
-        "strokeColor": "var(--seed-color-stroke-neutral-muted)",
-        "strokeWidth": "1px"
-      },
-      "label": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "prefixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "suffixIcon": {
-        "color": "var(--seed-color-fg-neutral)"
-      },
-      "icon": {
-        "color": "var(--seed-color-fg-neutral)"
-      }
-    },
-    "pressed": {
-      "root": {
-        "color": "var(--seed-color-bg-transparent-pressed)"
-      }
-    },
-    "disabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    },
-    "selected": {
-      "root": {
-        "strokeColor": "var(--seed-color-stroke-neutral-contrast)",
-        "color": "var(--seed-color-bg-neutral-weak)"
-      }
-    },
-    "selectedPressed": {
-      "root": {
-        "color": "var(--seed-color-bg-neutral-weak-pressed)"
-      }
-    },
-    "selectedDisabled": {
-      "root": {
-        "opacity": "0.5"
-      }
-    }
-  },
-  "sizeSmall": {
-    "enabled": {
-      "root": {
-        "height": "32px",
-        "paddingX": "var(--seed-dimension-x1_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      },
-      "prefixIcon": {
-        "size": "var(--seed-dimension-x3_5)"
-      },
-      "suffixIcon": {
-        "size": "var(--seed-dimension-x3_5)"
-      },
-      "prefixAvatar": {
-        "size": "var(--seed-dimension-x5)"
-      },
-      "icon": {
-        "size": "var(--seed-dimension-x3_5)"
-      }
-    }
-  },
-  "sizeMedium": {
-    "enabled": {
-      "root": {
-        "height": "36px",
-        "paddingX": "var(--seed-dimension-x2)"
-      },
-      "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)"
-      },
-      "prefixAvatar": {
-        "size": "var(--seed-dimension-x6)"
-      },
-      "icon": {
-        "size": "var(--seed-dimension-x4)"
-      }
-    }
-  },
-  "sizeLarge": {
-    "enabled": {
-      "root": {
-        "height": "40px",
-        "paddingX": "var(--seed-dimension-x2_5)"
-      },
-      "label": {
-        "fontSize": "var(--seed-font-size-t4)",
-        "lineHeight": "var(--seed-line-height-t4)"
-      },
-      "prefixIcon": {
-        "size": "var(--seed-dimension-x4)",
-        "paddingLeft": "var(--seed-dimension-x1_5)"
-      },
-      "suffixIcon": {
-        "size": "var(--seed-dimension-x4)"
-      },
-      "prefixAvatar": {
-        "size": "var(--seed-dimension-x7)"
-      },
-      "icon": {
-        "size": "var(--seed-dimension-x4)"
-      }
-    }
-  },
-  "sizeSmallLayoutWithText": {
-    "enabled": {
-      "root": {
-        "minWidth": "44px"
-      }
-    }
-  },
-  "sizeMediumLayoutWithText": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x12)"
-      }
-    }
-  },
-  "sizeLargeLayoutWithText": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x13)"
-      }
-    }
-  },
-  "sizeSmallLayoutIconOnly": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x8)"
-      }
-    }
-  },
-  "sizeMediumLayoutIconOnly": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x9)"
-      }
-    }
-  },
-  "sizeLargeLayoutIconOnly": {
-    "enabled": {
-      "root": {
-        "minWidth": "var(--seed-dimension-x10)"
-      }
-    }
-  }
-}

package/vars/component/content-placeholder.d.ts

@@ -1,28 +0,0 @@
-export declare const vars: {
-  "base": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-palette-gray-200)"
-      },
-      "asset": {
-        "minWidth": "var(--seed-dimension-x4)",
-        "maxWidth": "160px",
-        /** root slot 대한 asset slot의 높이 비율입니다. */
-        "heightFraction": "0.5",
-        "color": "var(--seed-color-palette-gray-400)"
-      }
-    }
-  },
-  "typeDefault": {},
-  "typeBuySell": {},
-  "typeCar": {},
-  "typeCommerce": {},
-  "typeCoupon": {},
-  "typeFood": {},
-  "typeGroup": {},
-  "typeImage": {},
-  "typeJobs": {},
-  "typeBusiness": {},
-  "typePost": {},
-  "typeRealty": {}
-}

package/vars/component/content-placeholder.mjs

@@ -1,27 +0,0 @@
-export const vars = {
-  "base": {
-    "enabled": {
-      "root": {
-        "color": "var(--seed-color-palette-gray-200)"
-      },
-      "asset": {
-        "minWidth": "var(--seed-dimension-x4)",
-        "maxWidth": "160px",
-        "heightFraction": "0.5",
-        "color": "var(--seed-color-palette-gray-400)"
-      }
-    }
-  },
-  "typeDefault": {},
-  "typeBuySell": {},
-  "typeCar": {},
-  "typeCommerce": {},
-  "typeCoupon": {},
-  "typeFood": {},
-  "typeGroup": {},
-  "typeImage": {},
-  "typeJobs": {},
-  "typeBusiness": {},
-  "typePost": {},
-  "typeRealty": {}
-}