@synopackageland/ui 0.5.5 → 0.5.7
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 +120 -0
- package/dist/UiDefectsDemo.vue.d.ts +3 -0
- package/dist/components/advanced-panel/AdvancePanelGrid.vue.d.ts +1 -0
- package/dist/components/app/app-sidebar/AppSidebar.vue.d.ts +2 -1
- package/dist/components/app/section-tabs/SectionTabs.vue.d.ts +1 -0
- package/dist/components/composite/about-dialog/AboutDialog.vue.d.ts +13 -12
- package/dist/components/composite/callout/Callout.vue.d.ts +0 -1
- package/dist/components/composite/config-provider/ConfigProvider.vue.d.ts +2 -0
- package/dist/components/composite/copy-cut-field/CopyCutField.vue.d.ts +0 -2
- package/dist/components/composite/data-grid/labels.d.ts +2 -0
- package/dist/components/composite/data-table/DataTable.vue.d.ts +1 -2
- package/dist/components/composite/file-picker/FilePicker.vue.d.ts +8 -4
- package/dist/components/composite/form/FormItem.vue.d.ts +5 -3
- package/dist/components/composite/form/context.d.ts +7 -1
- package/dist/components/composite/form/rules.d.ts +3 -0
- package/dist/components/composite/form/types.d.ts +1 -1
- package/dist/components/composite/key-value-row/KeyValueRow.vue.d.ts +20 -0
- package/dist/components/composite/message-box/MessageBox.vue.d.ts +0 -5
- package/dist/components/composite/message-box/controller.d.ts +2 -1
- package/dist/components/composite/overflow-toolbar/OverflowToolbar.vue.d.ts +0 -4
- package/dist/components/composite/repeat-rows/RepeatRow.vue.d.ts +2 -1
- package/dist/components/composite/search-field/SearchField.vue.d.ts +2 -2
- package/dist/components/composite/tree-view/TreeView.vue.d.ts +0 -1
- package/dist/components/composite/wizard/Wizard.vue.d.ts +2 -6
- package/dist/components/composite/wizard/types.d.ts +1 -0
- package/dist/components/containers/panel/Panel.vue.d.ts +0 -2
- package/dist/components/feedback/info-mask/InfoMask.vue.d.ts +1 -1
- package/dist/components/feedback/info-tip/InfoTip.vue.d.ts +0 -1
- package/dist/components/feedback/notification/Notification.vue.d.ts +0 -1
- package/dist/components/feedback/notification/NotificationProvider.vue.d.ts +0 -2
- package/dist/components/primitives/breadcrumb/Breadcrumb.vue.d.ts +0 -1
- package/dist/components/primitives/color-picker/ColorPicker.vue.d.ts +6 -2
- package/dist/components/primitives/combobox/Combobox.vue.d.ts +2 -2
- package/dist/components/primitives/date-picker/DatePicker.vue.d.ts +14 -4
- package/dist/components/primitives/dialog/Dialog.vue.d.ts +0 -1
- package/dist/components/primitives/input-steppers/InputSteppers.vue.d.ts +5 -13
- package/dist/components/primitives/link/Link.vue.d.ts +30 -0
- package/dist/components/primitives/loading/LoadingIndicator.vue.d.ts +0 -1
- package/dist/components/primitives/multiple-select/MultipleSelect.vue.d.ts +2 -2
- package/dist/components/primitives/pagination/Pagination.vue.d.ts +3 -3
- package/dist/components/primitives/pagination/labels.d.ts +1 -0
- package/dist/components/primitives/schedule-table/ScheduleTable.vue.d.ts +9 -0
- package/dist/components/primitives/segment-control/SegmentControl.vue.d.ts +2 -2
- package/dist/components/primitives/select/Select.vue.d.ts +0 -4
- package/dist/components/primitives/select/internal/ComboboxField.vue.d.ts +2 -7
- package/dist/components/primitives/select/internal/types.d.ts +1 -0
- package/dist/components/primitives/sheet/Sheet.vue.d.ts +0 -1
- package/dist/components/primitives/slider/Slider.vue.d.ts +0 -1
- package/dist/components/primitives/spinner/Spinner.vue.d.ts +0 -1
- package/dist/components/primitives/split-button/SplitButton.vue.d.ts +0 -1
- package/dist/components/primitives/superbox-select/SuperboxSelect.vue.d.ts +2 -2
- package/dist/components/primitives/tag/Tag.vue.d.ts +0 -1
- package/dist/components/primitives/toast/ToastProvider.vue.d.ts +4 -0
- package/dist/components/primitives/toggle-button/ToggleButton.vue.d.ts +2 -2
- package/dist/components/primitives/toggle-button/ToggleButtonGroup.vue.d.ts +2 -2
- package/dist/components/primitives/typography/TypoHeader.vue.d.ts +1 -0
- package/dist/components/primitives/typography/typography.d.ts +1 -1
- package/dist/composables/elementWidth.d.ts +4 -0
- package/dist/composables/formControl.d.ts +21 -0
- package/dist/i18n/filePicker.d.ts +15 -0
- package/dist/i18n/locale.d.ts +6 -0
- package/dist/i18n/text.d.ts +140 -0
- package/dist/index.d.ts +5 -0
- package/dist/index.js +13672 -12041
- package/dist/reka-runtime.json +1 -1
- package/dist/theme.css +1 -1
- package/dist/themes/dsm7-embedded-theme.css +1 -1
- package/dist/themes/dsm7-embedded.css +1 -1
- package/dist/themes/dsm7.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -465,3 +465,123 @@ The public npm package is `@synopackageland/ui`. Both release targets are built
|
|
|
465
465
|
from the same source and share runtime files, exports, MIT license and notices.
|
|
466
466
|
Public repository and issue tracker links will be added once those are selected.
|
|
467
467
|
See the [documentation](https://www.varvis.me/docs/) for usage.
|
|
468
|
+
|
|
469
|
+
|
|
470
|
+
## Form controls and compact settings (0.5.7)
|
|
471
|
+
|
|
472
|
+
`Form` and standalone `FormItem` default to `direction="auto"`. They use the
|
|
473
|
+
container's width, including a DSM package window, and stack labels below 520px.
|
|
474
|
+
Set `direction="horizontal"` to keep the previous layout or `direction="vertical"`
|
|
475
|
+
to stack at every width. An item can override its form. Inherited auto is resolved
|
|
476
|
+
against each FormItem's own width, so items inside 96px FieldCells stack even in a
|
|
477
|
+
wide Form. Remove a FieldCell item's explicit vertical workaround to restore auto.
|
|
478
|
+
SettingsRow likewise stacks below 520px of its own width. Controls bind their
|
|
479
|
+
FormItem id and ARIA state automatically; remove Select `role="group"` workarounds
|
|
480
|
+
and manual `field.controlId` bindings unless an application deliberately chooses
|
|
481
|
+
an explicit id. Explicit descriptions are merged with the field's help/error ids.
|
|
482
|
+
|
|
483
|
+
Use one FormItem for each primary control. For rows containing multiple fields,
|
|
484
|
+
put each labelled field in its own FormItem inside a FieldCell; use `text-only`
|
|
485
|
+
on an outer item that is only a layout heading. Multiple siblings do not reuse
|
|
486
|
+
the primary id. Native/custom controls can still use the `field.controlProps`
|
|
487
|
+
slot or `useFormField()` contract. If mounting independent Vue apps in the same
|
|
488
|
+
document, set a distinct `app.config.idPrefix` for each app.
|
|
489
|
+
|
|
490
|
+
```vue
|
|
491
|
+
<ConfigProvider :locale="locale">
|
|
492
|
+
<Form>
|
|
493
|
+
<FormItem label="Protocol" description="Transport protocol">
|
|
494
|
+
<Select v-model="protocol" :options="protocols" />
|
|
495
|
+
</FormItem>
|
|
496
|
+
<FormItem label="Upload" field-width="full">
|
|
497
|
+
<FilePicker v-model="files" variant="compact" :max-size="524288" />
|
|
498
|
+
</FormItem>
|
|
499
|
+
</Form>
|
|
500
|
+
<KeyValueRow label="Version" value="0.5.7" />
|
|
501
|
+
<KeyValueRow label="Download">
|
|
502
|
+
<Link :href="downloadUrl" download="notes.txt">{{ t('download') }}</Link>
|
|
503
|
+
</KeyValueRow>
|
|
504
|
+
<Link href="https://example.com/docs" external>{{ t('docs') }}</Link>
|
|
505
|
+
</ConfigProvider>
|
|
506
|
+
```
|
|
507
|
+
|
|
508
|
+
FilePicker retains browser `File[]` semantics. Built-in `locale` values are
|
|
509
|
+
`en`, `zh-TW`, `zh-CN`, `ja`, `ko`, `de`, `fr`, `es`, `it`; an explicit picker
|
|
510
|
+
locale overrides ConfigProvider. Its `text` accepts partial overrides of
|
|
511
|
+
`title`, `description`, `chooseFiles`, `chooseFolder`, `maxSize`, `maxFiles`,
|
|
512
|
+
`remove`, `typeRejected`, `sizeRejected`, `countRejected`, `duplicateRejected`.
|
|
513
|
+
The messages use `{name}`, `{size}` and `{count}` placeholders. Existing
|
|
514
|
+
`title`/`description` props still win. Other controls retain their exposed text
|
|
515
|
+
props and partial text objects; built-in text throughout the library now follows
|
|
516
|
+
Provider locale. Explicit strings, including `''`, win over built-in translations.
|
|
517
|
+
DatePicker's calendar inherits Provider locale unless its own Intl `locale` is
|
|
518
|
+
supplied. Caller-owned option labels, content, URLs, rules' custom messages and
|
|
519
|
+
business terminology stay caller-owned. Validation fallbacks use the locale at
|
|
520
|
+
validation time; imperative message-box default titles use the locale at opening.
|
|
521
|
+
See [the complete default-text and container audit](docs/component-defaults-0.5.7.md).
|
|
522
|
+
|
|
523
|
+
`KeyValueRow` renders a `dl` with `dt`/`dd`; its default slot accepts rich values,
|
|
524
|
+
including Link. `Wizard show-steps` shows registered step headlines and does not
|
|
525
|
+
permit jumping past guards. Its built-in accessible name, `footer` actions and
|
|
526
|
+
step progress follow Provider locale; explicit overrides remain available. `RepeatRow` places wrapped cells
|
|
527
|
+
inside `[data-repeat-fields]` and keeps its remove action beside the first control;
|
|
528
|
+
`removeDisabled` disables the action. Use wrapping rows for adjacent controls.
|
|
529
|
+
|
|
530
|
+
DOM attrs on controls target the focusable control (a Reka checkbox is a button
|
|
531
|
+
with `role="checkbox"`), while class/style target the layout wrapper. Overlay attrs
|
|
532
|
+
target content, except Tooltip, whose attrs target the slotted trigger. Renderless
|
|
533
|
+
providers without a rendered surface do not provide an attr destination.
|
|
534
|
+
|
|
535
|
+
The scoped preflight removes browser heading/paragraph/list margins and bare
|
|
536
|
+
button chrome inside library roots. Use explicit classes or Typo components for
|
|
537
|
+
intentional typography. Restore EmptyState's former spacing with
|
|
538
|
+
`class="min-h-48 py-10"`. The supplied DSM theme is light; forced-colors keyboard
|
|
539
|
+
focus has an outline. A dark theme is not part of this release.
|
|
540
|
+
|
|
541
|
+
### Testing Select with jsdom
|
|
542
|
+
|
|
543
|
+
Mount with `attachTo: document.body` and unmount after each test. Reka uses
|
|
544
|
+
keyboard interaction reliably in jsdom; pointer simulation depends on the
|
|
545
|
+
PointerEvent implementation. This helper works without synthesizing pointer
|
|
546
|
+
positions or exposing component internals:
|
|
547
|
+
|
|
548
|
+
```ts
|
|
549
|
+
import { flushPromises } from '@vue/test-utils'
|
|
550
|
+
|
|
551
|
+
async function chooseSelect(selectWrapper, label: string) {
|
|
552
|
+
await selectWrapper.get('[role="combobox"]').trigger('keydown', { key: 'ArrowDown' })
|
|
553
|
+
await flushPromises()
|
|
554
|
+
// Options may be portalled into AppRoot or document.body.
|
|
555
|
+
const option = [...document.querySelectorAll<HTMLElement>('[role="option"]')]
|
|
556
|
+
.find(node => node.textContent?.trim() === label)
|
|
557
|
+
if (!option || option.getAttribute('aria-disabled') === 'true') throw new Error(`No enabled option: ${label}`)
|
|
558
|
+
option.focus()
|
|
559
|
+
option.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter', bubbles: true, cancelable: true }))
|
|
560
|
+
await flushPromises()
|
|
561
|
+
}
|
|
562
|
+
```
|
|
563
|
+
|
|
564
|
+
Assert the emitted model value and label/ARIA links. For browser checks, use
|
|
565
|
+
actual ArrowDown/ArrowUp/Enter/Escape input and verify the selected value and focus.
|
|
566
|
+
`pnpm check` is valid without existing dist; `release:stage` requires a complete
|
|
567
|
+
build and refuses missing/empty exported artifacts before copying files.
|
|
568
|
+
|
|
569
|
+
### FilePicker rejection contract
|
|
570
|
+
|
|
571
|
+
FilePicker selects browser `File[]`; it does not read or parse their contents.
|
|
572
|
+
Each incoming file gets at most one reason, in the following order:
|
|
573
|
+
|
|
574
|
+
| Reason | When emitted |
|
|
575
|
+
| --- | --- |
|
|
576
|
+
| `type` | The name/MIME does not match `accept` (case-insensitive extension, MIME or MIME wildcard). |
|
|
577
|
+
| `size` | A nonzero `maxSize` is exceeded; a file exactly at the limit is accepted. |
|
|
578
|
+
| `duplicate` | Name, size and lastModified equal an existing or earlier accepted file. Directory path/content are not compared. |
|
|
579
|
+
| `count` | Adding the file would exceed `maxFiles`, or a single-file picker already contains one file. |
|
|
580
|
+
|
|
581
|
+
Single-file mode accepts the first valid file and rejects subsequent files with
|
|
582
|
+
`count`. It keeps an already selected file; remove it before selecting a replacement.
|
|
583
|
+
A canceled/empty selection emits neither `rejected` nor `update:modelValue`.
|
|
584
|
+
Disabled selection/drop is ignored. Size/type/count/duplicate are sufficient for
|
|
585
|
+
the component's selection policy. Failed reads, malformed JSON, encoding errors,
|
|
586
|
+
content validation, uploads and network failures belong to the application and
|
|
587
|
+
must be displayed separately; do not invent another FilePicker rejection reason.
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
declare const __VLS_export: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
2
|
+
declare const _default: typeof __VLS_export;
|
|
3
|
+
export default _default;
|
|
@@ -3,6 +3,7 @@ type __VLS_Props = {
|
|
|
3
3
|
columns: AdvancePanelGridColumn[];
|
|
4
4
|
data: AdvancePanelGridRow[];
|
|
5
5
|
/** Custom comparator per column; falls back to a numeric/locale compare. */
|
|
6
|
+
sortLabel?: (title: string) => string;
|
|
6
7
|
localSortFunc?: AdvancePanelGridSortResolver;
|
|
7
8
|
};
|
|
8
9
|
declare function deactivateRow(): void;
|
|
@@ -4,6 +4,8 @@ type __VLS_Props = {
|
|
|
4
4
|
modelValue?: string;
|
|
5
5
|
groups: AppSidebarGroup[];
|
|
6
6
|
/** Show the DSM search field above the list; it filters items by label. */
|
|
7
|
+
ariaLabel?: string;
|
|
8
|
+
clearSearchLabel?: string;
|
|
7
9
|
searchable?: boolean;
|
|
8
10
|
searchPlaceholder?: string;
|
|
9
11
|
/** Section headers get a chevron and fold their items. */
|
|
@@ -23,7 +25,6 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {
|
|
|
23
25
|
"onUpdate:expandedKeys"?: ((value: string[]) => any) | undefined;
|
|
24
26
|
onBranchToggle?: ((key: string, expanded: boolean) => any) | undefined;
|
|
25
27
|
}>, {
|
|
26
|
-
searchPlaceholder: string;
|
|
27
28
|
collapsible: boolean;
|
|
28
29
|
expandedKeys: string[];
|
|
29
30
|
defaultExpandedKeys: string[];
|
|
@@ -1,16 +1,18 @@
|
|
|
1
1
|
import { AboutCheckState, AboutVersionInfo } from './types';
|
|
2
|
-
/**
|
|
3
|
-
* App-local "About this application" dialog: name, tagline, version, copyright
|
|
4
|
-
* and legal links. It is a plain modal dialog, not a DSM window: no window
|
|
5
|
-
* manager, dragging or desktop frame.
|
|
6
|
-
*
|
|
7
|
-
* The optional update check is never hidden. `fetchVersion` is awaited, the
|
|
8
|
-
* result drives a visible, announced status (checking / update / beta /
|
|
9
|
-
* failed), the request is re-runnable and its outcome is observable through
|
|
10
|
-
* `check-start`, `check-result` and `check-error` plus the exposed
|
|
11
|
-
* `checkForUpdates()`.
|
|
12
|
-
*/
|
|
13
2
|
type __VLS_Props = {
|
|
3
|
+
text?: Partial<{
|
|
4
|
+
beta: string;
|
|
5
|
+
version: string;
|
|
6
|
+
checking: string;
|
|
7
|
+
available: string;
|
|
8
|
+
betaAvailable: string;
|
|
9
|
+
failed: string;
|
|
10
|
+
retry: string;
|
|
11
|
+
releaseNotes: string;
|
|
12
|
+
terms: string;
|
|
13
|
+
privacy: string;
|
|
14
|
+
legal: string;
|
|
15
|
+
}>;
|
|
14
16
|
open?: boolean;
|
|
15
17
|
defaultOpen?: boolean;
|
|
16
18
|
title: string;
|
|
@@ -59,7 +61,6 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
|
|
|
59
61
|
defaultOpen: boolean;
|
|
60
62
|
open: boolean;
|
|
61
63
|
version: string;
|
|
62
|
-
closeLabel: string;
|
|
63
64
|
tagline: string;
|
|
64
65
|
iconSrc: string;
|
|
65
66
|
beta: boolean;
|
|
@@ -16,7 +16,6 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {},
|
|
|
16
16
|
onClose?: (() => any) | undefined;
|
|
17
17
|
}>, {
|
|
18
18
|
tone: "info" | "success" | "warning" | "danger";
|
|
19
|
-
closeLabel: string;
|
|
20
19
|
closable: boolean;
|
|
21
20
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
22
21
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -37,8 +37,6 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {
|
|
|
37
37
|
readonly: boolean;
|
|
38
38
|
inputType: "text" | "textarea";
|
|
39
39
|
autosize: CopyCutFieldAutosize;
|
|
40
|
-
copyLabel: string;
|
|
41
|
-
cutLabel: string;
|
|
42
40
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
43
41
|
declare const _default: typeof __VLS_export;
|
|
44
42
|
export default _default;
|
|
@@ -24,3 +24,5 @@ export type ResolvedDataGridLabels = DataGridLabels & {
|
|
|
24
24
|
reorderRow: (key: string) => string;
|
|
25
25
|
};
|
|
26
26
|
export declare const defaultDataGridLabels: ResolvedDataGridLabels;
|
|
27
|
+
/** Locale-aware chrome; the exported English defaults remain available to callers. */
|
|
28
|
+
export declare function localizedDataGridLabels(t: import('../../../i18n/text').UiTranslator): ResolvedDataGridLabels;
|
|
@@ -20,9 +20,8 @@ type __VLS_Slots = {} & {
|
|
|
20
20
|
[K in NonNullable<typeof __VLS_2>]?: (props: typeof __VLS_3) => any;
|
|
21
21
|
};
|
|
22
22
|
declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
23
|
-
rowKey: string;
|
|
24
|
-
emptyText: string;
|
|
25
23
|
compact: boolean;
|
|
24
|
+
rowKey: string;
|
|
26
25
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
27
26
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
28
27
|
declare const _default: typeof __VLS_export;
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { FilePickerText } from '../../../i18n/filePicker';
|
|
2
|
+
import { UiLocale } from '../../../i18n/locale';
|
|
1
3
|
export type FileRejection = {
|
|
2
4
|
file: File;
|
|
3
5
|
reason: 'type' | 'size' | 'count' | 'duplicate';
|
|
@@ -12,15 +14,18 @@ type __VLS_Props = {
|
|
|
12
14
|
maxSize?: number;
|
|
13
15
|
directory?: boolean;
|
|
14
16
|
showList?: boolean;
|
|
17
|
+
variant?: 'dropzone' | 'compact';
|
|
18
|
+
locale?: UiLocale;
|
|
19
|
+
text?: Partial<FilePickerText>;
|
|
15
20
|
title?: string;
|
|
16
21
|
description?: string;
|
|
17
22
|
};
|
|
18
|
-
declare var
|
|
23
|
+
declare var __VLS_27: {
|
|
19
24
|
file: File;
|
|
20
25
|
index: number;
|
|
21
26
|
};
|
|
22
27
|
type __VLS_Slots = {} & {
|
|
23
|
-
'file-actions'?: (props: typeof
|
|
28
|
+
'file-actions'?: (props: typeof __VLS_27) => any;
|
|
24
29
|
};
|
|
25
30
|
declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
26
31
|
"update:modelValue": (files: File[]) => any;
|
|
@@ -29,10 +34,9 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {},
|
|
|
29
34
|
"onUpdate:modelValue"?: ((files: File[]) => any) | undefined;
|
|
30
35
|
onRejected?: ((items: FileRejection[]) => any) | undefined;
|
|
31
36
|
}>, {
|
|
32
|
-
|
|
37
|
+
variant: "dropzone" | "compact";
|
|
33
38
|
disabled: boolean;
|
|
34
39
|
modelValue: File[];
|
|
35
|
-
description: string;
|
|
36
40
|
multiple: boolean;
|
|
37
41
|
maxFiles: number;
|
|
38
42
|
maxSize: number;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { FieldWidth } from '../../../lib/fieldWidth';
|
|
2
2
|
import { FormFieldContext } from './context';
|
|
3
|
-
import { FormItemValidateMessageDisplayMode, FormRule, ValidateStatus, ValidateTrigger } from './types';
|
|
3
|
+
import { FormDirection, FormItemValidateMessageDisplayMode, FormRule, ValidateStatus, ValidateTrigger } from './types';
|
|
4
4
|
type __VLS_Props = {
|
|
5
5
|
/** Controlled field value; when `undefined` the value is reported by the control. */
|
|
6
6
|
modelValue?: unknown;
|
|
@@ -44,6 +44,8 @@ type __VLS_Props = {
|
|
|
44
44
|
textOnly?: boolean;
|
|
45
45
|
/** Indentation level (multiples of 28px) or any CSS length. */
|
|
46
46
|
indent?: string | number;
|
|
47
|
+
/** Auto follows the available width; explicit directions override the enclosing form. */
|
|
48
|
+
direction?: FormDirection;
|
|
47
49
|
/** Width of the label column in the horizontal layout. */
|
|
48
50
|
labelWidth?: string;
|
|
49
51
|
/** Maximum control width; inherits the form's `fieldWidth` (`'md'` by default). */
|
|
@@ -99,15 +101,15 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
|
|
|
99
101
|
setFieldDisabled: typeof setDisabled;
|
|
100
102
|
ensureVisible: typeof ensureVisible;
|
|
101
103
|
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
102
|
-
"update:modelValue": (value: unknown) => any;
|
|
103
104
|
validating: () => any;
|
|
105
|
+
"update:modelValue": (value: unknown) => any;
|
|
104
106
|
validated: (result: {
|
|
105
107
|
message: string;
|
|
106
108
|
status: ValidateStatus;
|
|
107
109
|
}) => any;
|
|
108
110
|
}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
109
|
-
"onUpdate:modelValue"?: ((value: unknown) => any) | undefined;
|
|
110
111
|
onValidating?: (() => any) | undefined;
|
|
112
|
+
"onUpdate:modelValue"?: ((value: unknown) => any) | undefined;
|
|
111
113
|
onValidated?: ((result: {
|
|
112
114
|
message: string;
|
|
113
115
|
status: ValidateStatus;
|
|
@@ -2,7 +2,7 @@ import { InjectionKey } from 'vue';
|
|
|
2
2
|
import { FieldWidth } from '../../../lib/fieldWidth';
|
|
3
3
|
import { FormRules, FormDirection, FormSpacing, ValidateMessageDisplayMode, ValidateStatus, ValidateTrigger } from './types';
|
|
4
4
|
export declare const FORM_CONTEXT_KEY: InjectionKey<FormContext>;
|
|
5
|
-
export declare const FORM_FIELD_KEY: InjectionKey<FormFieldContext>;
|
|
5
|
+
export declare const FORM_FIELD_KEY: InjectionKey<FormFieldContext | null>;
|
|
6
6
|
/** What Form exposes to its FormItems. Values are unwrapped (the provided object is reactive). */
|
|
7
7
|
export type FormContext = {
|
|
8
8
|
rules: FormRules;
|
|
@@ -31,6 +31,12 @@ export type FormFieldHandle = {
|
|
|
31
31
|
*/
|
|
32
32
|
export type FormFieldContext = {
|
|
33
33
|
controlId: string;
|
|
34
|
+
defaultControlId?: string;
|
|
35
|
+
isPrimaryControl?: (owner: symbol) => boolean;
|
|
36
|
+
claimControl?: (owner: symbol) => boolean;
|
|
37
|
+
releaseControl?: (owner: symbol) => void;
|
|
38
|
+
labelId?: string;
|
|
39
|
+
setControlId?: (id: string) => void;
|
|
34
40
|
descriptionId: string | undefined;
|
|
35
41
|
messageId: string | undefined;
|
|
36
42
|
/** Value for `aria-describedby`, covering the rendered description and message. */
|
|
@@ -1,5 +1,8 @@
|
|
|
1
|
+
import { UiTranslator } from '../../../i18n/text';
|
|
1
2
|
import { FormRule, FormRuleType, ValidateTrigger } from './types';
|
|
2
3
|
export type ValidateRulesOptions = {
|
|
4
|
+
/** Built-in fallback translator; omitted for the standalone English API. */
|
|
5
|
+
text?: UiTranslator;
|
|
3
6
|
/** `null` runs every rule regardless of its `trigger`; `undefined` also runs every rule. */
|
|
4
7
|
trigger?: ValidateTrigger | null;
|
|
5
8
|
/** Trigger assumed by rules that do not declare one. Defaults to `'blur'`. */
|
|
@@ -5,7 +5,7 @@ export type ValidateStatus = '' | 'success' | 'error' | 'warning' | 'validating'
|
|
|
5
5
|
export type ValidateMessageDisplayMode = 'popup' | 'text';
|
|
6
6
|
/** FormItem-level value: `'form'` inherits the enclosing form's mode. */
|
|
7
7
|
export type FormItemValidateMessageDisplayMode = ValidateMessageDisplayMode | 'form';
|
|
8
|
-
export type FormDirection = 'horizontal' | 'vertical';
|
|
8
|
+
export type FormDirection = 'auto' | 'horizontal' | 'vertical';
|
|
9
9
|
export type FormSpacing = 'none' | 'dense' | 'compact' | 'regular' | 'relaxed' | number | 'auto';
|
|
10
10
|
export type FormRuleType = 'string' | 'number' | 'integer' | 'boolean' | 'array' | 'email' | 'url' | 'date';
|
|
11
11
|
export type FormRuleCallback = (error?: Error | string | void) => void;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label: string;
|
|
3
|
+
value?: string | number;
|
|
4
|
+
labelWidth?: string;
|
|
5
|
+
};
|
|
6
|
+
declare var __VLS_1: {}, __VLS_3: {};
|
|
7
|
+
type __VLS_Slots = {} & {
|
|
8
|
+
label?: (props: typeof __VLS_1) => any;
|
|
9
|
+
} & {
|
|
10
|
+
default?: (props: typeof __VLS_3) => any;
|
|
11
|
+
};
|
|
12
|
+
declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
13
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
14
|
+
declare const _default: typeof __VLS_export;
|
|
15
|
+
export default _default;
|
|
16
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
17
|
+
new (): {
|
|
18
|
+
$slots: S;
|
|
19
|
+
};
|
|
20
|
+
};
|
|
@@ -1,9 +1,4 @@
|
|
|
1
1
|
import { MessageBoxKind, MessageBoxOptions } from './types';
|
|
2
|
-
/**
|
|
3
|
-
* One app-local message box. It is fully controlled: it never closes itself,
|
|
4
|
-
* it emits `settle` with the button id (or typed value) the user chose and the
|
|
5
|
-
* host removes it. See `types.ts` for the awaited API.
|
|
6
|
-
*/
|
|
7
2
|
type __VLS_Props = {
|
|
8
3
|
open?: boolean;
|
|
9
4
|
kind: MessageBoxKind;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { UiTranslator } from '../../../i18n/text';
|
|
1
2
|
import { Ref } from 'vue';
|
|
2
3
|
import { MessageBox, MessageBoxRequest } from './types';
|
|
3
4
|
export type MessageBoxHost = {
|
|
@@ -11,7 +12,7 @@ export type { LostChangeResult, MessageBox, MessageBoxButtonId, MessageBoxHandle
|
|
|
11
12
|
* Owns the queue of active app-local message boxes. `MessageBoxProvider` renders
|
|
12
13
|
* the queue and calls `settle` with the button id or typed value a box resolved.
|
|
13
14
|
*/
|
|
14
|
-
export declare function createMessageBoxHost(): MessageBoxHost;
|
|
15
|
+
export declare function createMessageBoxHost(t?: UiTranslator): MessageBoxHost;
|
|
15
16
|
/** The awaitable dialog API. Call it in `setup()`; a `MessageBoxProvider` must be an ancestor. */
|
|
16
17
|
export declare function useDialog(): MessageBox;
|
|
17
18
|
/** Alias of `useDialog()` that names the message-box family explicitly. */
|
|
@@ -1,8 +1,4 @@
|
|
|
1
1
|
import { OverflowToolbarItem, OverflowToolbarMenuEntry, OverflowToolbarMoreMenu, OverflowToolbarMoreState } from './types';
|
|
2
|
-
/**
|
|
3
|
-
* An item-driven toolbar: anything that does not fit moves into a right-hand
|
|
4
|
-
* More menu, including the submenu entries of an overflowed dropdown item.
|
|
5
|
-
*/
|
|
6
2
|
type __VLS_Props = {
|
|
7
3
|
items?: OverflowToolbarItem[];
|
|
8
4
|
/** Items kept in the row even when the row is too narrow for them. */
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
type __VLS_Props = {
|
|
2
2
|
removable?: boolean;
|
|
3
3
|
removeLabel?: string;
|
|
4
|
+
removeDisabled?: boolean;
|
|
4
5
|
};
|
|
5
6
|
declare var __VLS_1: {};
|
|
6
7
|
type __VLS_Slots = {} & {
|
|
@@ -11,8 +12,8 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {},
|
|
|
11
12
|
}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
12
13
|
onRemove?: (() => any) | undefined;
|
|
13
14
|
}>, {
|
|
14
|
-
removeLabel: string;
|
|
15
15
|
removable: boolean;
|
|
16
|
+
removeDisabled: boolean;
|
|
16
17
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
17
18
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
18
19
|
declare const _default: typeof __VLS_export;
|
|
@@ -4,6 +4,7 @@ type __VLS_Props = {
|
|
|
4
4
|
clearLabel?: string;
|
|
5
5
|
/** `filter` is the DSM toolbar filter box (funnel icon); `search` keeps the magnifier. */
|
|
6
6
|
variant?: 'search' | 'filter';
|
|
7
|
+
disabled?: boolean;
|
|
7
8
|
};
|
|
8
9
|
declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
9
10
|
"update:modelValue": (value: string) => any;
|
|
@@ -11,9 +12,8 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {
|
|
|
11
12
|
"onUpdate:modelValue"?: ((value: string) => any) | undefined;
|
|
12
13
|
}>, {
|
|
13
14
|
variant: "search" | "filter";
|
|
15
|
+
disabled: boolean;
|
|
14
16
|
modelValue: string;
|
|
15
|
-
placeholder: string;
|
|
16
|
-
clearLabel: string;
|
|
17
17
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
18
18
|
declare const _default: typeof __VLS_export;
|
|
19
19
|
export default _default;
|
|
@@ -84,7 +84,6 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
|
|
|
84
84
|
checkable: boolean;
|
|
85
85
|
defaultCheckedKeys: string[];
|
|
86
86
|
loadChildren: (node: TreeNode) => Promise<TreeNode[] | undefined>;
|
|
87
|
-
expandLabel: (node: TreeNode, expanded: boolean) => string;
|
|
88
87
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
89
88
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
90
89
|
declare const _default: typeof __VLS_export;
|
|
@@ -1,9 +1,4 @@
|
|
|
1
1
|
import { WizardFooterConfig, WizardStepChange } from './types';
|
|
2
|
-
/**
|
|
3
|
-
* Step-flow controller for multi-step dialogs. It owns step registration,
|
|
4
|
-
* navigation guards, footer state and the finish / cancel outcomes. It creates
|
|
5
|
-
* no window: mount it inside `Dialog` for app-local modality.
|
|
6
|
-
*/
|
|
7
2
|
type __VLS_Props = {
|
|
8
3
|
/** Initial / external reset key. Internal navigation keeps working when the caller does not bind it back. */
|
|
9
4
|
activeStepKey?: string;
|
|
@@ -11,6 +6,8 @@ type __VLS_Props = {
|
|
|
11
6
|
/** Shows the Cancel action in the footer. */
|
|
12
7
|
cancellable?: boolean;
|
|
13
8
|
ariaLabel?: string;
|
|
9
|
+
showSteps?: boolean;
|
|
10
|
+
progressText?: (current: number, total: number) => string;
|
|
14
11
|
};
|
|
15
12
|
declare function toNextStep(): Promise<void>;
|
|
16
13
|
declare function toPreviousStep(): Promise<void>;
|
|
@@ -55,7 +52,6 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
|
|
|
55
52
|
onFinished?: (() => any) | undefined;
|
|
56
53
|
}>, {
|
|
57
54
|
footer: WizardFooterConfig;
|
|
58
|
-
ariaLabel: string;
|
|
59
55
|
cancellable: boolean;
|
|
60
56
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
61
57
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -45,8 +45,6 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
|
|
|
45
45
|
}>, {
|
|
46
46
|
loading: boolean;
|
|
47
47
|
fbar: PanelFbar;
|
|
48
|
-
confirmText: string;
|
|
49
|
-
cancelText: string;
|
|
50
48
|
scrollable: boolean;
|
|
51
49
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
52
50
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -9,8 +9,8 @@ type __VLS_Slots = {} & {
|
|
|
9
9
|
default?: (props: typeof __VLS_3) => any;
|
|
10
10
|
};
|
|
11
11
|
declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
12
|
-
ariaLabel: string;
|
|
13
12
|
active: boolean;
|
|
13
|
+
ariaLabel: string;
|
|
14
14
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
15
15
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
16
16
|
declare const _default: typeof __VLS_export;
|
|
@@ -34,7 +34,6 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {},
|
|
|
34
34
|
open: boolean;
|
|
35
35
|
tone: NotificationTone;
|
|
36
36
|
content: string | false;
|
|
37
|
-
closeLabel: string;
|
|
38
37
|
duration: number | false;
|
|
39
38
|
cancel: NotificationAction;
|
|
40
39
|
confirm: NotificationAction;
|
|
@@ -23,8 +23,6 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, Notificatio
|
|
|
23
23
|
alignment: NotificationAlignment;
|
|
24
24
|
gap: number;
|
|
25
25
|
stackGap: number;
|
|
26
|
-
landmarkLabel: string;
|
|
27
|
-
accessHint: string;
|
|
28
26
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
29
27
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
30
28
|
declare const _default: typeof __VLS_export;
|
|
@@ -26,7 +26,6 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {},
|
|
|
26
26
|
}>, {
|
|
27
27
|
items: BreadcrumbItem[];
|
|
28
28
|
actionMenuItems: boolean | BreadcrumbActionItem[];
|
|
29
|
-
collapsedLabel: string;
|
|
30
29
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
31
30
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
32
31
|
declare const _default: typeof __VLS_export;
|
|
@@ -4,6 +4,12 @@ export type ColorSwatch = {
|
|
|
4
4
|
hex?: string;
|
|
5
5
|
};
|
|
6
6
|
type __VLS_Props = {
|
|
7
|
+
text?: Partial<{
|
|
8
|
+
choose: string;
|
|
9
|
+
common: string;
|
|
10
|
+
palette: string;
|
|
11
|
+
custom: string;
|
|
12
|
+
}>;
|
|
7
13
|
/** Current colour string, in the format selected by `colorFormat`. */
|
|
8
14
|
modelValue?: string;
|
|
9
15
|
colorFormat?: ColorPickerFormat;
|
|
@@ -57,8 +63,6 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
|
|
|
57
63
|
customOptions: string[];
|
|
58
64
|
hasCustom: boolean;
|
|
59
65
|
filterSameColor: boolean;
|
|
60
|
-
resetLabel: string;
|
|
61
|
-
customLabel: string;
|
|
62
66
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
63
67
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
64
68
|
declare const _default: typeof __VLS_export;
|
|
@@ -5,20 +5,20 @@ type __VLS_Props = Omit<SelectFieldProps, 'multiple' | 'modelValue' | 'defaultVa
|
|
|
5
5
|
};
|
|
6
6
|
declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
7
7
|
select: (option: SelectOption) => any;
|
|
8
|
+
blur: (event: FocusEvent) => any;
|
|
8
9
|
invalid: (text: string) => any;
|
|
9
10
|
"update:modelValue": (value: string) => any;
|
|
10
11
|
focus: (event: FocusEvent) => any;
|
|
11
|
-
blur: (event: FocusEvent) => any;
|
|
12
12
|
"update:loading": (loading: boolean) => any;
|
|
13
13
|
create: (value: string) => any;
|
|
14
14
|
"open-dropdown": () => any;
|
|
15
15
|
"close-dropdown": () => any;
|
|
16
16
|
}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
17
17
|
onSelect?: ((option: SelectOption) => any) | undefined;
|
|
18
|
+
onBlur?: ((event: FocusEvent) => any) | undefined;
|
|
18
19
|
onInvalid?: ((text: string) => any) | undefined;
|
|
19
20
|
"onUpdate:modelValue"?: ((value: string) => any) | undefined;
|
|
20
21
|
onFocus?: ((event: FocusEvent) => any) | undefined;
|
|
21
|
-
onBlur?: ((event: FocusEvent) => any) | undefined;
|
|
22
22
|
"onUpdate:loading"?: ((loading: boolean) => any) | undefined;
|
|
23
23
|
onCreate?: ((value: string) => any) | undefined;
|
|
24
24
|
"onOpen-dropdown"?: (() => any) | undefined;
|