@synopackageland/ui 0.20.4 → 0.20.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.
Files changed (71) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/LICENSES/THIRD_PARTY.md +2 -32
  3. package/dist/cli.js +0 -0
  4. package/dist/components/app/app-layout/AppLayout.vue.d.ts +21 -1
  5. package/dist/components/app/app-layout/pageTitle.d.ts +24 -0
  6. package/dist/components/app/app-tab-bar/AppTabBar.vue.d.ts +1 -1
  7. package/dist/components/app/aside-panel/AsidePanel.vue.d.ts +1 -1
  8. package/dist/components/app/section-tabs/SectionTabs.vue.d.ts +22 -4
  9. package/dist/components/composite/about-dialog/AboutDialog.vue.d.ts +1 -1
  10. package/dist/components/composite/adaptive-panel/AdaptivePanel.vue.d.ts +1 -1
  11. package/dist/components/composite/data-grid/DataGrid.vue.d.ts +19 -1
  12. package/dist/components/composite/data-grid/labels.d.ts +15 -0
  13. package/dist/components/composite/data-grid/listLayout.d.ts +26 -0
  14. package/dist/components/composite/data-table/DataTable.vue.d.ts +33 -7
  15. package/dist/components/composite/file-picker/FilePicker.vue.d.ts +2 -2
  16. package/dist/components/composite/form/FormGroup.vue.d.ts +1 -1
  17. package/dist/components/composite/form/context.d.ts +13 -0
  18. package/dist/components/composite/form-actions/FormActions.vue.d.ts +6 -2
  19. package/dist/components/composite/record-panel/RecordPanel.vue.d.ts +20 -6
  20. package/dist/components/composite/settings-section/SettingsSection.vue.d.ts +1 -1
  21. package/dist/components/composite/tag-editor/TagEditor.vue.d.ts +2 -2
  22. package/dist/components/composite/tree-view/TreeView.vue.d.ts +4 -4
  23. package/dist/components/composite/wizard/WizardDialog.vue.d.ts +2 -2
  24. package/dist/components/containers/list-detail/ListDetail.vue.d.ts +5 -3
  25. package/dist/components/feedback/validation-popup/ValidationPopup.vue.d.ts +1 -1
  26. package/dist/components/primitives/color-picker/ColorPicker.vue.d.ts +4 -4
  27. package/dist/components/primitives/combobox/Combobox.vue.d.ts +4 -4
  28. package/dist/components/primitives/context-menu/ContextMenu.vue.d.ts +2 -2
  29. package/dist/components/primitives/dialog/Dialog.vue.d.ts +17 -9
  30. package/dist/components/primitives/dropdown-menu/DropdownMenu.vue.d.ts +3 -3
  31. package/dist/components/primitives/dropdown-menu/DropdownMenuSheet.vue.d.ts +28 -0
  32. package/dist/components/primitives/input/Input.vue.d.ts +8 -1
  33. package/dist/components/primitives/input/Textarea.vue.d.ts +1 -1
  34. package/dist/components/primitives/input-steppers/InputSteppers.vue.d.ts +1 -1
  35. package/dist/components/primitives/motion/PushTransition.vue.d.ts +38 -0
  36. package/dist/components/primitives/multiple-select/MultipleSelect.vue.d.ts +4 -4
  37. package/dist/components/primitives/pagination/Pagination.vue.d.ts +22 -9
  38. package/dist/components/primitives/pagination/PaginationSheet.vue.d.ts +27 -0
  39. package/dist/components/primitives/pagination/labels.d.ts +6 -0
  40. package/dist/components/primitives/popover/Popover.vue.d.ts +1 -1
  41. package/dist/components/primitives/select/internal/ComboboxField.vue.d.ts +5 -5
  42. package/dist/components/primitives/select/internal/SelectSheet.vue.d.ts +42 -0
  43. package/dist/components/primitives/sheet/BottomSheet.vue.d.ts +69 -0
  44. package/dist/components/primitives/sheet/Sheet.vue.d.ts +13 -5
  45. package/dist/components/primitives/sheet/phone.d.ts +7 -0
  46. package/dist/components/primitives/superbox-select/SuperboxSelect.vue.d.ts +4 -4
  47. package/dist/components/rich-text-editor/RichTextEditor.vue.d.ts +1 -1
  48. package/dist/composables/formControl.d.ts +18 -0
  49. package/dist/composables/phoneSurface.d.ts +35 -0
  50. package/dist/feedback/StatusSlot.vue.d.ts +1 -1
  51. package/dist/grid/host/GridHost.vue.d.ts +1 -1
  52. package/dist/grid.js +358 -259
  53. package/dist/i18n/text.d.ts +11 -0
  54. package/dist/index.d.ts +7 -2
  55. package/dist/index.js +23021 -18391
  56. package/dist/json-preview/preview.js +16926 -12450
  57. package/dist/reka-runtime.json +15 -12
  58. package/dist/rich-text.js +1 -1
  59. package/dist/theme.css +1 -1
  60. package/dist/themes/dsm7-embedded-reset.css +1 -1
  61. package/dist/themes/dsm7-embedded-theme.css +1 -1
  62. package/dist/themes/dsm7-embedded.css +1 -1
  63. package/dist/themes/dsm7.css +1 -1
  64. package/docs/adaptive-layout.md +11 -9
  65. package/docs/app-local-modal.md +1 -1
  66. package/docs/layout-rules.md +14 -0
  67. package/docs/list-detail.md +9 -3
  68. package/docs/mobile-native.md +299 -11
  69. package/docs/release-checks.md +5 -0
  70. package/docs/theme-hooks.md +2 -2
  71. package/package.json +64 -57
@@ -2,7 +2,9 @@ type SheetSide = 'left' | 'right' | 'top' | 'bottom';
2
2
  type __VLS_Props = {
3
3
  open?: boolean;
4
4
  defaultOpen?: boolean;
5
+ /** `bottom` is the BottomSheet: a grabber, swipe down to close, keyboard aware. */
5
6
  side?: SheetSide;
7
+ /** The width of a side sheet, or the height of a top or bottom one. Without it a bottom sheet fits its content. */
6
8
  size?: string;
7
9
  title?: string;
8
10
  description?: string;
@@ -16,13 +18,19 @@ type __VLS_Props = {
16
18
  /** Whether a press outside closes the sheet. Defaults to `modal`: a non-modal sheet stays while the page behind is used. */
17
19
  closeOnOutside?: boolean;
18
20
  };
19
- declare var __VLS_14: {}, __VLS_62: {}, __VLS_70: {};
21
+ declare var __VLS_15: {}, __VLS_17: {}, __VLS_20: {}, __VLS_35: {}, __VLS_83: {}, __VLS_91: {};
20
22
  type __VLS_Slots = {} & {
21
- trigger?: (props: typeof __VLS_14) => any;
23
+ trigger?: (props: typeof __VLS_15) => any;
22
24
  } & {
23
- default?: (props: typeof __VLS_62) => any;
25
+ default?: (props: typeof __VLS_17) => any;
24
26
  } & {
25
- footer?: (props: typeof __VLS_70) => any;
27
+ footer?: (props: typeof __VLS_20) => any;
28
+ } & {
29
+ trigger?: (props: typeof __VLS_35) => any;
30
+ } & {
31
+ default?: (props: typeof __VLS_83) => any;
32
+ } & {
33
+ footer?: (props: typeof __VLS_91) => any;
26
34
  };
27
35
  declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
28
36
  escapeKeyDown: (event: KeyboardEvent) => any;
@@ -40,9 +48,9 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {},
40
48
  "onUpdate:open"?: ((value: boolean) => any) | undefined;
41
49
  }>, {
42
50
  size: string;
51
+ open: boolean;
43
52
  side: SheetSide;
44
53
  defaultOpen: boolean;
45
- open: boolean;
46
54
  modal: boolean;
47
55
  closeOnOutside: boolean;
48
56
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
@@ -0,0 +1,7 @@
1
+ import { ComputedRef } from 'vue';
2
+ /**
3
+ * True when the surface opens on a phone: the app's container is 640px or
4
+ * narrower (AppRoot/AppLayout presentation `mobile`). Outside an app root the
5
+ * viewport width decides instead. Call it in a component's setup.
6
+ */
7
+ export declare function usePhonePresentation(): ComputedRef<boolean>;
@@ -6,21 +6,21 @@ type __VLS_Props = Omit<SelectFieldProps, 'multiple' | 'modelValue' | 'defaultVa
6
6
  declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
7
7
  select: (option: SelectOption) => any;
8
8
  blur: (event: FocusEvent) => any;
9
+ focus: (event: FocusEvent) => any;
9
10
  invalid: (text: string) => any;
10
11
  "update:modelValue": (value: string[]) => any;
11
- focus: (event: FocusEvent) => any;
12
- "update:loading": (loading: boolean) => any;
13
12
  create: (value: string) => any;
13
+ "update:loading": (loading: boolean) => 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
18
  onBlur?: ((event: FocusEvent) => any) | undefined;
19
+ onFocus?: ((event: FocusEvent) => any) | undefined;
19
20
  onInvalid?: ((text: string) => any) | undefined;
20
21
  "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
21
- onFocus?: ((event: FocusEvent) => any) | undefined;
22
- "onUpdate:loading"?: ((loading: boolean) => any) | undefined;
23
22
  onCreate?: ((value: string) => any) | undefined;
23
+ "onUpdate:loading"?: ((loading: boolean) => any) | undefined;
24
24
  "onOpen-dropdown"?: (() => any) | undefined;
25
25
  "onClose-dropdown"?: (() => any) | undefined;
26
26
  }>, {
@@ -68,10 +68,10 @@ declare const __VLS_export: import('vue').DefineComponent<{
68
68
  variant: "compact" | "full";
69
69
  loading: boolean;
70
70
  disabled: boolean;
71
+ invalid: boolean;
71
72
  id: string;
72
73
  modelValue: string;
73
74
  placeholder: string;
74
- invalid: boolean;
75
75
  ariaLabel: string;
76
76
  headings: boolean;
77
77
  files: (id: string) => FileItem | undefined;
@@ -1,3 +1,11 @@
1
+ /** The native `type` for an Input `type`: `integer` and `decimal` are text fields with a number keyboard (never `type="number"`). */
2
+ export declare function nativeInputType(type: string): string;
3
+ /**
4
+ * The on-screen keyboard a field of this type opens: its layout
5
+ * (`inputmode`), whether it capitalises and spell-checks, and the label of
6
+ * its Enter key. The caller's own attributes override every one of them.
7
+ */
8
+ export declare function keyboardHints(type: string): Record<string, string>;
1
9
  /** One primary control per FormItem. Layout attrs stay on wrappers; all other
2
10
  * attrs belong to the focusable control. Composite controls consume the field
3
11
  * so their popup's internal inputs cannot steal its label or reuse its id. */
@@ -8,6 +16,16 @@ export declare function useFormControl(options: {
8
16
  ariaLabel?: () => string | undefined;
9
17
  ariaLabelledby?: () => string | undefined;
10
18
  invalid?: () => boolean | undefined;
19
+ /**
20
+ * A text entry field: its type sets the keyboard hints. With `element`, the
21
+ * field also joins its Form's field order, so its Enter key reads Next, or
22
+ * Done on the last field, and on a touch device Next moves to the next field.
23
+ */
24
+ keyboard?: {
25
+ type: () => string;
26
+ element?: () => HTMLElement | null | undefined;
27
+ active?: () => boolean;
28
+ };
11
29
  }): {
12
30
  controlAttrs: () => Record<string, unknown> & {
13
31
  id?: string;
@@ -0,0 +1,35 @@
1
+ import { ComputedRef, MaybeRefOrGetter } from 'vue';
2
+ /** A menu with more actions than this becomes an action sheet on a phone. */
3
+ export declare const PHONE_MENU_MAX_ACTIONS = 5;
4
+ /** What a popup holds; any of these, on a phone, makes it a sheet. */
5
+ export interface PhoneSurfaceContent {
6
+ list?: boolean;
7
+ search?: boolean;
8
+ form?: boolean;
9
+ /** The number of actions on the first level of a menu. */
10
+ actions?: number;
11
+ submenu?: boolean;
12
+ }
13
+ export type PhoneSurface = 'popover' | 'sheet';
14
+ /** Whether this content needs a sheet once the app is phone-width. */
15
+ export declare function needsSheet(content: PhoneSurfaceContent): boolean;
16
+ type MenuEntryShape = {
17
+ key?: unknown;
18
+ type?: string;
19
+ children?: readonly unknown[];
20
+ };
21
+ /** The content of a menu: its first-level actions (separators don't count) and whether any of them opens a submenu. */
22
+ export declare function menuContent(items: readonly MenuEntryShape[]): PhoneSurfaceContent;
23
+ /**
24
+ * `sheet` while the enclosing app is phone-width (640px or narrower, the same
25
+ * signal that turns a Dialog into a BottomSheet) and the content needs one,
26
+ * else `popover`. A touch tablet keeps popovers. Call it in setup.
27
+ */
28
+ export declare function usePhoneSurface(content: MaybeRefOrGetter<PhoneSurfaceContent>): ComputedRef<PhoneSurface>;
29
+ /**
30
+ * The name a control is known by, to title the sheet it opens: its
31
+ * `aria-label`, else the text of the elements its `aria-labelledby` names
32
+ * (a form label).
33
+ */
34
+ export declare function accessibleName(element: Element | null | undefined): string;
35
+ export {};
@@ -14,9 +14,9 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {
14
14
  }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
15
15
  onRetry?: (() => any) | undefined;
16
16
  }>, {
17
+ message: string;
17
18
  height: string;
18
19
  width: string;
19
- message: string;
20
20
  delay: number;
21
21
  state: "idle" | "pending" | "saved" | "error";
22
22
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
@@ -104,8 +104,8 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, GridHostExp
104
104
  }>, {
105
105
  loading: boolean;
106
106
  readonly: boolean;
107
- rowHeight: number;
108
107
  draggable: GridDraggable;
108
+ rowHeight: number;
109
109
  selectable: GridSelectable;
110
110
  editing: boolean;
111
111
  freezeColumnCount: number;