@henryx/onedot-ui 0.1.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +19 -12
- package/dist/components/OdTable.types.d.ts +35 -25
- package/dist/components/OdTable.vue.d.ts +6 -7
- package/dist/index.d.ts +1 -1
- package/dist/onedot-ui.cjs +19 -19
- package/dist/onedot-ui.cjs.map +1 -1
- package/dist/onedot-ui.js +1605 -1648
- package/dist/onedot-ui.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +6 -4
package/README.md
CHANGED
|
@@ -4,8 +4,8 @@ Vue 3 components and design tokens for the Onedot team.
|
|
|
4
4
|
|
|
5
5
|
## Documentation
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
See the team's deployed Storybook for the complete capability catalog and
|
|
8
|
+
interactive component examples.
|
|
9
9
|
|
|
10
10
|
## Install
|
|
11
11
|
|
|
@@ -29,8 +29,8 @@ Components use the `od-` CSS namespace. Theme variables can be overridden on
|
|
|
29
29
|
|
|
30
30
|
### Tables
|
|
31
31
|
|
|
32
|
-
`OdTable`
|
|
33
|
-
|
|
32
|
+
`OdTable` provides local tables and remote queries. The example below uses
|
|
33
|
+
the existing local mode:
|
|
34
34
|
|
|
35
35
|
```vue
|
|
36
36
|
<script setup lang="ts">
|
|
@@ -47,9 +47,12 @@ const rows = [{ id: 1, name: 'Ada' }]
|
|
|
47
47
|
</template>
|
|
48
48
|
```
|
|
49
49
|
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
`
|
|
50
|
+
Remote tables use frontend columns and one POST query endpoint
|
|
51
|
+
returning paginated data plus `meta.fields` for query capabilities and enum
|
|
52
|
+
options. Use `query-url` or `load-data`, with the same `columns` and `row-key`
|
|
53
|
+
props. Field slots such as `#cell-name` let the page render links or dialog
|
|
54
|
+
buttons. See the [OdTable guide](./用户使用手册/OdTable.md) for complete examples,
|
|
55
|
+
and the [capability list](./用户使用手册/能力清单.md) for implementation status.
|
|
53
56
|
|
|
54
57
|
## Development
|
|
55
58
|
|
|
@@ -60,12 +63,17 @@ corepack pnpm dev
|
|
|
60
63
|
```
|
|
61
64
|
|
|
62
65
|
Storybook is served at `http://localhost:6006`.
|
|
66
|
+
For browsing without development compilation or file watching, run
|
|
67
|
+
`corepack pnpm build:storybook` then `corepack pnpm preview:storybook`.
|
|
68
|
+
See the [Storybook guide](./用户使用手册/Storybook.md) for preview and icon search usage.
|
|
63
69
|
|
|
64
70
|
Open [Capabilities](http://localhost:6006/?path=/story/capabilities--all) for the
|
|
65
71
|
complete catalog, existing Od stories and PrimeVue 4.5.5 (MIT) previews with Aura.
|
|
66
|
-
The catalog is generated from the user manual; PrimeVue
|
|
67
|
-
|
|
72
|
+
The catalog is generated from the user manual; PrimeVue is included as a pinned
|
|
73
|
+
runtime dependency but is not re-exported from the public Onedot UI entry point.
|
|
68
74
|
Basic form inputs use PrimeVue directly; this package does not export `OdForm` or `OdInput`.
|
|
75
|
+
PrimeVue `4.5.5` and Aura theme `1.2.5` are installed and versioned by this
|
|
76
|
+
package for the Onedot organization.
|
|
69
77
|
|
|
70
78
|
Before publishing, run the complete release check:
|
|
71
79
|
|
|
@@ -107,9 +115,8 @@ The full Tabler Vue catalog and raw SVG assets are shipped inside this package,
|
|
|
107
115
|
so moving the component library to another application does not require a
|
|
108
116
|
second icon dependency or a network request.
|
|
109
117
|
|
|
110
|
-
|
|
111
|
-
`corepack pnpm release:check
|
|
112
|
-
`npm publish --access public` from this directory.
|
|
118
|
+
The current package version is `0.3.0`. Maintainers should run
|
|
119
|
+
`corepack pnpm release:check` before publishing subsequent versions.
|
|
113
120
|
|
|
114
121
|
## License
|
|
115
122
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
import { VNodeChild } from 'vue';
|
|
2
2
|
export type OdTableRowKey = string | number;
|
|
3
3
|
export type OdTableDataType = 'text' | 'number' | 'datetime' | 'boolean' | 'enum';
|
|
4
4
|
export type OdTableOption = {
|
|
@@ -27,6 +27,16 @@ export type OdTableColumn = {
|
|
|
27
27
|
false: string;
|
|
28
28
|
};
|
|
29
29
|
};
|
|
30
|
+
export type OdTableCellContext<T extends object> = {
|
|
31
|
+
row: T;
|
|
32
|
+
rowKey: OdTableRowKey;
|
|
33
|
+
column: OdTableColumn;
|
|
34
|
+
value: unknown;
|
|
35
|
+
text: string;
|
|
36
|
+
};
|
|
37
|
+
export type OdTableSlots<T extends object> = {
|
|
38
|
+
[name: `cell-${string}`]: ((context: OdTableCellContext<T>) => VNodeChild) | undefined;
|
|
39
|
+
};
|
|
30
40
|
export type OdTableSorting = {
|
|
31
41
|
field: string;
|
|
32
42
|
direction: 'asc' | 'desc';
|
|
@@ -47,32 +57,32 @@ export type OdTableQuery = {
|
|
|
47
57
|
sorting: OdTableSorting[];
|
|
48
58
|
};
|
|
49
59
|
export type OdTableInitialQuery = Partial<OdTableQuery>;
|
|
60
|
+
export type OdTableFieldMeta = {
|
|
61
|
+
sortable?: boolean;
|
|
62
|
+
searchable?: boolean;
|
|
63
|
+
filterable?: boolean;
|
|
64
|
+
options?: OdTableOption[];
|
|
65
|
+
};
|
|
66
|
+
export type OdTableMeta = {
|
|
67
|
+
fields: Record<string, OdTableFieldMeta>;
|
|
68
|
+
};
|
|
50
69
|
export type OdTableResult<T> = {
|
|
51
70
|
items: T[];
|
|
52
71
|
total: number;
|
|
53
72
|
page: number;
|
|
54
73
|
pageSize: number;
|
|
74
|
+
meta: OdTableMeta;
|
|
55
75
|
};
|
|
56
76
|
export type OdTablePaginationConfig = {
|
|
57
77
|
defaultPageSize?: number;
|
|
58
78
|
pageSizeOptions?: number[];
|
|
59
79
|
};
|
|
60
|
-
export type OdTableSchema = {
|
|
61
|
-
rowKey: string;
|
|
62
|
-
columns: OdTableColumn[];
|
|
63
|
-
defaultSorting?: OdTableSorting[];
|
|
64
|
-
pagination?: {
|
|
65
|
-
defaultPageSize: number;
|
|
66
|
-
pageSizeOptions: number[];
|
|
67
|
-
};
|
|
68
|
-
};
|
|
69
80
|
export type OdTableRequest = (url: string, options: {
|
|
70
|
-
method: '
|
|
81
|
+
method: 'POST';
|
|
71
82
|
headers?: Record<string, string>;
|
|
72
|
-
body
|
|
83
|
+
body: OdTableQuery;
|
|
73
84
|
signal: AbortSignal;
|
|
74
85
|
}) => Promise<unknown>;
|
|
75
|
-
export type OdTableLoadSchema = () => Promise<OdTableSchema>;
|
|
76
86
|
export type OdTableLoadData<T> = (query: OdTableQuery, context: {
|
|
77
87
|
signal: AbortSignal;
|
|
78
88
|
}) => Promise<OdTableResult<T>>;
|
|
@@ -113,13 +123,11 @@ export type OdTableLocale = Partial<{
|
|
|
113
123
|
/** Built-in Chinese copy. Consumers override entries through the `locale` prop. */
|
|
114
124
|
export declare const OD_TABLE_DEFAULT_LOCALE: Required<OdTableLocale>;
|
|
115
125
|
export type OdTableProps<T extends object> = {
|
|
116
|
-
columns
|
|
126
|
+
columns: OdTableColumn[];
|
|
117
127
|
rows?: T[];
|
|
118
|
-
rowKey
|
|
128
|
+
rowKey: string;
|
|
119
129
|
pagination?: OdTablePaginationConfig;
|
|
120
|
-
loadSchema?: OdTableLoadSchema;
|
|
121
130
|
loadData?: OdTableLoadData<T>;
|
|
122
|
-
schemaUrl?: string;
|
|
123
131
|
queryUrl?: string;
|
|
124
132
|
request?: OdTableRequest;
|
|
125
133
|
initialQuery?: OdTableInitialQuery;
|
|
@@ -144,17 +152,16 @@ export type OdTableEvents<T> = {
|
|
|
144
152
|
field: string;
|
|
145
153
|
width: number;
|
|
146
154
|
}) => void;
|
|
147
|
-
'schema-error': (error: unknown) => void;
|
|
148
155
|
'data-error': (payload: {
|
|
149
156
|
error: unknown;
|
|
150
157
|
query: OdTableQuery;
|
|
151
158
|
}) => void;
|
|
152
159
|
retry: (payload: {
|
|
153
|
-
stage: '
|
|
160
|
+
stage: 'data';
|
|
154
161
|
}) => void;
|
|
155
162
|
'config-error': (error: OdTableConfigError) => void;
|
|
156
163
|
};
|
|
157
|
-
export type OdTableConfigErrorCode = 'MODE_MISSING' | 'MODE_PARTIAL' | 'MODE_CONFLICT' | 'REQUEST_WITHOUT_URL_MODE' | '
|
|
164
|
+
export type OdTableConfigErrorCode = 'MODE_MISSING' | 'MODE_PARTIAL' | 'MODE_CONFLICT' | 'REQUEST_WITHOUT_URL_MODE' | 'INVALID_COLUMNS' | 'DUPLICATE_COLUMN_FIELD' | 'INVALID_COLUMN_FIELD' | 'INVALID_COLUMN_WIDTH' | 'INVALID_NUMBER_FORMAT' | 'SEARCHABLE_NON_TEXT' | 'FILTERABLE_NON_ENUM' | 'ENUM_OPTIONS_REQUIRED' | 'DUPLICATE_ENUM_OPTION' | 'INVALID_PAGINATION' | 'MISSING_ROW_KEY' | 'DUPLICATE_ROW_KEY' | 'INVALID_INITIAL_QUERY' | 'INVALID_ROWS' | 'INVALID_RESULT' | 'RESULT_TOTAL_INVALID' | 'RESULT_PAGE_INVALID' | 'RESULT_PAGE_SIZE_INVALID' | 'RESULT_ITEMS_OVERFLOW' | 'RESULT_EMPTY_CONFLICT' | 'INVALID_META' | 'META_QUERY_CONFLICT';
|
|
158
165
|
export declare class OdTableConfigError extends Error {
|
|
159
166
|
readonly name = "OdTableConfigError";
|
|
160
167
|
readonly code: OdTableConfigErrorCode;
|
|
@@ -162,17 +169,16 @@ export declare class OdTableConfigError extends Error {
|
|
|
162
169
|
constructor(code: OdTableConfigErrorCode, message: string, details?: unknown);
|
|
163
170
|
}
|
|
164
171
|
export type OdTableSourceMode = 'local' | 'function' | 'url';
|
|
165
|
-
type OdTableSourceInput<T extends object> = Pick<OdTableProps<T>, 'columns' | 'rows' | 'rowKey' | 'pagination' | '
|
|
166
|
-
export declare function validateOdTableColumns(columns: unknown): OdTableColumn[];
|
|
172
|
+
type OdTableSourceInput<T extends object> = Partial<Pick<OdTableProps<T>, 'columns' | 'rows' | 'rowKey' | 'pagination' | 'loadData' | 'queryUrl' | 'request'>>;
|
|
173
|
+
export declare function validateOdTableColumns(columns: unknown, remote?: boolean): OdTableColumn[];
|
|
167
174
|
export declare function validateOdTablePagination(pagination: unknown): OdTablePaginationConfig;
|
|
168
|
-
export declare function validateOdTableSchema(schema: unknown): OdTableSchema;
|
|
169
175
|
export declare function validateOdTableInitialQuery(query: unknown): OdTableInitialQuery | undefined;
|
|
170
176
|
/**
|
|
171
|
-
* Checks query conditions against
|
|
177
|
+
* Checks query conditions against resolved column capabilities.
|
|
172
178
|
* Keeping this validation next to the shape validator prevents local and
|
|
173
179
|
* remote modes from silently accepting conditions the column contract forbids.
|
|
174
180
|
*/
|
|
175
|
-
export declare function validateOdTableInitialQueryForColumns(query: OdTableInitialQuery | undefined, columns: readonly OdTableColumn[]): OdTableInitialQuery | undefined;
|
|
181
|
+
export declare function validateOdTableInitialQueryForColumns(query: OdTableInitialQuery | undefined, columns: readonly OdTableColumn[], pending?: boolean, code?: 'INVALID_INITIAL_QUERY' | 'META_QUERY_CONFLICT'): OdTableInitialQuery | undefined;
|
|
176
182
|
export declare function validateOdTableRows<T extends object>(rows: unknown, rowKey: string): T[];
|
|
177
183
|
export declare function validateOdTableSourceMode<T extends object>(input: OdTableSourceInput<T>): OdTableSourceMode;
|
|
178
184
|
/**
|
|
@@ -181,4 +187,8 @@ export declare function validateOdTableSourceMode<T extends object>(input: OdTab
|
|
|
181
187
|
* so callers can route them to `data-error` without string matching.
|
|
182
188
|
*/
|
|
183
189
|
export declare function validateOdTableResult<T>(payload: unknown): OdTableResult<T>;
|
|
190
|
+
/** Copy only supported metadata so extra response properties cannot define UI. */
|
|
191
|
+
export declare function validateOdTableMeta(payload: unknown): OdTableMeta;
|
|
192
|
+
/** A null snapshot means the first response has not arrived: all query UI is closed. */
|
|
193
|
+
export declare function resolveOdTableRemoteColumns(columns: readonly OdTableColumn[], meta: OdTableMeta | null): OdTableColumn[];
|
|
184
194
|
export {};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { OdTableConfigError, OdTableProps, OdTableQuery, OdTableRowKey } from './OdTable.types';
|
|
1
|
+
import { OdTableConfigError, OdTableProps, OdTableQuery, OdTableRowKey, OdTableSlots } from './OdTable.types';
|
|
2
2
|
declare const _default: <T extends object>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
3
3
|
props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
|
|
4
4
|
readonly onRetry?: ((payload: {
|
|
5
|
-
stage: "
|
|
5
|
+
stage: "data";
|
|
6
6
|
}) => any) | undefined;
|
|
7
7
|
readonly "onSelection-change"?: ((keys: OdTableRowKey[], rows: T[]) => any) | undefined;
|
|
8
8
|
readonly "onUpdate:selected-row-keys"?: ((keys: OdTableRowKey[]) => any) | undefined;
|
|
@@ -12,24 +12,23 @@ declare const _default: <T extends object>(__VLS_props: NonNullable<Awaited<type
|
|
|
12
12
|
field: string;
|
|
13
13
|
width: number;
|
|
14
14
|
}) => any) | undefined;
|
|
15
|
-
readonly "onSchema-error"?: ((error: unknown) => any) | undefined;
|
|
16
15
|
readonly "onData-error"?: ((payload: {
|
|
17
16
|
error: unknown;
|
|
18
17
|
query: OdTableQuery;
|
|
19
18
|
}) => any) | undefined;
|
|
20
19
|
readonly "onConfig-error"?: ((error: OdTableConfigError) => any) | undefined;
|
|
21
|
-
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onRetry" | "onSelection-change" | "onUpdate:selected-row-keys" | "onQuery-change" | "onColumn-visibility-change" | "onColumn-width-change" | "
|
|
20
|
+
} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onRetry" | "onSelection-change" | "onUpdate:selected-row-keys" | "onQuery-change" | "onColumn-visibility-change" | "onColumn-width-change" | "onData-error" | "onConfig-error"> & OdTableProps<T> & Partial<{}>> & import('vue').PublicProps;
|
|
22
21
|
expose(exposed: import('vue').ShallowUnwrapRef<{
|
|
23
22
|
refresh: () => Promise<void>;
|
|
24
23
|
}>): void;
|
|
25
24
|
attrs: any;
|
|
26
|
-
slots:
|
|
25
|
+
slots: Readonly<OdTableSlots<T>> & OdTableSlots<T>;
|
|
27
26
|
emit: ((evt: "retry", payload: {
|
|
28
|
-
stage: "
|
|
27
|
+
stage: "data";
|
|
29
28
|
}) => void) & ((evt: "selection-change", keys: OdTableRowKey[], rows: T[]) => void) & ((evt: "update:selected-row-keys", keys: OdTableRowKey[]) => void) & ((evt: "query-change", query: OdTableQuery) => void) & ((evt: "column-visibility-change", visibility: Record<string, boolean>) => void) & ((evt: "column-width-change", payload: {
|
|
30
29
|
field: string;
|
|
31
30
|
width: number;
|
|
32
|
-
}) => void) & ((evt: "
|
|
31
|
+
}) => void) & ((evt: "data-error", payload: {
|
|
33
32
|
error: unknown;
|
|
34
33
|
query: OdTableQuery;
|
|
35
34
|
}) => void) & ((evt: "config-error", error: OdTableConfigError) => void);
|
package/dist/index.d.ts
CHANGED
|
@@ -5,7 +5,7 @@ import { default as OdTable } from './components/OdTable.vue';
|
|
|
5
5
|
export { OdButton, OdIcon, OdTable };
|
|
6
6
|
export { OdTableConfigError } from './components/OdTable.types';
|
|
7
7
|
export type { OdButtonVariant, OdSize } from './components/OdButton.vue';
|
|
8
|
-
export type { OdTableColumn, OdTableConfigErrorCode, OdTableDataType, OdTableEvents, OdTableExpose, OdTableFilter, OdTableInitialQuery, OdTableLocale, OdTableOption, OdTablePaginationConfig, OdTableProps, OdTableQuery, OdTableRequest, OdTableResult, OdTableRowKey,
|
|
8
|
+
export type { OdTableCellContext, OdTableColumn, OdTableConfigErrorCode, OdTableDataType, OdTableEvents, OdTableExpose, OdTableFilter, OdTableFieldMeta, OdTableInitialQuery, OdTableLocale, OdTableMeta, OdTableOption, OdTablePaginationConfig, OdTableProps, OdTableQuery, OdTableRequest, OdTableResult, OdTableRowKey, OdTableSearch, OdTableSorting, OdTableSlots, OdTableLoadData, } from './components/OdTable.types';
|
|
9
9
|
export declare const OnedotUI: {
|
|
10
10
|
install(app: App): void;
|
|
11
11
|
};
|