@rokkit/ui 1.3.4 → 1.3.5
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/dist/components/index.js +63 -0
- package/dist/index.js +8 -0
- package/dist/markdown-plugin.js +1 -0
- package/dist/types/alert-list.js +7 -0
- package/dist/types/avatar.js +4 -0
- package/dist/types/badge.js +4 -0
- package/dist/types/breadcrumbs.js +4 -0
- package/dist/types/button.js +7 -0
- package/dist/types/card.js +4 -0
- package/dist/types/carousel.js +4 -0
- package/dist/types/chat.js +1 -0
- package/dist/types/code.js +12 -0
- package/dist/types/connector.js +8 -0
- package/dist/types/divider.js +4 -0
- package/dist/types/floating-action.js +12 -0
- package/dist/types/floating-navigation.js +1 -0
- package/dist/types/frame.js +8 -0
- package/dist/types/index.js +93 -0
- package/dist/types/item-content.js +8 -0
- package/dist/types/item-switch.js +10 -0
- package/dist/types/item-toggle.js +12 -0
- package/dist/types/list.js +36 -0
- package/dist/types/lock-mode.js +1 -0
- package/dist/types/menu.js +25 -0
- package/dist/types/message.js +4 -0
- package/dist/types/nav-content.js +4 -0
- package/dist/types/palette.js +54 -0
- package/dist/types/pill.js +4 -0
- package/dist/types/progress-bar.js +4 -0
- package/dist/types/range.js +7 -0
- package/dist/types/rating.js +4 -0
- package/dist/types/responsive-grid.js +4 -0
- package/dist/types/reveal.js +4 -0
- package/dist/types/search-filter.js +7 -0
- package/dist/types/select.js +21 -0
- package/dist/types/shine.js +7 -0
- package/dist/types/stack.js +4 -0
- package/dist/types/status-list.js +7 -0
- package/dist/types/stepper.js +4 -0
- package/dist/types/switch.js +7 -0
- package/dist/types/table.js +23 -0
- package/dist/types/tabs.js +7 -0
- package/dist/types/tilt.js +4 -0
- package/dist/types/timeline.js +14 -0
- package/dist/types/toggle.js +7 -0
- package/dist/types/toolbar.js +20 -0
- package/dist/types/tooltip.js +1 -0
- package/dist/types/tree-table.js +10 -0
- package/dist/types/tree.js +94 -0
- package/dist/types/upload-file-status.js +8 -0
- package/dist/types/upload-progress.js +8 -0
- package/dist/types/upload-target.js +7 -0
- package/dist/utils/palette.js +641 -0
- package/dist/utils/relative-time.js +17 -0
- package/dist/utils/shiki.js +118 -0
- package/package.json +13 -14
- package/src/components/index.ts +0 -63
- package/src/index.ts +0 -75
- package/src/markdown-plugin.ts +0 -12
- package/src/types/alert-list.ts +0 -28
- package/src/types/avatar.ts +0 -41
- package/src/types/badge.ts +0 -37
- package/src/types/breadcrumbs.ts +0 -43
- package/src/types/button.ts +0 -92
- package/src/types/card.ts +0 -38
- package/src/types/carousel.ts +0 -49
- package/src/types/chat.ts +0 -81
- package/src/types/code.ts +0 -147
- package/src/types/connector.ts +0 -22
- package/src/types/divider.ts +0 -20
- package/src/types/floating-action.ts +0 -123
- package/src/types/floating-navigation.ts +0 -80
- package/src/types/frame.ts +0 -29
- package/src/types/index.ts +0 -137
- package/src/types/item-content.ts +0 -26
- package/src/types/item-switch.ts +0 -34
- package/src/types/item-toggle.ts +0 -52
- package/src/types/list.ts +0 -200
- package/src/types/lock-mode.ts +0 -16
- package/src/types/menu.ts +0 -95
- package/src/types/message.ts +0 -54
- package/src/types/nav-content.ts +0 -31
- package/src/types/palette.ts +0 -160
- package/src/types/pill.ts +0 -43
- package/src/types/progress-bar.ts +0 -19
- package/src/types/range.ts +0 -51
- package/src/types/rating.ts +0 -43
- package/src/types/responsive-grid.ts +0 -25
- package/src/types/reveal.ts +0 -49
- package/src/types/search-filter.ts +0 -67
- package/src/types/select.ts +0 -176
- package/src/types/shine.ts +0 -37
- package/src/types/stack.ts +0 -40
- package/src/types/status-list.ts +0 -42
- package/src/types/stepper.ts +0 -74
- package/src/types/switch.ts +0 -68
- package/src/types/table.ts +0 -219
- package/src/types/tabs.ts +0 -103
- package/src/types/tilt.ts +0 -28
- package/src/types/timeline.ts +0 -53
- package/src/types/toggle.ts +0 -81
- package/src/types/toolbar.ts +0 -167
- package/src/types/tooltip.ts +0 -21
- package/src/types/tree-table.ts +0 -103
- package/src/types/tree.ts +0 -302
- package/src/types/upload-file-status.ts +0 -45
- package/src/types/upload-progress.ts +0 -111
- package/src/types/upload-target.ts +0 -71
- package/src/utils/palette.ts +0 -750
- package/src/utils/relative-time.ts +0 -12
- package/src/utils/shiki.ts +0 -137
- /package/{src → dist}/MarkdownRenderer.svelte +0 -0
- /package/{src → dist}/components/AlertList.svelte +0 -0
- /package/{src → dist}/components/Avatar.svelte +0 -0
- /package/{src → dist}/components/Badge.svelte +0 -0
- /package/{src → dist}/components/BreadCrumbs.svelte +0 -0
- /package/{src → dist}/components/Button.svelte +0 -0
- /package/{src → dist}/components/ButtonGroup.svelte +0 -0
- /package/{src → dist}/components/Card.svelte +0 -0
- /package/{src → dist}/components/Carousel.svelte +0 -0
- /package/{src → dist}/components/ChatComposer.svelte +0 -0
- /package/{src → dist}/components/ChatHistory.svelte +0 -0
- /package/{src → dist}/components/ChatMessage.svelte +0 -0
- /package/{src → dist}/components/ChatShell.svelte +0 -0
- /package/{src → dist}/components/ChatTimeline.svelte +0 -0
- /package/{src → dist}/components/Code.svelte +0 -0
- /package/{src → dist}/components/CodeBlock.svelte +0 -0
- /package/{src → dist}/components/CodeGroup.svelte +0 -0
- /package/{src → dist}/components/CommandPalette.svelte +0 -0
- /package/{src → dist}/components/Connector.svelte +0 -0
- /package/{src → dist}/components/Divider.svelte +0 -0
- /package/{src → dist}/components/Dropdown.svelte +0 -0
- /package/{src → dist}/components/FloatingAction.svelte +0 -0
- /package/{src → dist}/components/FloatingNavigation.svelte +0 -0
- /package/{src → dist}/components/Frame.svelte +0 -0
- /package/{src → dist}/components/Grid.svelte +0 -0
- /package/{src → dist}/components/ItemContent.svelte +0 -0
- /package/{src → dist}/components/ItemSwitch.svelte +0 -0
- /package/{src → dist}/components/ItemToggle.svelte +0 -0
- /package/{src → dist}/components/LazyTree.svelte +0 -0
- /package/{src → dist}/components/List.svelte +0 -0
- /package/{src → dist}/components/LockMode.svelte +0 -0
- /package/{src → dist}/components/Menu.svelte +0 -0
- /package/{src → dist}/components/Message.svelte +0 -0
- /package/{src → dist}/components/MultiSelect.svelte +0 -0
- /package/{src → dist}/components/NavContent.svelte +0 -0
- /package/{src → dist}/components/PaletteManager.svelte +0 -0
- /package/{src → dist}/components/Pill.svelte +0 -0
- /package/{src → dist}/components/ProgressBar.svelte +0 -0
- /package/{src → dist}/components/Range.svelte +0 -0
- /package/{src → dist}/components/Rating.svelte +0 -0
- /package/{src → dist}/components/ResponsiveGrid.svelte +0 -0
- /package/{src → dist}/components/Reveal.svelte +0 -0
- /package/{src → dist}/components/SearchFilter.svelte +0 -0
- /package/{src → dist}/components/Select.svelte +0 -0
- /package/{src → dist}/components/Shine.svelte +0 -0
- /package/{src → dist}/components/Stack.svelte +0 -0
- /package/{src → dist}/components/StatusList.svelte +0 -0
- /package/{src → dist}/components/Stepper.svelte +0 -0
- /package/{src → dist}/components/Swatch.svelte +0 -0
- /package/{src → dist}/components/Switch.svelte +0 -0
- /package/{src → dist}/components/Table.svelte +0 -0
- /package/{src → dist}/components/Tabs.svelte +0 -0
- /package/{src → dist}/components/Tilt.svelte +0 -0
- /package/{src → dist}/components/Timeline.svelte +0 -0
- /package/{src → dist}/components/Toggle.svelte +0 -0
- /package/{src → dist}/components/Toolbar.svelte +0 -0
- /package/{src → dist}/components/ToolbarGroup.svelte +0 -0
- /package/{src → dist}/components/Tooltip.svelte +0 -0
- /package/{src → dist}/components/Tree.svelte +0 -0
- /package/{src → dist}/components/TreeTable.svelte +0 -0
- /package/{src → dist}/components/UploadFileStatus.svelte +0 -0
- /package/{src → dist}/components/UploadProgress.svelte +0 -0
- /package/{src → dist}/components/UploadTarget.svelte +0 -0
- /package/{src → dist}/utils/upload.js +0 -0
package/src/types/tree-table.ts
DELETED
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* TreeTable Component Types
|
|
3
|
-
*
|
|
4
|
-
* Hierarchical analog of Table — accepts nested rows (each row may
|
|
5
|
-
* carry a `children: []` array) and renders the hierarchy in one
|
|
6
|
-
* designated column with chevron + indent + tree connectors.
|
|
7
|
-
*
|
|
8
|
-
* Reuses the column / sort / cell types from Table.
|
|
9
|
-
*/
|
|
10
|
-
|
|
11
|
-
import type { Snippet } from 'svelte'
|
|
12
|
-
import type { TableColumn, TableSortIcons, SortState, TableFields } from './table.js'
|
|
13
|
-
|
|
14
|
-
// =============================================================================
|
|
15
|
-
// Column extension
|
|
16
|
-
// =============================================================================
|
|
17
|
-
|
|
18
|
-
/**
|
|
19
|
-
* Column definition for TreeTable — adds an optional `hierarchy` flag
|
|
20
|
-
* to mark which column renders the chevron + indent connectors. When
|
|
21
|
-
* no column is flagged, the first column is treated as the hierarchy
|
|
22
|
-
* column by default.
|
|
23
|
-
*/
|
|
24
|
-
export interface TreeTableColumn extends TableColumn {
|
|
25
|
-
/** Render chevron + tree connectors in this column. Defaults to the first column. */
|
|
26
|
-
hierarchy?: boolean
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
// =============================================================================
|
|
30
|
-
// Snippets
|
|
31
|
-
// =============================================================================
|
|
32
|
-
|
|
33
|
-
export type TreeTableHeaderSnippet = Snippet<[TreeTableColumn[], SortState[]]>
|
|
34
|
-
export type TreeTableRowSnippet = Snippet<
|
|
35
|
-
[Record<string, unknown>, TreeTableColumn[], number, boolean]
|
|
36
|
-
>
|
|
37
|
-
export type TreeTableCellSnippet = Snippet<
|
|
38
|
-
[unknown, TreeTableColumn, Record<string, unknown>]
|
|
39
|
-
>
|
|
40
|
-
export type TreeTableEmptySnippet = Snippet<[]>
|
|
41
|
-
|
|
42
|
-
// =============================================================================
|
|
43
|
-
// Component Props
|
|
44
|
-
// =============================================================================
|
|
45
|
-
|
|
46
|
-
export interface TreeTableProps {
|
|
47
|
-
/** Nested row data — each row may carry a `children: []` array. */
|
|
48
|
-
data?: Record<string, unknown>[]
|
|
49
|
-
|
|
50
|
-
/** Column definitions (auto-derived from the first row if not provided). */
|
|
51
|
-
columns?: TreeTableColumn[]
|
|
52
|
-
|
|
53
|
-
/** Currently selected row value (single-select) */
|
|
54
|
-
value?: unknown
|
|
55
|
-
|
|
56
|
-
/** Currently selected row values (multi-select, bindable) */
|
|
57
|
-
values?: unknown[]
|
|
58
|
-
|
|
59
|
-
/** Selection mode: 'single' (default), 'multi', or false (no selection) */
|
|
60
|
-
selectable?: 'single' | 'multi' | false
|
|
61
|
-
|
|
62
|
-
/** Table caption for accessibility */
|
|
63
|
-
caption?: string
|
|
64
|
-
|
|
65
|
-
/** Size variant */
|
|
66
|
-
size?: 'sm' | 'md' | 'lg'
|
|
67
|
-
|
|
68
|
-
/** Enable alternating row colors */
|
|
69
|
-
striped?: boolean
|
|
70
|
-
|
|
71
|
-
/** Whether the entire table is disabled */
|
|
72
|
-
disabled?: boolean
|
|
73
|
-
|
|
74
|
-
/** Tree connector line style — same options as the Tree component */
|
|
75
|
-
lineStyle?: 'none' | 'solid' | 'dashed' | 'dotted'
|
|
76
|
-
|
|
77
|
-
/** Row-level field mapping (incl. the `children` field name). */
|
|
78
|
-
fields?: TableFields & { children?: string }
|
|
79
|
-
|
|
80
|
-
/** Called when a row is selected */
|
|
81
|
-
onselect?: (value: unknown, row: Record<string, unknown>) => void
|
|
82
|
-
|
|
83
|
-
/** Called when sort state changes */
|
|
84
|
-
onsort?: (sortState: SortState[]) => void
|
|
85
|
-
|
|
86
|
-
/** Additional CSS classes */
|
|
87
|
-
class?: string
|
|
88
|
-
|
|
89
|
-
/** Sort indicator icons */
|
|
90
|
-
icons?: TableSortIcons & { opened?: string; closed?: string }
|
|
91
|
-
|
|
92
|
-
/** Custom header snippet */
|
|
93
|
-
header?: TreeTableHeaderSnippet
|
|
94
|
-
|
|
95
|
-
/** Custom row snippet */
|
|
96
|
-
row?: TreeTableRowSnippet
|
|
97
|
-
|
|
98
|
-
/** Custom cell snippet */
|
|
99
|
-
cell?: TreeTableCellSnippet
|
|
100
|
-
|
|
101
|
-
/** Empty state snippet */
|
|
102
|
-
empty?: TreeTableEmptySnippet
|
|
103
|
-
}
|
package/src/types/tree.ts
DELETED
|
@@ -1,302 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Tree Component Types
|
|
3
|
-
*
|
|
4
|
-
* Provides types for the data-driven Tree component.
|
|
5
|
-
* Supports hierarchical data with expand/collapse, tree lines, and custom icons.
|
|
6
|
-
* Field mapping and data access is handled by ProxyItem from @rokkit/states.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
import type { Snippet } from 'svelte'
|
|
10
|
-
import { DEFAULT_STATE_ICONS } from '@rokkit/core'
|
|
11
|
-
|
|
12
|
-
// =============================================================================
|
|
13
|
-
// Field Mapping Types
|
|
14
|
-
// =============================================================================
|
|
15
|
-
|
|
16
|
-
/**
|
|
17
|
-
* Field mapping configuration for tree data — what the consumer passes
|
|
18
|
-
* to the Tree component. Both `expanded` and `level` are optional here
|
|
19
|
-
* because Tree falls back to `defaultTreeFields` for any field the
|
|
20
|
-
* consumer omits.
|
|
21
|
-
*
|
|
22
|
-
* Inside Tree the fields are merged with `defaultTreeFields` to produce
|
|
23
|
-
* a `ResolvedTreeFields` value where every key is guaranteed present.
|
|
24
|
-
* Downstream code that needs string field names without null-guards
|
|
25
|
-
* should use `ResolvedTreeFields` rather than `TreeFields`.
|
|
26
|
-
*/
|
|
27
|
-
export interface TreeFields {
|
|
28
|
-
// Index signature must allow `undefined` so the optional keys below
|
|
29
|
-
// (typed as `string | undefined`) are assignable. Extending
|
|
30
|
-
// `Record<string, string>` here would conflict with the optionals
|
|
31
|
-
// and produce TS2411 in any strict downstream consumer.
|
|
32
|
-
[field: string]: string | undefined
|
|
33
|
-
|
|
34
|
-
/**
|
|
35
|
-
* Name of the field on each tree item that holds its expanded state.
|
|
36
|
-
* The value at that field is expected to be a `boolean`.
|
|
37
|
-
*
|
|
38
|
-
* Optional — falls back to the default field name `'expanded'`. After
|
|
39
|
-
* `resolveTreeFields` is applied the resolved key is guaranteed present
|
|
40
|
-
* (see {@link ResolvedTreeFields}).
|
|
41
|
-
*/
|
|
42
|
-
expanded?: string
|
|
43
|
-
|
|
44
|
-
/**
|
|
45
|
-
* Name of the field on each tree item that holds its depth in the tree.
|
|
46
|
-
* The value at that field is expected to be a `number`.
|
|
47
|
-
*
|
|
48
|
-
* Optional — falls back to the default field name `'level'`. After
|
|
49
|
-
* `resolveTreeFields` is applied the resolved key is guaranteed present
|
|
50
|
-
* (see {@link ResolvedTreeFields}).
|
|
51
|
-
*/
|
|
52
|
-
level?: string
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
/**
|
|
56
|
-
* Tree fields after defaults have been applied — every field name is a
|
|
57
|
-
* non-null string. Use this type for any function or store that needs
|
|
58
|
-
* to read a field name without re-applying defaults.
|
|
59
|
-
*
|
|
60
|
-
* Construct from a `TreeFields` via `resolveTreeFields(fields)` (or by
|
|
61
|
-
* spreading `defaultTreeFields` first, e.g.
|
|
62
|
-
* `{ ...defaultTreeFields, ...userFields }`).
|
|
63
|
-
*/
|
|
64
|
-
export type ResolvedTreeFields = Required<TreeFields>
|
|
65
|
-
|
|
66
|
-
/**
|
|
67
|
-
* Default field mapping values for tree
|
|
68
|
-
*/
|
|
69
|
-
export const defaultTreeFields: Required<Omit<TreeFields, 'fields'>> = {
|
|
70
|
-
text: 'text',
|
|
71
|
-
value: 'value',
|
|
72
|
-
icon: 'icon',
|
|
73
|
-
description: 'description',
|
|
74
|
-
shortcut: 'shortcut',
|
|
75
|
-
label: 'label',
|
|
76
|
-
disabled: 'disabled',
|
|
77
|
-
active: 'active',
|
|
78
|
-
type: 'type',
|
|
79
|
-
children: 'children',
|
|
80
|
-
snippet: 'snippet',
|
|
81
|
-
href: 'href',
|
|
82
|
-
badge: 'badge',
|
|
83
|
-
expanded: 'expanded',
|
|
84
|
-
level: 'level'
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
/**
|
|
88
|
-
* Merge consumer-provided field overrides with the default field
|
|
89
|
-
* mapping so every key resolves to a string. Tree calls this once on
|
|
90
|
-
* its `fields` prop before passing the result to ProxyTree / line
|
|
91
|
-
* builders.
|
|
92
|
-
*/
|
|
93
|
-
export function resolveTreeFields(fields: TreeFields = {}): ResolvedTreeFields {
|
|
94
|
-
// `Required<TreeFields>` cannot strip `undefined` from the index
|
|
95
|
-
// signature on its own, so spread-inference fails the contract even
|
|
96
|
-
// though `defaultTreeFields` provides every key. Cast through unknown
|
|
97
|
-
// to assert the post-merge shape.
|
|
98
|
-
return { ...defaultTreeFields, ...fields } as unknown as ResolvedTreeFields
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
// =============================================================================
|
|
102
|
-
// Tree Item Types
|
|
103
|
-
// =============================================================================
|
|
104
|
-
|
|
105
|
-
/**
|
|
106
|
-
* Generic tree item - can be any object with mapped fields
|
|
107
|
-
*/
|
|
108
|
-
export type TreeItem = Record<string, unknown>
|
|
109
|
-
|
|
110
|
-
// =============================================================================
|
|
111
|
-
// Tree Line/Connector Types
|
|
112
|
-
// =============================================================================
|
|
113
|
-
|
|
114
|
-
/**
|
|
115
|
-
* Types of tree line connectors
|
|
116
|
-
*/
|
|
117
|
-
export type TreeLineType = 'child' | 'last' | 'sibling' | 'empty' | 'icon'
|
|
118
|
-
|
|
119
|
-
/**
|
|
120
|
-
* Connector types (without 'icon' which is handled separately)
|
|
121
|
-
*/
|
|
122
|
-
export type ConnectorType = 'child' | 'last' | 'sibling' | 'empty'
|
|
123
|
-
|
|
124
|
-
/**
|
|
125
|
-
* Icons configuration for tree expand/collapse states.
|
|
126
|
-
* Keys match the naming convention in @rokkit/core DEFAULT_STATE_ICONS.
|
|
127
|
-
*/
|
|
128
|
-
export interface TreeStateIcons {
|
|
129
|
-
/** Icon class for expanded/opened state */
|
|
130
|
-
opened?: string
|
|
131
|
-
/** Icon class for collapsed/closed state */
|
|
132
|
-
closed?: string
|
|
133
|
-
}
|
|
134
|
-
|
|
135
|
-
/**
|
|
136
|
-
* Default state icons — uses semantic names from @rokkit/core
|
|
137
|
-
* that get resolved to actual icon classes via UnoCSS shortcuts.
|
|
138
|
-
*/
|
|
139
|
-
export const defaultTreeStateIcons: TreeStateIcons = {
|
|
140
|
-
opened: DEFAULT_STATE_ICONS.node.opened,
|
|
141
|
-
closed: DEFAULT_STATE_ICONS.node.closed
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
// =============================================================================
|
|
145
|
-
// Snippet Types
|
|
146
|
-
// =============================================================================
|
|
147
|
-
|
|
148
|
-
/**
|
|
149
|
-
* Handlers passed to custom item snippets
|
|
150
|
-
*/
|
|
151
|
-
export interface TreeItemHandlers {
|
|
152
|
-
/** Call to trigger item selection */
|
|
153
|
-
onclick: () => void
|
|
154
|
-
/** Call to toggle expand/collapse */
|
|
155
|
-
ontoggle: () => void
|
|
156
|
-
/** Forward keyboard events for accessibility */
|
|
157
|
-
onkeydown: (event: KeyboardEvent) => void
|
|
158
|
-
}
|
|
159
|
-
|
|
160
|
-
/**
|
|
161
|
-
* Snippet type for rendering tree nodes.
|
|
162
|
-
* Parameters: item, fields, handlers, isActive, isExpanded, level
|
|
163
|
-
*/
|
|
164
|
-
export type TreeItemSnippet = Snippet<
|
|
165
|
-
[TreeItem, TreeFields, TreeItemHandlers, boolean, boolean, number]
|
|
166
|
-
>
|
|
167
|
-
|
|
168
|
-
/**
|
|
169
|
-
* Snippet type for rendering the expand/collapse icon
|
|
170
|
-
* Parameters: isExpanded, hasChildren, icons
|
|
171
|
-
*/
|
|
172
|
-
export type TreeToggleSnippet = Snippet<[boolean, boolean, TreeStateIcons]>
|
|
173
|
-
|
|
174
|
-
/**
|
|
175
|
-
* Snippet type for rendering tree line connectors
|
|
176
|
-
* Parameters: lineType
|
|
177
|
-
*/
|
|
178
|
-
export type TreeConnectorSnippet = Snippet<[TreeLineType]>
|
|
179
|
-
|
|
180
|
-
// =============================================================================
|
|
181
|
-
// Component Props Types
|
|
182
|
-
// =============================================================================
|
|
183
|
-
|
|
184
|
-
/**
|
|
185
|
-
* Props for the Tree component
|
|
186
|
-
*/
|
|
187
|
-
export interface TreeProps {
|
|
188
|
-
/** Array of tree items (hierarchical) */
|
|
189
|
-
items?: TreeItem[]
|
|
190
|
-
|
|
191
|
-
/** Field mapping configuration */
|
|
192
|
-
fields?: TreeFields
|
|
193
|
-
|
|
194
|
-
/** Currently selected value */
|
|
195
|
-
value?: unknown
|
|
196
|
-
|
|
197
|
-
/** Size variant */
|
|
198
|
-
size?: 'sm' | 'md' | 'lg'
|
|
199
|
-
|
|
200
|
-
/** Tree line connector style — 'none' hides lines, 'solid'|'dashed'|'dotted' set the line style */
|
|
201
|
-
lineStyle?: 'none' | 'solid' | 'dashed' | 'dotted'
|
|
202
|
-
|
|
203
|
-
/** Enable multiple item selection (Ctrl+click toggle, Shift+click range) */
|
|
204
|
-
multiselect?: boolean
|
|
205
|
-
|
|
206
|
-
/** Which nodes are expanded (bindable) - keyed by node value */
|
|
207
|
-
expanded?: Record<string, boolean>
|
|
208
|
-
|
|
209
|
-
/** Selected items array (bindable) - populated in multiselect mode */
|
|
210
|
-
selected?: unknown[]
|
|
211
|
-
|
|
212
|
-
/** Expand all nodes by default */
|
|
213
|
-
expandAll?: boolean
|
|
214
|
-
|
|
215
|
-
/** Active item value - Tree looks up item by this value to highlight it */
|
|
216
|
-
active?: unknown
|
|
217
|
-
|
|
218
|
-
/** Icons for expand/collapse states */
|
|
219
|
-
icons?: TreeStateIcons
|
|
220
|
-
|
|
221
|
-
/** Called when an item is selected */
|
|
222
|
-
onselect?: (value: unknown, item: TreeItem) => void
|
|
223
|
-
|
|
224
|
-
/** Called when selected items change in multiselect mode */
|
|
225
|
-
onselectedchange?: (selected: unknown[]) => void
|
|
226
|
-
|
|
227
|
-
/** Called when expanded state changes */
|
|
228
|
-
onexpandedchange?: (expanded: Record<string, boolean>) => void
|
|
229
|
-
|
|
230
|
-
/** Called when a node is toggled */
|
|
231
|
-
ontoggle?: (value: unknown, item: TreeItem, isExpanded: boolean) => void
|
|
232
|
-
|
|
233
|
-
/** Called when expanding a node with unloaded children (children: true). Returns the children array. */
|
|
234
|
-
onloadchildren?: (value: unknown, item: TreeItem) => Promise<TreeItem[]>
|
|
235
|
-
|
|
236
|
-
/** Additional CSS classes */
|
|
237
|
-
class?: string
|
|
238
|
-
|
|
239
|
-
/** Custom snippet for rendering tree items */
|
|
240
|
-
item?: TreeItemSnippet
|
|
241
|
-
|
|
242
|
-
/** Custom snippet for rendering expand/collapse toggle */
|
|
243
|
-
toggle?: TreeToggleSnippet
|
|
244
|
-
|
|
245
|
-
/** Custom snippet for rendering tree line connectors */
|
|
246
|
-
connector?: TreeConnectorSnippet
|
|
247
|
-
}
|
|
248
|
-
|
|
249
|
-
// =============================================================================
|
|
250
|
-
// Helper Functions
|
|
251
|
-
// =============================================================================
|
|
252
|
-
|
|
253
|
-
/**
|
|
254
|
-
* Mapping for calculating next line type based on parent type
|
|
255
|
-
* Based on @rokkit/core connector implementation
|
|
256
|
-
*/
|
|
257
|
-
const nextLineType: Record<TreeLineType, TreeLineType> = {
|
|
258
|
-
child: 'sibling',
|
|
259
|
-
last: 'empty',
|
|
260
|
-
sibling: 'sibling',
|
|
261
|
-
empty: 'empty',
|
|
262
|
-
icon: 'empty'
|
|
263
|
-
}
|
|
264
|
-
|
|
265
|
-
/**
|
|
266
|
-
* Constructs an array of line types for tree visualization.
|
|
267
|
-
* This determines what connectors to show at each depth level.
|
|
268
|
-
*
|
|
269
|
-
* Algorithm from @rokkit/core getLineTypes:
|
|
270
|
-
* - For all but the last parent type, convert to continuation type
|
|
271
|
-
* - For the last parent type, use the current node's position
|
|
272
|
-
* - Append 'icon' for nodes with children, 'empty' for leaf nodes
|
|
273
|
-
*
|
|
274
|
-
* @param hasChildren - Whether the node has children
|
|
275
|
-
* @param parentTypes - Line types from parent nodes
|
|
276
|
-
* @param position - Current position type ('child' or 'last')
|
|
277
|
-
* @returns Array of line types for rendering connectors
|
|
278
|
-
*/
|
|
279
|
-
export function getLineTypes(
|
|
280
|
-
hasChildren: boolean = false,
|
|
281
|
-
parentTypes: TreeLineType[] = [],
|
|
282
|
-
position: 'child' | 'last' = 'child'
|
|
283
|
-
): TreeLineType[] {
|
|
284
|
-
const result = parentTypes.reduce<TreeLineType[]>((acc, type, index) => {
|
|
285
|
-
// For all but the last parent type, convert to next type
|
|
286
|
-
// 'child' -> 'sibling' (vertical line continues)
|
|
287
|
-
// 'last' -> 'empty' (no line, branch ended)
|
|
288
|
-
if (index < parentTypes.length - 1) {
|
|
289
|
-
return [...acc, nextLineType[type]]
|
|
290
|
-
}
|
|
291
|
-
// For the last parent type, use the current node's position
|
|
292
|
-
return [...acc, position]
|
|
293
|
-
}, [])
|
|
294
|
-
|
|
295
|
-
// Append icon slot for expandable nodes, empty for leaf nodes
|
|
296
|
-
return result.concat(hasChildren ? 'icon' : 'empty')
|
|
297
|
-
}
|
|
298
|
-
|
|
299
|
-
// Keep old name as alias for backward compatibility
|
|
300
|
-
export const getTreeLineTypes = getLineTypes
|
|
301
|
-
|
|
302
|
-
export { getSnippet } from './menu.js'
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* UploadFileStatus Component Types
|
|
3
|
-
*
|
|
4
|
-
* Renders a single file's upload status with progress bar, action buttons
|
|
5
|
-
* (cancel/retry/remove), and file metadata (icon, name, size, status label).
|
|
6
|
-
* Action button visibility driven by cancelWhen/retryWhen/removeWhen arrays.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
import type { ProxyItem } from '@rokkit/states'
|
|
10
|
-
|
|
11
|
-
// =============================================================================
|
|
12
|
-
// Component Props
|
|
13
|
-
// =============================================================================
|
|
14
|
-
|
|
15
|
-
/**
|
|
16
|
-
* Props for the UploadFileStatus component
|
|
17
|
-
*/
|
|
18
|
-
export interface UploadFileStatusProps {
|
|
19
|
-
/** ProxyItem wrapping the file data */
|
|
20
|
-
proxy: ProxyItem
|
|
21
|
-
|
|
22
|
-
/** Status values that show the cancel button */
|
|
23
|
-
cancelWhen?: string[]
|
|
24
|
-
|
|
25
|
-
/** Status values that show the retry button */
|
|
26
|
-
retryWhen?: string[]
|
|
27
|
-
|
|
28
|
-
/** Status values that show the remove button */
|
|
29
|
-
removeWhen?: string[]
|
|
30
|
-
|
|
31
|
-
/** Called when cancel is clicked */
|
|
32
|
-
oncancel?: (proxy: ProxyItem) => void
|
|
33
|
-
|
|
34
|
-
/** Called when retry is clicked */
|
|
35
|
-
onretry?: (proxy: ProxyItem) => void
|
|
36
|
-
|
|
37
|
-
/** Called when remove is clicked */
|
|
38
|
-
onremove?: (proxy: ProxyItem) => void
|
|
39
|
-
|
|
40
|
-
/** Label overrides merged with messages.uploadProgress */
|
|
41
|
-
labels?: Record<string, string>
|
|
42
|
-
|
|
43
|
-
/** Icon class overrides for action buttons (cancel, retry, remove) */
|
|
44
|
-
icons?: Record<string, string>
|
|
45
|
-
}
|
|
@@ -1,111 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* UploadProgress Component Types
|
|
3
|
-
*
|
|
4
|
-
* File upload status orchestrator. Thin composition layer that renders
|
|
5
|
-
* a header + List or Grid layout. Default itemContent snippet renders
|
|
6
|
-
* UploadFileStatus for each file. Consumer can override with custom snippet.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
import type { Snippet } from 'svelte'
|
|
10
|
-
import type { ProxyItem } from '@rokkit/states'
|
|
11
|
-
|
|
12
|
-
// =============================================================================
|
|
13
|
-
// Item Types
|
|
14
|
-
// =============================================================================
|
|
15
|
-
|
|
16
|
-
/**
|
|
17
|
-
* Generic upload file item — any object with mapped fields
|
|
18
|
-
*/
|
|
19
|
-
export type UploadItem = Record<string, unknown>
|
|
20
|
-
|
|
21
|
-
// =============================================================================
|
|
22
|
-
// Field Mapping Types
|
|
23
|
-
// =============================================================================
|
|
24
|
-
|
|
25
|
-
/**
|
|
26
|
-
* Field mapping for upload file data.
|
|
27
|
-
* Maps semantic field names to keys in the data objects.
|
|
28
|
-
*/
|
|
29
|
-
export interface UploadFields {
|
|
30
|
-
/** Field for display text - default: 'text' */
|
|
31
|
-
label?: string
|
|
32
|
-
|
|
33
|
-
/** Field for unique value - default: 'value' */
|
|
34
|
-
value?: string
|
|
35
|
-
|
|
36
|
-
/** Field for icon class - default: 'icon' */
|
|
37
|
-
icon?: string
|
|
38
|
-
|
|
39
|
-
/** Field for upload status key - default: 'status' */
|
|
40
|
-
status?: string
|
|
41
|
-
|
|
42
|
-
/** Field for progress percentage (0-100) - default: 'progress' */
|
|
43
|
-
progress?: string
|
|
44
|
-
|
|
45
|
-
/** Field for file size in bytes - default: 'size' */
|
|
46
|
-
size?: string
|
|
47
|
-
|
|
48
|
-
/** Field for MIME type - default: 'type' */
|
|
49
|
-
type?: string
|
|
50
|
-
|
|
51
|
-
/** Field for error message - default: 'error' */
|
|
52
|
-
error?: string
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
// =============================================================================
|
|
56
|
-
// Snippet Types
|
|
57
|
-
// =============================================================================
|
|
58
|
-
|
|
59
|
-
/**
|
|
60
|
-
* Snippet for custom per-file rendering inside List/Grid.
|
|
61
|
-
* Receives the ProxyItem wrapping the file data.
|
|
62
|
-
*/
|
|
63
|
-
export type UploadItemSnippet = Snippet<[proxy: ProxyItem]>
|
|
64
|
-
|
|
65
|
-
// =============================================================================
|
|
66
|
-
// Component Props
|
|
67
|
-
// =============================================================================
|
|
68
|
-
|
|
69
|
-
/**
|
|
70
|
-
* Props for the UploadProgress component
|
|
71
|
-
*/
|
|
72
|
-
export interface UploadProgressProps {
|
|
73
|
-
/** Array of file data objects */
|
|
74
|
-
files?: UploadItem[]
|
|
75
|
-
|
|
76
|
-
/** Field mapping configuration */
|
|
77
|
-
fields?: UploadFields
|
|
78
|
-
|
|
79
|
-
/** Layout mode */
|
|
80
|
-
view?: 'list' | 'grid'
|
|
81
|
-
|
|
82
|
-
/** Status values that show the cancel button */
|
|
83
|
-
cancelWhen?: string[]
|
|
84
|
-
|
|
85
|
-
/** Status values that show the retry button */
|
|
86
|
-
retryWhen?: string[]
|
|
87
|
-
|
|
88
|
-
/** Status values that show the remove button */
|
|
89
|
-
removeWhen?: string[]
|
|
90
|
-
|
|
91
|
-
/** Called when cancel is clicked (receives raw file object) */
|
|
92
|
-
oncancel?: (file: UploadItem) => void
|
|
93
|
-
|
|
94
|
-
/** Called when retry is clicked (receives raw file object) */
|
|
95
|
-
onretry?: (file: UploadItem) => void
|
|
96
|
-
|
|
97
|
-
/** Called when remove is clicked (receives raw file object) */
|
|
98
|
-
onremove?: (file: UploadItem) => void
|
|
99
|
-
|
|
100
|
-
/** Called when clear all is clicked */
|
|
101
|
-
onclear?: () => void
|
|
102
|
-
|
|
103
|
-
/** Label overrides merged with messages.uploadProgress */
|
|
104
|
-
labels?: Record<string, string>
|
|
105
|
-
|
|
106
|
-
/** Additional CSS classes */
|
|
107
|
-
class?: string
|
|
108
|
-
|
|
109
|
-
/** Custom snippet for per-file rendering (overrides default UploadFileStatus) */
|
|
110
|
-
itemContent?: UploadItemSnippet
|
|
111
|
-
}
|
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* UploadTarget Component Types
|
|
3
|
-
*
|
|
4
|
-
* Drop zone with file validation. Accepts drag-and-drop or click-to-browse.
|
|
5
|
-
* Validates files against accept (MIME/extension) and maxSize constraints.
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
import type { Snippet } from 'svelte'
|
|
9
|
-
|
|
10
|
-
// =============================================================================
|
|
11
|
-
// Item Types
|
|
12
|
-
// =============================================================================
|
|
13
|
-
|
|
14
|
-
/**
|
|
15
|
-
* File validation error returned via onerror callback
|
|
16
|
-
*/
|
|
17
|
-
export interface UploadError {
|
|
18
|
-
/** The file that failed validation */
|
|
19
|
-
file: File
|
|
20
|
-
/** Why the file was rejected */
|
|
21
|
-
reason: 'type' | 'size'
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
// =============================================================================
|
|
25
|
-
// Snippet Types
|
|
26
|
-
// =============================================================================
|
|
27
|
-
|
|
28
|
-
/**
|
|
29
|
-
* Snippet for custom drop zone content.
|
|
30
|
-
* Receives the current dragging state.
|
|
31
|
-
*/
|
|
32
|
-
export type UploadTargetContentSnippet = Snippet<[dragging: boolean]>
|
|
33
|
-
|
|
34
|
-
// =============================================================================
|
|
35
|
-
// Component Props
|
|
36
|
-
// =============================================================================
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* Props for the UploadTarget component
|
|
40
|
-
*/
|
|
41
|
-
export interface UploadTargetProps {
|
|
42
|
-
/** Accepted file types (MIME types or extensions, comma-separated) */
|
|
43
|
-
accept?: string
|
|
44
|
-
|
|
45
|
-
/** Maximum file size in bytes */
|
|
46
|
-
maxSize?: number
|
|
47
|
-
|
|
48
|
-
/** Allow multiple file selection */
|
|
49
|
-
multiple?: boolean
|
|
50
|
-
|
|
51
|
-
/** Disable the drop zone */
|
|
52
|
-
disabled?: boolean
|
|
53
|
-
|
|
54
|
-
/** Label overrides merged with messages.uploadTarget */
|
|
55
|
-
labels?: Record<string, string>
|
|
56
|
-
|
|
57
|
-
/** Called with validated files after drop or browse */
|
|
58
|
-
onfiles?: (files: File[]) => void
|
|
59
|
-
|
|
60
|
-
/** Called for each file that fails validation */
|
|
61
|
-
onerror?: (err: UploadError) => void
|
|
62
|
-
|
|
63
|
-
/** Size variant — full (default) fills available area; small shows only border + icon */
|
|
64
|
-
size?: 'full' | 'small'
|
|
65
|
-
|
|
66
|
-
/** Additional CSS classes */
|
|
67
|
-
class?: string
|
|
68
|
-
|
|
69
|
-
/** Custom content snippet (replaces default drop zone UI) */
|
|
70
|
-
content?: UploadTargetContentSnippet
|
|
71
|
-
}
|