@cssui/react 1.0.0 → 1.0.2

package/dist/components/switch/style.css

@@ -0,0 +1,160 @@
+/**
+ * Switch 组件样式
+ * 使用 CSS 变量和 BEM 命名规范
+ */
+
+.css-switch-field {
+  display: inline-flex;
+  align-items: center;
+  gap: 12px;
+  max-width: 100%;
+}
+
+.css-switch-field__label {
+  min-width: 94px;
+  color: var(--color-dark);
+  font-family: var(--font-family-base);
+  font-size: 14px;
+  line-height: 20px;
+}
+
+.css-switch {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  vertical-align: middle;
+  width: 44px;
+  height: 24px;
+  padding: 0;
+  border: none;
+  background-color: var(--color-dark-03);
+  border-radius: 100px;
+  cursor: pointer;
+  transition: background-color var(--transition-duration-200) var(--transition-timing);
+  user-select: none;
+  box-sizing: border-box;
+  outline: none;
+  appearance: none;
+  -webkit-appearance: none;
+}
+
+/* 隐藏原生 input */
+.css-switch__input {
+  position: absolute;
+  width: 0;
+  height: 0;
+  opacity: 0;
+  margin: 0;
+  pointer-events: none;
+}
+
+/* 圆形滑块 */
+.css-switch__handle {
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  width: 20px;
+  height: 20px;
+  background-color: #ffffff;
+  border-radius: 50%;
+  transition: all var(--transition-duration-200) var(--transition-timing);
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1;
+}
+
+/* 选中状态 */
+.css-switch--checked {
+  background-color: var(--color-primary);
+}
+
+.css-switch--checked .css-switch__handle {
+  left: calc(100% - 22px);
+}
+
+/* 尺寸: small */
+.css-switch--sm {
+  width: 28px;
+  height: 16px;
+}
+
+.css-switch--sm .css-switch__handle {
+  width: 12px;
+  height: 12px;
+  top: 2px;
+  left: 2px;
+}
+
+.css-switch--sm.css-switch--checked .css-switch__handle {
+  left: calc(100% - 14px);
+}
+
+/* 尺寸: large */
+.css-switch--lg {
+  width: 56px;
+  height: 28px;
+}
+
+.css-switch--lg .css-switch__handle {
+  width: 24px;
+  height: 24px;
+  top: 2px;
+  left: 2px;
+}
+
+.css-switch--lg.css-switch--checked .css-switch__handle {
+  left: calc(100% - 26px);
+}
+
+/* 禁用状态 */
+.css-switch--disabled {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
+.css-switch--disabled .css-switch__handle {
+  box-shadow: none;
+}
+
+/* 加载状态 */
+.css-switch--loading {
+  cursor: wait;
+}
+
+.css-switch__loading-icon {
+  width: 14px;
+  height: 14px;
+  color: var(--color-primary);
+  animation: css-switch-spin 1s linear infinite;
+  border: 2px solid currentColor;
+  border-right-color: transparent;
+  border-radius: 50%;
+}
+
+.css-switch--checked .css-switch__loading-icon {
+  color: var(--color-primary);
+}
+
+@keyframes css-switch-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+/* 聚焦样式 */
+.css-switch:focus-visible {
+  box-shadow:
+    0 0 0 2px var(--color-background),
+    0 0 0 4px var(--color-primary-golden-03);
+}
+
+@media (max-width: 767px) {
+  .css-switch-field {
+    width: 100%;
+  }
+}

package/dist/components/table/index.d.ts

@@ -0,0 +1,49 @@
+import type { PaginationAlign, PaginationProps } from '../pagination';
+export type TableColumnAlign = 'left' | 'center' | 'right';
+export type TableColumnFixed = boolean | 'left' | 'right';
+export type TableSortOrder = 'ascend' | 'descend' | null;
+export type TablePaginationAlign = PaginationAlign | 'left' | 'right';
+export type TableRowKey<RecordType> = string | ((record: RecordType, index: number) => string | number);
+export interface TableColumn<RecordType = Record<string, unknown>> {
+    align?: TableColumnAlign;
+    ellipsis?: boolean;
+    fixed?: TableColumnFixed;
+    key?: string;
+    dataIndex?: keyof RecordType | string;
+    title: string;
+    width?: number | string;
+    sortOrder?: TableSortOrder;
+    sortIcon?: unknown;
+    render?: (value: unknown, record: RecordType, index: number) => unknown;
+}
+export interface TablePaginationConfig extends Omit<PaginationProps, 'align' | 'className'> {
+    align?: TablePaginationAlign;
+}
+export interface TableProps<RecordType = Record<string, unknown>> {
+    columns: TableColumn<RecordType>[];
+    dataSource: RecordType[];
+    rowKey?: TableRowKey<RecordType>;
+    pagination?: TablePaginationConfig | false;
+    className?: string;
+}
+export declare function getTableClassNames(props?: Pick<TableProps, 'className'>): string;
+export declare function getTableCellClassNames(props: {
+    align?: TableColumnAlign;
+    ellipsis?: boolean;
+    fixed?: TableColumnFixed;
+    header?: boolean;
+}): string;
+export declare function getTableColumnKey<RecordType>(column: TableColumn<RecordType>, index: number): string;
+export declare function normalizeTableColumnFixed(fixed?: TableColumnFixed): 'left' | 'right' | undefined;
+export declare function normalizeTablePaginationAlign(align?: TablePaginationAlign): PaginationAlign;
+export declare function getTablePaginationTotal<RecordType>(dataSource: RecordType[], pagination?: TablePaginationConfig | false): number;
+export declare function shouldTableSliceData<RecordType>(dataSource: RecordType[], pagination?: TablePaginationConfig | false): boolean;
+export declare function getTablePageData<RecordType>(props: {
+    dataSource: RecordType[];
+    current: number;
+    pageSize: number;
+    enabled?: boolean;
+}): RecordType[];
+export declare function getTableCellValue<RecordType>(record: RecordType, dataIndex?: keyof RecordType | string): unknown;
+export declare function hasTableSorter<RecordType>(column: TableColumn<RecordType>): boolean;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/table/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../table/index.ts"],"names":[],"mappings":"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"}

package/dist/components/table/index.js

@@ -0,0 +1,74 @@
+function getTableClassNames(props = {}) {
+  const classes = ["css-table"];
+  if (props.className) {
+    classes.push(props.className);
+  }
+  return classes.join(" ");
+}
+function getTableCellClassNames(props) {
+  const classes = ["css-table__cell", `css-table__cell--align-${props.align ?? "left"}`];
+  const fixed = normalizeTableColumnFixed(props.fixed);
+  if (props.header) {
+    classes.push("css-table__cell--header");
+  }
+  if (props.ellipsis) {
+    classes.push("css-table__cell--ellipsis");
+  }
+  if (fixed) {
+    classes.push(`css-table__cell--fixed-${fixed}`);
+  }
+  return classes.join(" ");
+}
+function getTableColumnKey(column, index) {
+  return String(column.key ?? column.dataIndex ?? index);
+}
+function normalizeTableColumnFixed(fixed) {
+  if (fixed === true) return "left";
+  if (fixed === "left" || fixed === "right") return fixed;
+  return void 0;
+}
+function normalizeTablePaginationAlign(align) {
+  if (align === "left" || align === "start") return "start";
+  if (align === "center") return "center";
+  return "end";
+}
+function getTablePaginationTotal(dataSource, pagination) {
+  if (pagination === false) {
+    return dataSource.length;
+  }
+  return pagination?.total ?? dataSource.length;
+}
+function shouldTableSliceData(dataSource, pagination) {
+  if (pagination === false) return false;
+  if (pagination?.total === void 0) return true;
+  return pagination.total <= dataSource.length;
+}
+function getTablePageData(props) {
+  const { dataSource, current, pageSize, enabled = true } = props;
+  if (!enabled) {
+    return dataSource;
+  }
+  const safePageSize = Number.isFinite(pageSize) && pageSize > 0 ? pageSize : 15;
+  const start = (current - 1) * safePageSize;
+  return dataSource.slice(start, start + safePageSize);
+}
+function getTableCellValue(record, dataIndex) {
+  if (dataIndex === void 0 || dataIndex === null) {
+    return void 0;
+  }
+  const path = String(dataIndex).split(".");
+  let current = record;
+  for (const key of path) {
+    if (current == null || typeof current !== "object") {
+      return void 0;
+    }
+    current = current[key];
+  }
+  return current;
+}
+function hasTableSorter(column) {
+  return column.sortOrder !== void 0 || column.sortIcon !== void 0;
+}
+
+export { getTableCellClassNames, getTableCellValue, getTableClassNames, getTableColumnKey, getTablePageData, getTablePaginationTotal, hasTableSorter, normalizeTableColumnFixed, normalizeTablePaginationAlign, shouldTableSliceData };
+//# sourceMappingURL=index.js.map

package/dist/components/table/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../components/table/index.ts"],"sourcesContent":["import type { PaginationAlign, PaginationProps } from '../pagination'\n\nexport type TableColumnAlign = 'left' | 'center' | 'right'\n\nexport type TableColumnFixed = boolean | 'left' | 'right'\n\nexport type TableSortOrder = 'ascend' | 'descend' | null\n\nexport type TablePaginationAlign = PaginationAlign | 'left' | 'right'\n\nexport type TableRowKey<RecordType> =\n  | string\n  | ((record: RecordType, index: number) => string | number)\n\nexport interface TableColumn<RecordType = Record<string, unknown>> {\n  align?: TableColumnAlign\n  ellipsis?: boolean\n  fixed?: TableColumnFixed\n  key?: string\n  dataIndex?: keyof RecordType | string\n  title: string\n  width?: number | string\n  sortOrder?: TableSortOrder\n  sortIcon?: unknown\n  render?: (value: unknown, record: RecordType, index: number) => unknown\n}\n\nexport interface TablePaginationConfig extends Omit<PaginationProps, 'align' | 'className'> {\n  align?: TablePaginationAlign\n}\n\nexport interface TableProps<RecordType = Record<string, unknown>> {\n  columns: TableColumn<RecordType>[]\n  dataSource: RecordType[]\n  rowKey?: TableRowKey<RecordType>\n  pagination?: TablePaginationConfig | false\n  className?: string\n}\n\nexport function getTableClassNames(props: Pick<TableProps, 'className'> = {}): string {\n  const classes = ['css-table']\n\n  if (props.className) {\n    classes.push(props.className)\n  }\n\n  return classes.join(' ')\n}\n\nexport function getTableCellClassNames(props: {\n  align?: TableColumnAlign\n  ellipsis?: boolean\n  fixed?: TableColumnFixed\n  header?: boolean\n}): string {\n  const classes = ['css-table__cell', `css-table__cell--align-${props.align ?? 'left'}`]\n  const fixed = normalizeTableColumnFixed(props.fixed)\n\n  if (props.header) {\n    classes.push('css-table__cell--header')\n  }\n\n  if (props.ellipsis) {\n    classes.push('css-table__cell--ellipsis')\n  }\n\n  if (fixed) {\n    classes.push(`css-table__cell--fixed-${fixed}`)\n  }\n\n  return classes.join(' ')\n}\n\nexport function getTableColumnKey<RecordType>(\n  column: TableColumn<RecordType>,\n  index: number\n): string {\n  return String(column.key ?? column.dataIndex ?? index)\n}\n\nexport function normalizeTableColumnFixed(fixed?: TableColumnFixed): 'left' | 'right' | undefined {\n  if (fixed === true) return 'left'\n  if (fixed === 'left' || fixed === 'right') return fixed\n  return undefined\n}\n\nexport function normalizeTablePaginationAlign(align?: TablePaginationAlign): PaginationAlign {\n  if (align === 'left' || align === 'start') return 'start'\n  if (align === 'center') return 'center'\n  return 'end'\n}\n\nexport function getTablePaginationTotal<RecordType>(\n  dataSource: RecordType[],\n  pagination?: TablePaginationConfig | false\n): number {\n  if (pagination === false) {\n    return dataSource.length\n  }\n\n  return pagination?.total ?? dataSource.length\n}\n\nexport function shouldTableSliceData<RecordType>(\n  dataSource: RecordType[],\n  pagination?: TablePaginationConfig | false\n): boolean {\n  if (pagination === false) return false\n  if (pagination?.total === undefined) return true\n  return pagination.total <= dataSource.length\n}\n\nexport function getTablePageData<RecordType>(props: {\n  dataSource: RecordType[]\n  current: number\n  pageSize: number\n  enabled?: boolean\n}): RecordType[] {\n  const { dataSource, current, pageSize, enabled = true } = props\n\n  if (!enabled) {\n    return dataSource\n  }\n\n  const safePageSize = Number.isFinite(pageSize) && pageSize > 0 ? pageSize : 15\n  const start = (current - 1) * safePageSize\n\n  return dataSource.slice(start, start + safePageSize)\n}\n\nexport function getTableCellValue<RecordType>(\n  record: RecordType,\n  dataIndex?: keyof RecordType | string\n): unknown {\n  if (dataIndex === undefined || dataIndex === null) {\n    return undefined\n  }\n\n  const path = String(dataIndex).split('.')\n  let current: unknown = record\n\n  for (const key of path) {\n    if (current == null || typeof current !== 'object') {\n      return undefined\n    }\n\n    current = (current as Record<string, unknown>)[key]\n  }\n\n  return current\n}\n\nexport function hasTableSorter<RecordType>(column: TableColumn<RecordType>): boolean {\n  return column.sortOrder !== undefined || column.sortIcon !== undefined\n}\n"],"names":[],"mappings":"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"}

package/dist/components/table/style.css

@@ -0,0 +1,131 @@
+/**
+ * Table 表格组件样式
+ */
+
+.css-table {
+  display: grid;
+  gap: 16px;
+  width: 100%;
+}
+
+.css-table__container {
+  width: 100%;
+  overflow-x: auto;
+  background: #ffffff;
+}
+
+.css-table__table {
+  width: max-content;
+  min-width: 100%;
+  border-collapse: separate;
+  border-spacing: 0;
+  table-layout: fixed;
+}
+
+.css-table__cell {
+  padding: 12px 16px;
+  border-bottom: 1px solid var(--color-dark-01, #ececec);
+  background: #ffffff;
+  color: var(--color-dark, #333333);
+  font-size: var(--font-size-body, 14px);
+  line-height: var(--line-height-body, 1.5);
+  text-align: left;
+  vertical-align: middle;
+  box-sizing: border-box;
+}
+
+.css-table__cell--header {
+  height: 36px;
+  padding: 0 16px;
+  background: var(--color-primary, #9e8a57);
+  color: #ffffff;
+  font-weight: var(--font-weight-bold, 700);
+  white-space: nowrap;
+}
+
+.css-table__cell--align-center {
+  text-align: center;
+}
+
+.css-table__cell--align-right {
+  text-align: right;
+}
+
+.css-table__cell--fixed-left,
+.css-table__cell--fixed-right {
+  position: sticky;
+  z-index: 2;
+}
+
+.css-table__cell--header.css-table__cell--fixed-left,
+.css-table__cell--header.css-table__cell--fixed-right {
+  z-index: 3;
+}
+
+.css-table__body-row:last-child .css-table__cell {
+  border-bottom: none;
+}
+
+.css-table__body-row:nth-child(even) .css-table__cell {
+  background: var(--color-primary-golden-05);
+}
+
+.css-table__body-row:nth-child(even) .css-table__cell--fixed-left,
+.css-table__body-row:nth-child(even) .css-table__cell--fixed-right {
+  background: var(--color-primary-golden-05);
+}
+
+.css-table__cell-content {
+  min-width: 0;
+}
+
+.css-table__cell-content--ellipsis {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.css-table__sort {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  min-width: 0;
+}
+
+.css-table__sort-title {
+  min-width: 0;
+}
+
+.css-table__sort-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  color: currentColor;
+  flex-shrink: 0;
+  opacity: 0.72;
+}
+
+.css-table__sort-icon--active {
+  opacity: 1;
+}
+
+.css-table__empty {
+  padding: 28px 16px;
+  color: var(--color-dark-03, #999999);
+  text-align: center;
+}
+
+.css-table__pagination {
+  width: 100%;
+}
+
+@media (max-width: 767px) {
+  .css-table__cell {
+    padding: 10px 12px;
+    font-size: 13px;
+  }
+
+  .css-table__empty {
+    padding: 24px 12px;
+  }
+}

package/dist/components/tabs/index.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Tabs 选项卡切换组件 - 框架无关逻辑
+ */
+export type TabsValue = string | number;
+export type TabsSize = 'sm' | 'md' | 'lg';
+export type TabsType = 'line' | 'card';
+export interface TabsOption {
+    /** 标签文字 */
+    label: string;
+    /** 标签值 */
+    value: TabsValue;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 图标名称（内置图标名或组件） */
+    icon?: string;
+}
+export interface TabsProps {
+    /** 选项卡数据 */
+    options: TabsOption[];
+    /** 当前激活值 */
+    value?: TabsValue;
+    /** 尺寸 */
+    size?: TabsSize;
+    /** 风格类型 */
+    type?: TabsType;
+    /** 变更回调 */
+    onChange?: (value: TabsValue) => void;
+}
+export declare function getTabsClassNames(props: Pick<TabsProps, 'size' | 'type'>): string;
+export declare function getTabsItemClassNames(props: {
+    active?: boolean;
+    disabled?: boolean;
+}): string;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/tabs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../tabs/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,MAAM,CAAA;AAEvC,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAEzC,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAA;AAEtC,MAAM,WAAW,UAAU;IACzB,WAAW;IACX,KAAK,EAAE,MAAM,CAAA;IACb,UAAU;IACV,KAAK,EAAE,SAAS,CAAA;IAChB,WAAW;IACX,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,qBAAqB;IACrB,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,MAAM,WAAW,SAAS;IACxB,YAAY;IACZ,OAAO,EAAE,UAAU,EAAE,CAAA;IACrB,YAAY;IACZ,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,SAAS;IACT,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,WAAW;IACX,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,WAAW;IACX,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAA;CACtC;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CAAC,GAAG,MAAM,CAMjF;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE;IAAE,MAAM,CAAC,EAAE,OAAO,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,GAAG,MAAM,CAU7F"}

package/dist/components/tabs/index.js

@@ -0,0 +1,21 @@
+function getTabsClassNames(props) {
+  const { size = "md", type = "line" } = props;
+  const classes = ["css-tabs"];
+  classes.push(`css-tabs--${size}`);
+  classes.push(`css-tabs--${type}`);
+  return classes.join(" ");
+}
+function getTabsItemClassNames(props) {
+  const { active, disabled } = props;
+  const classes = ["css-tabs__item"];
+  if (active) {
+    classes.push("css-tabs__item--active");
+  }
+  if (disabled) {
+    classes.push("css-tabs__item--disabled");
+  }
+  return classes.join(" ");
+}
+
+export { getTabsClassNames, getTabsItemClassNames };
+//# sourceMappingURL=index.js.map

package/dist/components/tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../components/tabs/index.ts"],"sourcesContent":["/**\n * Tabs 选项卡切换组件 - 框架无关逻辑\n */\n\nexport type TabsValue = string | number\n\nexport type TabsSize = 'sm' | 'md' | 'lg'\n\nexport type TabsType = 'line' | 'card'\n\nexport interface TabsOption {\n  /** 标签文字 */\n  label: string\n  /** 标签值 */\n  value: TabsValue\n  /** 是否禁用 */\n  disabled?: boolean\n  /** 图标名称（内置图标名或组件） */\n  icon?: string\n}\n\nexport interface TabsProps {\n  /** 选项卡数据 */\n  options: TabsOption[]\n  /** 当前激活值 */\n  value?: TabsValue\n  /** 尺寸 */\n  size?: TabsSize\n  /** 风格类型 */\n  type?: TabsType\n  /** 变更回调 */\n  onChange?: (value: TabsValue) => void\n}\n\nexport function getTabsClassNames(props: Pick<TabsProps, 'size' | 'type'>): string {\n  const { size = 'md', type = 'line' } = props\n  const classes = ['css-tabs']\n  classes.push(`css-tabs--${size}`)\n  classes.push(`css-tabs--${type}`)\n  return classes.join(' ')\n}\n\nexport function getTabsItemClassNames(props: { active?: boolean; disabled?: boolean }): string {\n  const { active, disabled } = props\n  const classes = ['css-tabs__item']\n  if (active) {\n    classes.push('css-tabs__item--active')\n  }\n  if (disabled) {\n    classes.push('css-tabs__item--disabled')\n  }\n  return classes.join(' ')\n}\n"],"names":[],"mappings":"AAkCO,SAAS,kBAAkB,KAAA,EAAiD;AACjF,EAAA,MAAM,EAAE,IAAA,GAAO,IAAA,EAAM,IAAA,GAAO,QAAO,GAAI,KAAA;AACvC,EAAA,MAAM,OAAA,GAAU,CAAC,UAAU,CAAA;AAC3B,EAAA,OAAA,CAAQ,IAAA,CAAK,CAAA,UAAA,EAAa,IAAI,CAAA,CAAE,CAAA;AAChC,EAAA,OAAA,CAAQ,IAAA,CAAK,CAAA,UAAA,EAAa,IAAI,CAAA,CAAE,CAAA;AAChC,EAAA,OAAO,OAAA,CAAQ,KAAK,GAAG,CAAA;AACzB;AAEO,SAAS,sBAAsB,KAAA,EAAyD;AAC7F,EAAA,MAAM,EAAE,MAAA,EAAQ,QAAA,EAAS,GAAI,KAAA;AAC7B,EAAA,MAAM,OAAA,GAAU,CAAC,gBAAgB,CAAA;AACjC,EAAA,IAAI,MAAA,EAAQ;AACV,IAAA,OAAA,CAAQ,KAAK,wBAAwB,CAAA;AAAA,EACvC;AACA,EAAA,IAAI,QAAA,EAAU;AACZ,IAAA,OAAA,CAAQ,KAAK,0BAA0B,CAAA;AAAA,EACzC;AACA,EAAA,OAAO,OAAA,CAAQ,KAAK,GAAG,CAAA;AACzB;;;;"}

package/dist/components/tabs/style.css

@@ -0,0 +1,146 @@
+/**
+ * Tabs 选项卡切换组件样式
+ */
+
+.css-tabs {
+  position: relative;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+/* ===== line 风格 ===== */
+.css-tabs--line {
+  border-bottom: 2px solid var(--color-primary-golden-05);
+}
+
+/* ===== card 风格 ===== */
+.css-tabs--card {
+  gap: 4px;
+  padding: 4px;
+  background: var(--color-dark-01);
+  border-radius: var(--radius-lg);
+}
+
+/* ===== 尺寸 ===== */
+.css-tabs--sm .css-tabs__item {
+  height: 32px;
+  padding: 0 12px;
+  font-size: var(--font-size-xs);
+}
+
+.css-tabs--md .css-tabs__item {
+  flex: 1;
+  height: 40px;
+  padding: 0 16px;
+  font-size: var(--font-size-sm);
+}
+
+.css-tabs--lg .css-tabs__item {
+  height: 48px;
+  padding: 0 20px;
+  font-size: var(--font-size-base);
+}
+
+/* ===== Tab 项 ===== */
+.css-tabs__item {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  flex-shrink: 0;
+  padding: 0 16px;
+  height: 40px;
+  border: none;
+  border-radius: 0;
+  background: transparent;
+  color: var(--color-primary-golden-02);
+  font-family: var(--font-family-base);
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-normal);
+  line-height: 1;
+  white-space: nowrap;
+  cursor: pointer;
+  outline: none;
+  box-sizing: border-box;
+  transition:
+    color var(--transition-duration-150) var(--transition-timing),
+    background-color var(--transition-duration-150) var(--transition-timing);
+}
+
+.css-tabs__item:hover:not(.css-tabs__item--active):not(.css-tabs__item--disabled) {
+  color: var(--color-dark);
+}
+
+/* ===== line 激活态 ===== */
+.css-tabs--line .css-tabs__item--active {
+  color: var(--color-primary);
+  font-weight: var(--font-weight-medium);
+}
+
+.css-tabs--line .css-tabs__item--active::after {
+  content: '';
+  position: absolute;
+  bottom: -2px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: calc(100% - 16px);
+  height: 4px;
+  background: var(--color-primary);
+  border-top-left-radius: var(--radius-sm);
+  border-top-right-radius: var(--radius-sm);
+}
+
+.css-tabs--line .css-tabs__item--active::before {
+  content: '';
+  position: absolute;
+  bottom: 2px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 0;
+  height: 0;
+  border-left: 6px solid transparent;
+  border-right: 6px solid transparent;
+  border-bottom: 4px solid var(--color-primary);
+  z-index: 1;
+}
+
+/* ===== card 激活态 ===== */
+.css-tabs--card .css-tabs__item--active {
+  background: #ffffff;
+  color: var(--color-primary);
+  font-weight: var(--font-weight-medium);
+  border-radius: calc(var(--radius-lg) - 4px);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
+}
+
+/* ===== 图标 ===== */
+.css-tabs__icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+
+.css-tabs--sm .css-tabs__icon {
+  width: 14px;
+  height: 14px;
+}
+
+.css-tabs--md .css-tabs__icon {
+  width: 16px;
+  height: 16px;
+}
+
+.css-tabs--lg .css-tabs__icon {
+  width: 18px;
+  height: 18px;
+}
+
+/* ===== 禁用 ===== */
+.css-tabs__item--disabled {
+  color: var(--color-dark-03);
+  cursor: not-allowed;
+}