@synopackageland/ui 0.17.12 → 0.17.14

package/README.md

@@ -508,7 +508,7 @@ Primitives:
 
 - Button / IconButton / CopyButton
 - Input / Textarea
-- Checkbox / CheckboxGroup / RadioGroup / Switch
+- Checkbox / CheckboxGroup / RadioGroup / Switch — use RadioGroup for 2–4 mutually exclusive settings; Checkbox for independent options; Switch for immediate on/off. Reserve primary-filled, capsule-shaped SegmentControl for toolbar views ([choice policy](docs/layout-rules.md)).
 - Select
 - Badge / StatusDot / Separator / Spinner / LoadingMask / LoadingArea / Progress / SizeBar / Skeleton / Surface
 - SplitButton
@@ -522,7 +522,7 @@ DSM-style application building blocks:
 
 - SearchField
 - SettingsRow / SettingsSection
-- Form / FormItem / FormGroup / FormNote / InfoBox / FormActions / Fieldset (DSM-native settings structure, see [docs/layout-rules.md](docs/layout-rules.md))
+- SettingsPage / Form / FormItem / FormGroup / FormNote / InfoBox / FormActions / Fieldset (DSM-native settings structure, see [docs/layout-rules.md](docs/layout-rules.md))
 - Callout (see [docs/callout.md](docs/callout.md) for when to use a Callout, a toast or an inline note) / EmptyState / StepList
 - ConnectionTopology
 - DataTable / DataGrid
@@ -553,6 +553,12 @@ and End move focus between tabs; Enter or Space selects one. In a grid or flex p
 </SectionTabs>
 ```
 
+For unsaved drafts inside those panels, use `<SectionTabs fill keep-mounted>`.
+`keep-mounted` mounts every supplied item panel and hides inactive ones with
+`v-show`, preserving component state and DOM; hidden panels' effects remain
+active. It also works without `fill`. Without this option, switching tabs
+unmounts the previous panel; `fill` alone only controls layout.
+
 Page actions for the shown section go in `#actions`, on the tab row at the
 right edge over the same baseline; when the row is too narrow for both, the
 actions wrap onto a line of their own above the tabs, still right-aligned.

package/dist/components/app/section-tabs/SectionTabs.vue.d.ts

@@ -7,12 +7,22 @@ type __VLS_Props = {
     ariaLabel?: string;
     modelValue: string;
     items: SectionTab[];
+    /**
+     * Fills the container's height: the strip stays at the top and the panel
+     * takes the rest, for a SettingsPage that scrolls its body over a fixed
+     * footer. Without a height to fill (a phone page) the strip sticks to the top.
+     */
+    fill?: boolean;
+    /** Mount all supplied item panels and hide inactive ones, preserving local drafts. */
+    keepMounted?: boolean;
 };
-declare var __VLS_7: {}, __VLS_10: `panel-${string}`, __VLS_11: {};
+declare var __VLS_14: {}, __VLS_17: `panel-${string}`, __VLS_18: {}, __VLS_21: `panel-${string}`, __VLS_22: {};
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_10>]?: (props: typeof __VLS_11) => any;
+    [K in NonNullable<typeof __VLS_17>]?: (props: typeof __VLS_18) => any;
 } & {
-    actions?: (props: typeof __VLS_7) => any;
+    [K in NonNullable<typeof __VLS_21>]?: (props: typeof __VLS_22) => any;
+} & {
+    actions?: (props: typeof __VLS_14) => any;
 };
 declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (value: string) => any;

package/dist/components/app/settings-page/SettingsPage.vue.d.ts

@@ -0,0 +1,15 @@
+declare var __VLS_1: {}, __VLS_9: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+} & {
+    footer?: (props: typeof __VLS_9) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/composite/callout/Callout.vue.d.ts

@@ -3,7 +3,14 @@ type __VLS_Props = {
     /** `soft`: a compact tinted panel. `inline`: a status line with no panel, for a short note under a field or a section. */
     variant?: 'soft' | 'inline';
     title?: string;
-    closable?: boolean;
+    /**
+     * Shows a close button (default). Closing hides the callout until its
+     * tone, title or text (or `dismissKey`) changes. Turn it off only for a
+     * state that must stay in view, such as a blocking setup requirement.
+     */
+    dismissible?: boolean;
+    /** What a dismissal is remembered by, instead of the tone and the rendered text. */
+    dismissKey?: string;
     closeLabel?: string;
     /** A machine code (e.g. `login_wait_timeout`), shown after the message in a quieter style. */
     code?: string;
@@ -36,7 +43,7 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {}, {
     fill: boolean;
     variant: "soft" | "inline";
     tone: "info" | "success" | "warning" | "danger";
-    closable: boolean;
+    dismissible: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/composite/data-grid/DataGrid.vue.d.ts

@@ -185,6 +185,13 @@ type __VLS_Props = {
     refreshable?: boolean;
     refreshing?: boolean;
     maxHeight?: string;
+    /**
+     * Fills the height its flex-column container leaves (the default, DSM's
+     * list): the header stays, the rows scroll inside, and the footer sits at
+     * the container's bottom whatever the row count. `false` sizes the grid
+     * to its rows, for a short table inside a form or a dialog.
+     */
+    fill?: boolean;
     labels?: Partial<DataGridLabels>;
     /** @deprecated Use `labels.empty`. */
     emptyText?: string;
@@ -293,6 +300,7 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
     footer: boolean;
     filter: string;
     sort: DataGridSort | null;
+    fill: boolean;
     loading: boolean;
     group: DataGridGroup | null;
     loadingText: string;

package/dist/components/composite/data-table/DataTable.vue.d.ts

@@ -18,6 +18,12 @@ type __VLS_Props = {
     mobileView?: 'auto' | 'cards' | 'table' | 'container';
     /** Width in px under which `mobileView="container"` shows cards. */
     containerBreakpoint?: number;
+    /**
+     * Fills the height its flex-column container leaves (the default): the
+     * header stays and the rows scroll inside. `false` sizes the table to its
+     * rows, for a short table inside a form or a dialog.
+     */
+    fill?: boolean;
 };
 declare var __VLS_2: `cell-${string}`, __VLS_3: {
     row: Record<string, unknown>;
@@ -40,6 +46,7 @@ type __VLS_Slots = {} & {
     [K in NonNullable<typeof __VLS_16>]?: (props: typeof __VLS_17) => any;
 };
 declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    fill: boolean;
     compact: boolean;
     rowKey: string;
     mobileView: "auto" | "cards" | "table" | "container";

package/dist/components/composite/upload-queue/UploadQueue.vue.d.ts

@@ -31,8 +31,8 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {
     onCancelAll?: (() => any) | undefined;
 }>, {
     collapsible: boolean;
-    closable: boolean;
     processing: number;
+    closable: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/containers/fieldset/Fieldset.vue.d.ts

@@ -7,6 +7,7 @@ type __VLS_Props = {
     title?: FieldsetTitle;
     /** One line under the title, across the whole width (DSM's "Enter the server name, ..."). */
     description?: string;
+    /** Shows the disclosure chevron by default; set false for a fixed section. */
     collapsible?: boolean;
     /** Mouse gesture that toggles; Enter/Space always works on the header. */
     collapseTriggerEvent?: FieldsetCollapseTrigger;

package/dist/components/primitives/segment-control/SegmentControl.vue.d.ts

@@ -8,7 +8,7 @@ type __VLS_Props = {
     ariaLabelledby?: string;
     /** Disables every item of the group. */
     disabled?: boolean;
-    /** `sheet` draws joined sheet tabs on a rule, as above a table, instead of a segmented control. */
+    /** Toolbar view switcher; use RadioGroup for form choices. `sheet` draws joined tabs on a rule. */
     variant?: SegmentVariant;
 };
 declare var __VLS_1: {};

package/dist/components/primitives/switch/Switch.vue.d.ts

@@ -2,8 +2,13 @@ type __VLS_Props = {
     modelValue?: boolean;
     disabled?: boolean;
     label?: string;
+    description?: string;
 };
-declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+declare var __VLS_14: {};
+type __VLS_Slots = {} & {
+    description?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
@@ -11,5 +16,11 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {
     disabled: boolean;
     modelValue: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/index.d.ts

@@ -224,6 +224,7 @@ export { default as StackedBar } from './components/composite/stacked-bar/Stacke
 export type { StackedBarSegment, StackedBarTone } from './components/composite/stacked-bar/StackedBar.vue';
 export { default as PageContent } from './components/app/page-content/PageContent.vue';
 export { default as SectionTabs } from './components/app/section-tabs/SectionTabs.vue';
+export { default as SettingsPage } from './components/app/settings-page/SettingsPage.vue';
 export type { SectionTab } from './components/app/section-tabs/SectionTabs.vue';
 export { default as ConfigProvider } from './components/composite/config-provider/ConfigProvider.vue';
 export { useProps, provideConfigManager } from './composables/configCascade';