@dsh-plugin/dsh-ui-components 0.0.1 → 0.1.0-dev.43613492370

package/src/data/collection.tsx

@@ -1,71 +1,71 @@
-/**
- * 表格、列表与树。
- *
- * @module @dsh-plugin/dsh-ui-components/data/collection
- */
-import * as React from 'react'
-import { Arco } from '@dsh-plugin/dsh-loader/client'
-import { injectDataStyles } from './styles.js'
-
-/** {@link Table} 的 props。 */
-export type TableProps = React.ComponentPropsWithoutRef<typeof Arco.Table>
-
-/**
- * 数据表格。表头用模块底色，行悬停用交互填充。
- *
- * @param props - 见 {@link TableProps}。
- * @returns 表格元素。
- */
-function TableBase(props: TableProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.Table {...props} />
-}
-
-/**
- * 表格列配置的类型别名。
- *
- * 直接取 Arco 的列定义，避免手写一份会漂移的副本。
- */
-export type TableColumn = NonNullable<TableProps['columns']>[number]
-
-/** 带静态子组件的表格导出。 */
-export const Table = TableBase
-
-/** {@link List} 的 props。 */
-export type ListProps = React.ComponentPropsWithoutRef<typeof Arco.List>
-
-/**
- * 纵向列表。
- *
- * @param props - 见 {@link ListProps}。
- * @returns 列表元素。
- */
-function ListBase(props: ListProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.List {...props} />
-}
-
-/** {@link ListItem} 的 props。 */
-export type ListItemProps = React.ComponentPropsWithoutRef<typeof Arco.List.Item>
-
-/** 列表项，直接取 Arco 的原组件以保持子组件识别。 */
-export const ListItem: typeof Arco.List.Item = Arco.List.Item
-
-/** 带静态子组件的列表导出。 */
-export const List: typeof ListBase & { Item: typeof Arco.List.Item } = Object.assign(ListBase, {
-  Item: Arco.List.Item,
-})
-
-/** {@link Tree} 的 props。 */
-export type TreeProps = React.ComponentPropsWithoutRef<typeof Arco.Tree>
-
-/**
- * 树形结构。
- *
- * @param props - 见 {@link TreeProps}。
- * @returns 树元素。
- */
-export function Tree(props: TreeProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.Tree {...props} />
-}
+/**
+ * 表格、列表与树。
+ *
+ * @module @dsh-plugin/dsh-ui-components/data/collection
+ */
+import * as React from 'react'
+import { Arco } from '@dsh-plugin/dsh-loader/client'
+import { injectDataStyles } from './styles.js'
+
+/** {@link Table} 的 props。 */
+export type TableProps = React.ComponentPropsWithoutRef<typeof Arco.Table>
+
+/**
+ * 数据表格。表头用模块底色，行悬停用交互填充。
+ *
+ * @param props - 见 {@link TableProps}。
+ * @returns 表格元素。
+ */
+function TableBase(props: TableProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.Table {...props} />
+}
+
+/**
+ * 表格列配置的类型别名。
+ *
+ * 直接取 Arco 的列定义，避免手写一份会漂移的副本。
+ */
+export type TableColumn = NonNullable<TableProps['columns']>[number]
+
+/** 带静态子组件的表格导出。 */
+export const Table = TableBase
+
+/** {@link List} 的 props。 */
+export type ListProps = React.ComponentPropsWithoutRef<typeof Arco.List>
+
+/**
+ * 纵向列表。
+ *
+ * @param props - 见 {@link ListProps}。
+ * @returns 列表元素。
+ */
+function ListBase(props: ListProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.List {...props} />
+}
+
+/** {@link ListItem} 的 props。 */
+export type ListItemProps = React.ComponentPropsWithoutRef<typeof Arco.List.Item>
+
+/** 列表项，直接取 Arco 的原组件以保持子组件识别。 */
+export const ListItem: typeof Arco.List.Item = Arco.List.Item
+
+/** 带静态子组件的列表导出。 */
+export const List: typeof ListBase & { Item: typeof Arco.List.Item } = Object.assign(ListBase, {
+  Item: Arco.List.Item,
+})
+
+/** {@link Tree} 的 props。 */
+export type TreeProps = React.ComponentPropsWithoutRef<typeof Arco.Tree>
+
+/**
+ * 树形结构。
+ *
+ * @param props - 见 {@link TreeProps}。
+ * @returns 树元素。
+ */
+export function Tree(props: TreeProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.Tree {...props} />
+}

package/src/data/index.ts

@@ -1,39 +1,39 @@
-/**
- * 数据展示组件出口。
- *
- * @module @dsh-plugin/dsh-ui-components/data
- */
-export { List, ListItem, Table, Tree, type ListItemProps, type ListProps, type TableColumn, type TableProps, type TreeProps } from './collection.js'
-export {
-  Cascader,
-  DatePicker,
-  MonthPicker,
-  QuarterPicker,
-  RangePicker,
-  TimePicker,
-  TimeRangePicker,
-  Transfer,
-  TreeSelect,
-  WeekPicker,
-  YearPicker,
-  type CascaderProps,
-  type DatePickerProps,
-  type TimePickerProps,
-  type TransferProps,
-  type TreeSelectProps,
-} from './picker.js'
-export {
-  Calendar,
-  Carousel,
-  Image,
-  Statistic,
-  Timeline,
-  TimelineItem,
-  type CalendarProps,
-  type CarouselProps,
-  type ImageProps,
-  type StatisticProps,
-  type TimelineItemProps,
-  type TimelineProps,
-} from './info.js'
-export { DATA_CSS, injectDataStyles } from './styles.js'
+/**
+ * 数据展示组件出口。
+ *
+ * @module @dsh-plugin/dsh-ui-components/data
+ */
+export { List, ListItem, Table, Tree, type ListItemProps, type ListProps, type TableColumn, type TableProps, type TreeProps } from './collection.js'
+export {
+  Cascader,
+  DatePicker,
+  MonthPicker,
+  QuarterPicker,
+  RangePicker,
+  TimePicker,
+  TimeRangePicker,
+  Transfer,
+  TreeSelect,
+  WeekPicker,
+  YearPicker,
+  type CascaderProps,
+  type DatePickerProps,
+  type TimePickerProps,
+  type TransferProps,
+  type TreeSelectProps,
+} from './picker.js'
+export {
+  Calendar,
+  Carousel,
+  Image,
+  Statistic,
+  Timeline,
+  TimelineItem,
+  type CalendarProps,
+  type CarouselProps,
+  type ImageProps,
+  type StatisticProps,
+  type TimelineItemProps,
+  type TimelineProps,
+} from './info.js'
+export { DATA_CSS, injectDataStyles } from './styles.js'

package/src/data/info.tsx

@@ -1,89 +1,89 @@
-/**
- * 其余数据展示组件：统计、时间线、日历、轮播与图片。
- *
- * @module @dsh-plugin/dsh-ui-components/data/info
- */
-import * as React from 'react'
-import { Arco } from '@dsh-plugin/dsh-loader/client'
-import { injectDataStyles } from './styles.js'
-
-/** {@link Statistic} 的 props。 */
-export type StatisticProps = React.ComponentPropsWithoutRef<typeof Arco.Statistic>
-
-/**
- * 指标数值。
- *
- * @param props - 见 {@link StatisticProps}。
- * @returns 统计元素。
- */
-export function Statistic(props: StatisticProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.Statistic {...props} />
-}
-
-/** {@link Timeline} 的 props。 */
-export type TimelineProps = React.ComponentPropsWithoutRef<typeof Arco.Timeline>
-
-/**
- * 时间线。
- *
- * @param props - 见 {@link TimelineProps}。
- * @returns 时间线元素。
- */
-function TimelineBase(props: TimelineProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.Timeline {...props} />
-}
-
-/** {@link TimelineItem} 的 props。 */
-export type TimelineItemProps = React.ComponentPropsWithoutRef<typeof Arco.Timeline.Item>
-
-/** 时间线节点，直接取 Arco 的原组件以保持子组件识别。 */
-export const TimelineItem: typeof Arco.Timeline.Item = Arco.Timeline.Item
-
-/** 带静态子组件的时间线导出。 */
-export const Timeline: typeof TimelineBase & { Item: typeof Arco.Timeline.Item } = Object.assign(TimelineBase, {
-  Item: Arco.Timeline.Item,
-})
-
-/** {@link Calendar} 的 props。 */
-export type CalendarProps = React.ComponentPropsWithoutRef<typeof Arco.Calendar>
-
-/**
- * 日历。
- *
- * @param props - 见 {@link CalendarProps}。
- * @returns 日历元素。
- */
-export function Calendar(props: CalendarProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.Calendar {...props} />
-}
-
-/** {@link Carousel} 的 props。 */
-export type CarouselProps = React.ComponentPropsWithoutRef<typeof Arco.Carousel>
-
-/**
- * 轮播。
- *
- * @param props - 见 {@link CarouselProps}。
- * @returns 轮播元素。
- */
-export function Carousel(props: CarouselProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.Carousel {...props} />
-}
-
-/** {@link Image} 的 props。 */
-export type ImageProps = React.ComponentPropsWithoutRef<typeof Arco.Image>
-
-/**
- * 图片，带预览。
- *
- * @param props - 见 {@link ImageProps}。
- * @returns 图片元素。
- */
-export function Image(props: ImageProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.Image {...props} />
-}
+/**
+ * 其余数据展示组件：统计、时间线、日历、轮播与图片。
+ *
+ * @module @dsh-plugin/dsh-ui-components/data/info
+ */
+import * as React from 'react'
+import { Arco } from '@dsh-plugin/dsh-loader/client'
+import { injectDataStyles } from './styles.js'
+
+/** {@link Statistic} 的 props。 */
+export type StatisticProps = React.ComponentPropsWithoutRef<typeof Arco.Statistic>
+
+/**
+ * 指标数值。
+ *
+ * @param props - 见 {@link StatisticProps}。
+ * @returns 统计元素。
+ */
+export function Statistic(props: StatisticProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.Statistic {...props} />
+}
+
+/** {@link Timeline} 的 props。 */
+export type TimelineProps = React.ComponentPropsWithoutRef<typeof Arco.Timeline>
+
+/**
+ * 时间线。
+ *
+ * @param props - 见 {@link TimelineProps}。
+ * @returns 时间线元素。
+ */
+function TimelineBase(props: TimelineProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.Timeline {...props} />
+}
+
+/** {@link TimelineItem} 的 props。 */
+export type TimelineItemProps = React.ComponentPropsWithoutRef<typeof Arco.Timeline.Item>
+
+/** 时间线节点，直接取 Arco 的原组件以保持子组件识别。 */
+export const TimelineItem: typeof Arco.Timeline.Item = Arco.Timeline.Item
+
+/** 带静态子组件的时间线导出。 */
+export const Timeline: typeof TimelineBase & { Item: typeof Arco.Timeline.Item } = Object.assign(TimelineBase, {
+  Item: Arco.Timeline.Item,
+})
+
+/** {@link Calendar} 的 props。 */
+export type CalendarProps = React.ComponentPropsWithoutRef<typeof Arco.Calendar>
+
+/**
+ * 日历。
+ *
+ * @param props - 见 {@link CalendarProps}。
+ * @returns 日历元素。
+ */
+export function Calendar(props: CalendarProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.Calendar {...props} />
+}
+
+/** {@link Carousel} 的 props。 */
+export type CarouselProps = React.ComponentPropsWithoutRef<typeof Arco.Carousel>
+
+/**
+ * 轮播。
+ *
+ * @param props - 见 {@link CarouselProps}。
+ * @returns 轮播元素。
+ */
+export function Carousel(props: CarouselProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.Carousel {...props} />
+}
+
+/** {@link Image} 的 props。 */
+export type ImageProps = React.ComponentPropsWithoutRef<typeof Arco.Image>
+
+/**
+ * 图片，带预览。
+ *
+ * @param props - 见 {@link ImageProps}。
+ * @returns 图片元素。
+ */
+export function Image(props: ImageProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.Image {...props} />
+}

package/src/data/picker.tsx

@@ -1,113 +1,113 @@
-/**
- * 选择类数据组件：日期、时间、级联、树选择与穿梭框。
- *
- * 这些组件的浮层统一走菜单材质与浮起阴影，由 `data/styles` 落实。
- *
- * @module @dsh-plugin/dsh-ui-components/data/picker
- */
-import * as React from 'react'
-import { Arco } from '@dsh-plugin/dsh-loader/client'
-import { injectDataStyles } from './styles.js'
-
-/** {@link DatePicker} 的 props。 */
-export type DatePickerProps = React.ComponentPropsWithoutRef<typeof Arco.DatePicker>
-
-/**
- * 日期选择。
- *
- * @param props - 见 {@link DatePickerProps}。
- * @returns 日期选择元素。
- */
-function DatePickerBase(props: DatePickerProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.DatePicker {...props} />
-}
-
-/** 月份选择。 */
-export const MonthPicker: typeof Arco.DatePicker.MonthPicker = Arco.DatePicker.MonthPicker
-/** 年份选择。 */
-export const YearPicker: typeof Arco.DatePicker.YearPicker = Arco.DatePicker.YearPicker
-/** 季度选择。 */
-export const QuarterPicker: typeof Arco.DatePicker.QuarterPicker = Arco.DatePicker.QuarterPicker
-/** 周选择。 */
-export const WeekPicker: typeof Arco.DatePicker.WeekPicker = Arco.DatePicker.WeekPicker
-/** 日期区间选择。 */
-export const RangePicker: typeof Arco.DatePicker.RangePicker = Arco.DatePicker.RangePicker
-
-/** 带静态子组件的日期选择导出。 */
-export const DatePicker: typeof DatePickerBase & {
-  MonthPicker: typeof Arco.DatePicker.MonthPicker
-  YearPicker: typeof Arco.DatePicker.YearPicker
-  QuarterPicker: typeof Arco.DatePicker.QuarterPicker
-  WeekPicker: typeof Arco.DatePicker.WeekPicker
-  RangePicker: typeof Arco.DatePicker.RangePicker
-} = Object.assign(DatePickerBase, {
-  MonthPicker: Arco.DatePicker.MonthPicker,
-  YearPicker: Arco.DatePicker.YearPicker,
-  QuarterPicker: Arco.DatePicker.QuarterPicker,
-  WeekPicker: Arco.DatePicker.WeekPicker,
-  RangePicker: Arco.DatePicker.RangePicker,
-})
-
-/** {@link TimePicker} 的 props。 */
-export type TimePickerProps = React.ComponentPropsWithoutRef<typeof Arco.TimePicker>
-
-/**
- * 时间选择。
- *
- * @param props - 见 {@link TimePickerProps}。
- * @returns 时间选择元素。
- */
-function TimePickerBase(props: TimePickerProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.TimePicker {...props} />
-}
-
-/** 时间区间选择。 */
-export const TimeRangePicker: typeof Arco.TimePicker.RangePicker = Arco.TimePicker.RangePicker
-
-/** 带静态子组件的时间选择导出。 */
-export const TimePicker: typeof TimePickerBase & { RangePicker: typeof Arco.TimePicker.RangePicker } =
-  Object.assign(TimePickerBase, { RangePicker: Arco.TimePicker.RangePicker })
-
-/** {@link Cascader} 的 props。 */
-export type CascaderProps = React.ComponentPropsWithoutRef<typeof Arco.Cascader>
-
-/**
- * 级联选择。
- *
- * @param props - 见 {@link CascaderProps}。
- * @returns 级联元素。
- */
-export function Cascader(props: CascaderProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.Cascader {...props} />
-}
-
-/** {@link TreeSelect} 的 props。 */
-export type TreeSelectProps = React.ComponentPropsWithoutRef<typeof Arco.TreeSelect>
-
-/**
- * 树形选择。
- *
- * @param props - 见 {@link TreeSelectProps}。
- * @returns 树选择元素。
- */
-export function TreeSelect(props: TreeSelectProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.TreeSelect {...props} />
-}
-
-/** {@link Transfer} 的 props。 */
-export type TransferProps = React.ComponentPropsWithoutRef<typeof Arco.Transfer>
-
-/**
- * 穿梭框。
- *
- * @param props - 见 {@link TransferProps}。
- * @returns 穿梭框元素。
- */
-export function Transfer(props: TransferProps): React.ReactElement {
-  injectDataStyles()
-  return <Arco.Transfer {...props} />
-}
+/**
+ * 选择类数据组件：日期、时间、级联、树选择与穿梭框。
+ *
+ * 这些组件的浮层统一走菜单材质与浮起阴影，由 `data/styles` 落实。
+ *
+ * @module @dsh-plugin/dsh-ui-components/data/picker
+ */
+import * as React from 'react'
+import { Arco } from '@dsh-plugin/dsh-loader/client'
+import { injectDataStyles } from './styles.js'
+
+/** {@link DatePicker} 的 props。 */
+export type DatePickerProps = React.ComponentPropsWithoutRef<typeof Arco.DatePicker>
+
+/**
+ * 日期选择。
+ *
+ * @param props - 见 {@link DatePickerProps}。
+ * @returns 日期选择元素。
+ */
+function DatePickerBase(props: DatePickerProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.DatePicker {...props} />
+}
+
+/** 月份选择。 */
+export const MonthPicker: typeof Arco.DatePicker.MonthPicker = Arco.DatePicker.MonthPicker
+/** 年份选择。 */
+export const YearPicker: typeof Arco.DatePicker.YearPicker = Arco.DatePicker.YearPicker
+/** 季度选择。 */
+export const QuarterPicker: typeof Arco.DatePicker.QuarterPicker = Arco.DatePicker.QuarterPicker
+/** 周选择。 */
+export const WeekPicker: typeof Arco.DatePicker.WeekPicker = Arco.DatePicker.WeekPicker
+/** 日期区间选择。 */
+export const RangePicker: typeof Arco.DatePicker.RangePicker = Arco.DatePicker.RangePicker
+
+/** 带静态子组件的日期选择导出。 */
+export const DatePicker: typeof DatePickerBase & {
+  MonthPicker: typeof Arco.DatePicker.MonthPicker
+  YearPicker: typeof Arco.DatePicker.YearPicker
+  QuarterPicker: typeof Arco.DatePicker.QuarterPicker
+  WeekPicker: typeof Arco.DatePicker.WeekPicker
+  RangePicker: typeof Arco.DatePicker.RangePicker
+} = Object.assign(DatePickerBase, {
+  MonthPicker: Arco.DatePicker.MonthPicker,
+  YearPicker: Arco.DatePicker.YearPicker,
+  QuarterPicker: Arco.DatePicker.QuarterPicker,
+  WeekPicker: Arco.DatePicker.WeekPicker,
+  RangePicker: Arco.DatePicker.RangePicker,
+})
+
+/** {@link TimePicker} 的 props。 */
+export type TimePickerProps = React.ComponentPropsWithoutRef<typeof Arco.TimePicker>
+
+/**
+ * 时间选择。
+ *
+ * @param props - 见 {@link TimePickerProps}。
+ * @returns 时间选择元素。
+ */
+function TimePickerBase(props: TimePickerProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.TimePicker {...props} />
+}
+
+/** 时间区间选择。 */
+export const TimeRangePicker: typeof Arco.TimePicker.RangePicker = Arco.TimePicker.RangePicker
+
+/** 带静态子组件的时间选择导出。 */
+export const TimePicker: typeof TimePickerBase & { RangePicker: typeof Arco.TimePicker.RangePicker } =
+  Object.assign(TimePickerBase, { RangePicker: Arco.TimePicker.RangePicker })
+
+/** {@link Cascader} 的 props。 */
+export type CascaderProps = React.ComponentPropsWithoutRef<typeof Arco.Cascader>
+
+/**
+ * 级联选择。
+ *
+ * @param props - 见 {@link CascaderProps}。
+ * @returns 级联元素。
+ */
+export function Cascader(props: CascaderProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.Cascader {...props} />
+}
+
+/** {@link TreeSelect} 的 props。 */
+export type TreeSelectProps = React.ComponentPropsWithoutRef<typeof Arco.TreeSelect>
+
+/**
+ * 树形选择。
+ *
+ * @param props - 见 {@link TreeSelectProps}。
+ * @returns 树选择元素。
+ */
+export function TreeSelect(props: TreeSelectProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.TreeSelect {...props} />
+}
+
+/** {@link Transfer} 的 props。 */
+export type TransferProps = React.ComponentPropsWithoutRef<typeof Arco.Transfer>
+
+/**
+ * 穿梭框。
+ *
+ * @param props - 见 {@link TransferProps}。
+ * @returns 穿梭框元素。
+ */
+export function Transfer(props: TransferProps): React.ReactElement {
+  injectDataStyles()
+  return <Arco.Transfer {...props} />
+}