npm - @cnamts/synapse - Versions diffs - 1.0.14 → 1.0.16 - Mend

@cnamts/synapse 1.0.14 → 1.0.16

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 (395) hide show

package/dist/components/Customs/Selects/SySelect/SySelect.d.ts CHANGED Viewed

@@ -246,74 +246,70 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         $: import('vue').ComponentInternalInstance;
         $data: {};
         $props: Partial<{
+            variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
+            nav: boolean;
             style: import('vue').StyleValue;
+            disabled: boolean;
+            tag: string | import('vuetify/lib/types.mjs').JSXComponent<any>;
+            lines: false | "one" | "two" | "three";
+            mandatory: boolean;
+            returnObject: boolean;
+            selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
             density: import('vuetify/lib/composables/density.mjs').Density;
             rounded: string | number | boolean;
             tile: boolean;
-            tag: string | import('vuetify/lib/types.mjs').JSXComponent<any>;
-            variant: "flat" | "text" | "elevated" | "outlined" | "plain" | "tonal";
-            itemType: import('vuetify/lib/util/helpers.mjs').SelectItemKey;
-            returnObject: boolean;
+            slim: boolean;
+            filterable: boolean;
             activatable: boolean;
             selectable: boolean;
-            selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
             openStrategy: import('vuetify/lib/composables/nested/nested.mjs').OpenStrategyProp;
-            mandatory: boolean;
-            itemsRegistration: import('vuetify/lib/composables/nested/nested.mjs').ItemsRegistrationType;
-            disabled: boolean;
-            filterable: boolean;
-            lines: false | "one" | "three" | "two";
-            slim: boolean;
-            nav: boolean;
+            itemType: import('vuetify/lib/util/helpers.mjs').SelectItemKey;
         }> & Omit<{
-            style: string | false | import('vue').CSSProperties | import('vue').StyleValue[] | null;
-            density: import('vuetify/lib/composables/density.mjs').Density;
-            tile: boolean;
+            variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
+            nav: boolean;
+            style: import('vue').StyleValue;
+            disabled: boolean;
             tag: string | import('vuetify/lib/types.mjs').JSXComponent<any>;
-            variant: "flat" | "text" | "elevated" | "outlined" | "plain" | "tonal";
-            itemType: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
+            lines: false | "one" | "two" | "three";
+            mandatory: boolean;
             returnObject: boolean;
+            selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
+            density: import('vuetify/lib/composables/density.mjs').Density;
+            tile: boolean;
+            slim: boolean;
+            filterable: boolean;
             activatable: boolean;
             selectable: boolean;
-            selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
             openStrategy: import('vuetify/lib/composables/nested/nested.mjs').OpenStrategyProp;
-            mandatory: boolean;
-            itemsRegistration: import('vuetify/lib/composables/nested/nested.mjs').ItemsRegistrationType;
-            disabled: boolean;
-            filterable: boolean;
-            lines: false | "one" | "three" | "two";
-            slim: boolean;
-            nav: boolean;
-            theme?: string | undefined;
-            class?: any;
+            itemType: import('vuetify/lib/util/helpers.mjs').SelectItemKey;
+            height?: string | number | undefined;
+            width?: string | number | undefined;
             border?: string | number | boolean | undefined;
-            elevation?: string | number | undefined;
-            rounded?: string | number | boolean | undefined;
             color?: string | undefined;
-            height?: string | number | undefined;
             maxHeight?: string | number | undefined;
             maxWidth?: string | number | undefined;
             minHeight?: string | number | undefined;
             minWidth?: string | number | undefined;
-            width?: string | number | undefined;
-            valueComparator?: typeof import('vuetify/lib/util/deepEqual.mjs').deepEqual | undefined;
-            activeStrategy?: import('vuetify/lib/composables/nested/nested.mjs').ActiveStrategyProp | undefined;
             activated?: any;
+            class?: any;
+            theme?: string | undefined;
+            elevation?: string | number | undefined;
+            valueComparator?: typeof import('vuetify/lib/util/helpers.mjs').deepEqual | undefined;
+            rounded?: string | number | boolean | undefined;
             baseColor?: string | undefined;
+            bgColor?: string | undefined;
             activeColor?: string | undefined;
             activeClass?: string | undefined;
-            bgColor?: string | undefined;
-            expandIcon?: import('vuetify/lib/composables/icons.mjs').IconValue | undefined;
+            activeStrategy?: import('vuetify/lib/composables/nested/nested.mjs').ActiveStrategyProp | undefined;
             collapseIcon?: import('vuetify/lib/composables/icons.mjs').IconValue | undefined;
-            prependGap?: string | number | undefined;
-            indent?: string | number | undefined;
+            expandIcon?: import('vuetify/lib/composables/icons.mjs').IconValue | undefined;
+            "onUpdate:activated"?: ((value: unknown) => any) | undefined;
             "onClick:activate"?: ((value: {
                 id: unknown;
                 value: boolean;
                 path: unknown[];
             }) => any) | undefined;
-            "onUpdate:activated"?: ((value: unknown) => any) | undefined;
-        } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "nav" | "style" | "tag" | "disabled" | "density" | "rounded" | "tile" | "variant" | "slim" | "itemType" | "returnObject" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "mandatory" | "itemsRegistration" | "filterable" | "lines">;
+        } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, "nav" | "style" | "tag" | "disabled" | "variant" | "rounded" | "tile" | "density" | "slim" | "itemType" | "returnObject" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "mandatory" | "filterable" | "lines">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -321,7 +317,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             [x: string]: unknown;
         };
         $slots: Readonly<{
-            prepend?: ((arg: import('vuetify/lib/components/VList/VListItem.mjs').ListItemSlot & {
+            title?: ((arg: import('vuetify/lib/components/VList/VListItem.mjs').ListItemTitleSlot & {
                 item: any;
             }) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
                 [key: string]: any;
@@ -331,7 +327,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             }) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
-            title?: ((arg: import('vuetify/lib/components/VList/VListItem.mjs').ListItemTitleSlot & {
+            prepend?: ((arg: import('vuetify/lib/components/VList/VListItem.mjs').ListItemSlot & {
                 item: any;
             }) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
                 [key: string]: any;
@@ -391,103 +387,99 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         }) => void);
         $el: any;
         $options: import('vue').ComponentOptionsBase<{
-            style: string | false | import('vue').CSSProperties | import('vue').StyleValue[] | null;
-            density: import('vuetify/lib/composables/density.mjs').Density;
-            tile: boolean;
+            variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
+            nav: boolean;
+            style: import('vue').StyleValue;
+            disabled: boolean;
             tag: string | import('vuetify/lib/types.mjs').JSXComponent<any>;
-            variant: "flat" | "text" | "elevated" | "outlined" | "plain" | "tonal";
-            itemType: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
+            lines: false | "one" | "two" | "three";
+            mandatory: boolean;
             returnObject: boolean;
+            selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
+            density: import('vuetify/lib/composables/density.mjs').Density;
+            tile: boolean;
+            slim: boolean;
+            filterable: boolean;
             activatable: boolean;
             selectable: boolean;
-            selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
             openStrategy: import('vuetify/lib/composables/nested/nested.mjs').OpenStrategyProp;
-            mandatory: boolean;
-            itemsRegistration: import('vuetify/lib/composables/nested/nested.mjs').ItemsRegistrationType;
-            disabled: boolean;
-            filterable: boolean;
-            lines: false | "one" | "three" | "two";
-            slim: boolean;
-            nav: boolean;
+            itemType: import('vuetify/lib/util/helpers.mjs').SelectItemKey;
         } & {
-            theme?: string | undefined;
-            class?: any;
+            height?: string | number | undefined;
+            width?: string | number | undefined;
             border?: string | number | boolean | undefined;
-            elevation?: string | number | undefined;
-            rounded?: string | number | boolean | undefined;
             color?: string | undefined;
-            height?: string | number | undefined;
             maxHeight?: string | number | undefined;
             maxWidth?: string | number | undefined;
             minHeight?: string | number | undefined;
             minWidth?: string | number | undefined;
-            width?: string | number | undefined;
-            valueComparator?: typeof import('vuetify/lib/util/deepEqual.mjs').deepEqual | undefined;
-            activeStrategy?: import('vuetify/lib/composables/nested/nested.mjs').ActiveStrategyProp | undefined;
             activated?: any;
+            class?: any;
+            theme?: string | undefined;
+            elevation?: string | number | undefined;
+            valueComparator?: typeof import('vuetify/lib/util/helpers.mjs').deepEqual | undefined;
+            rounded?: string | number | boolean | undefined;
             baseColor?: string | undefined;
+            bgColor?: string | undefined;
             activeColor?: string | undefined;
             activeClass?: string | undefined;
-            bgColor?: string | undefined;
-            expandIcon?: import('vuetify/lib/composables/icons.mjs').IconValue | undefined;
+            activeStrategy?: import('vuetify/lib/composables/nested/nested.mjs').ActiveStrategyProp | undefined;
             collapseIcon?: import('vuetify/lib/composables/icons.mjs').IconValue | undefined;
-            prependGap?: string | number | undefined;
-            indent?: string | number | undefined;
+            expandIcon?: import('vuetify/lib/composables/icons.mjs').IconValue | undefined;
         } & {
+            "onUpdate:activated"?: ((value: unknown) => any) | undefined;
             "onClick:activate"?: ((value: {
                 id: unknown;
                 value: boolean;
                 path: unknown[];
             }) => any) | undefined;
-            "onUpdate:activated"?: ((value: unknown) => any) | undefined;
         }, {
             open: (id: unknown, value: boolean, event?: Event | undefined) => void;
             select: (id: unknown, value: boolean, event?: Event | undefined) => void;
-            focus: (location?: number | "next" | "first" | "last" | "prev" | undefined) => void;
+            focus: (location?: number | "next" | "prev" | "first" | "last" | undefined) => void;
             children: import('vue').Ref<Map<unknown, unknown[]>, Map<unknown, unknown[]>>;
             parents: import('vue').Ref<Map<unknown, unknown>, Map<unknown, unknown>>;
             getPath: (id: unknown) => unknown[];
         }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, Omit<{
-            "update:selected": (value: unknown) => true;
-            "update:activated": (value: unknown) => true;
-            "update:opened": (value: unknown) => true;
-            "click:open": (value: {
+            'update:selected': (value: unknown) => true;
+            'update:activated': (value: unknown) => true;
+            'update:opened': (value: unknown) => true;
+            'click:open': (value: {
                 id: unknown;
                 value: boolean;
                 path: unknown[];
             }) => true;
-            "click:activate": (value: {
+            'click:activate': (value: {
                 id: unknown;
                 value: boolean;
                 path: unknown[];
             }) => true;
-            "click:select": (value: {
+            'click:select': (value: {
                 id: unknown;
                 value: boolean;
                 path: unknown[];
             }) => true;
-        }, "$children" | "v-slots" | "v-slot:default" | "v-slot:append" | "v-slot:prepend" | "items" | "click:open" | "click:select" | "itemChildren" | "itemProps" | "itemTitle" | "itemValue" | "opened" | "selected" | "update:opened" | "update:selected" | "v-slot:divider" | "v-slot:header" | "v-slot:item" | "v-slot:subheader" | "v-slot:subtitle" | "v-slot:title">, string, {
+        }, "$children" | "v-slots" | "v-slot:default" | "v-slot:prepend" | "v-slot:append" | "items" | "selected" | "opened" | "itemValue" | "v-slot:title" | "click:open" | "click:select" | "v-slot:subtitle" | "v-slot:item" | "v-slot:header" | "v-slot:divider" | "v-slot:subheader" | "itemTitle" | "itemChildren" | "itemProps" | "update:selected" | "update:opened">, string, {
+            variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
+            nav: boolean;
             style: import('vue').StyleValue;
+            disabled: boolean;
+            tag: string | import('vuetify/lib/types.mjs').JSXComponent<any>;
+            lines: false | "one" | "two" | "three";
+            mandatory: boolean;
+            returnObject: boolean;
+            selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
             density: import('vuetify/lib/composables/density.mjs').Density;
             rounded: string | number | boolean;
             tile: boolean;
-            tag: string | import('vuetify/lib/types.mjs').JSXComponent<any>;
-            variant: "flat" | "text" | "elevated" | "outlined" | "plain" | "tonal";
-            itemType: import('vuetify/lib/util/helpers.mjs').SelectItemKey;
-            returnObject: boolean;
+            slim: boolean;
+            filterable: boolean;
             activatable: boolean;
             selectable: boolean;
-            selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
             openStrategy: import('vuetify/lib/composables/nested/nested.mjs').OpenStrategyProp;
-            mandatory: boolean;
-            itemsRegistration: import('vuetify/lib/composables/nested/nested.mjs').ItemsRegistrationType;
-            disabled: boolean;
-            filterable: boolean;
-            lines: false | "one" | "three" | "two";
-            slim: boolean;
-            nav: boolean;
+            itemType: import('vuetify/lib/util/helpers.mjs').SelectItemKey;
         }, {}, string, import('vue').SlotsType<Partial<{
-            prepend: (arg: import('vuetify/lib/components/VList/VListItem.mjs').ListItemSlot & {
+            title: (arg: import('vuetify/lib/components/VList/VListItem.mjs').ListItemTitleSlot & {
                 item: any;
             }) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
                 [key: string]: any;
@@ -497,7 +489,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             }) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
                 [key: string]: any;
             }>[];
-            title: (arg: import('vuetify/lib/components/VList/VListItem.mjs').ListItemTitleSlot & {
+            prepend: (arg: import('vuetify/lib/components/VList/VListItem.mjs').ListItemSlot & {
                 item: any;
             }) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
                 [key: string]: any;
@@ -567,79 +559,75 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         $nextTick: typeof nextTick;
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R, args_2: import('@vue/reactivity').OnCleanup) => any : (args_0: any, args_1: any, args_2: import('@vue/reactivity').OnCleanup) => any, options?: import('vue').WatchOptions<boolean> | undefined): import('vue').WatchStopHandle;
     } & Readonly<{
+        variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
+        nav: boolean;
         style: import('vue').StyleValue;
+        disabled: boolean;
+        tag: string | import('vuetify/lib/types.mjs').JSXComponent<any>;
+        lines: false | "one" | "two" | "three";
+        mandatory: boolean;
+        returnObject: boolean;
+        selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
         density: import('vuetify/lib/composables/density.mjs').Density;
         rounded: string | number | boolean;
         tile: boolean;
-        tag: string | import('vuetify/lib/types.mjs').JSXComponent<any>;
-        variant: "flat" | "text" | "elevated" | "outlined" | "plain" | "tonal";
-        itemType: import('vuetify/lib/util/helpers.mjs').SelectItemKey;
-        returnObject: boolean;
+        slim: boolean;
+        filterable: boolean;
         activatable: boolean;
         selectable: boolean;
-        selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
         openStrategy: import('vuetify/lib/composables/nested/nested.mjs').OpenStrategyProp;
-        mandatory: boolean;
-        itemsRegistration: import('vuetify/lib/composables/nested/nested.mjs').ItemsRegistrationType;
-        disabled: boolean;
-        filterable: boolean;
-        lines: false | "one" | "three" | "two";
-        slim: boolean;
-        nav: boolean;
+        itemType: import('vuetify/lib/util/helpers.mjs').SelectItemKey;
     }> & Omit<{
-        style: string | false | import('vue').CSSProperties | import('vue').StyleValue[] | null;
-        density: import('vuetify/lib/composables/density.mjs').Density;
-        tile: boolean;
+        variant: "flat" | "text" | "elevated" | "tonal" | "outlined" | "plain";
+        nav: boolean;
+        style: import('vue').StyleValue;
+        disabled: boolean;
         tag: string | import('vuetify/lib/types.mjs').JSXComponent<any>;
-        variant: "flat" | "text" | "elevated" | "outlined" | "plain" | "tonal";
-        itemType: string | boolean | readonly (string | number)[] | ((item: Record<string, any>, fallback?: any) => any) | null;
+        lines: false | "one" | "two" | "three";
+        mandatory: boolean;
         returnObject: boolean;
+        selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
+        density: import('vuetify/lib/composables/density.mjs').Density;
+        tile: boolean;
+        slim: boolean;
+        filterable: boolean;
         activatable: boolean;
         selectable: boolean;
-        selectStrategy: import('vuetify/lib/composables/nested/nested.mjs').SelectStrategyProp;
         openStrategy: import('vuetify/lib/composables/nested/nested.mjs').OpenStrategyProp;
-        mandatory: boolean;
-        itemsRegistration: import('vuetify/lib/composables/nested/nested.mjs').ItemsRegistrationType;
-        disabled: boolean;
-        filterable: boolean;
-        lines: false | "one" | "three" | "two";
-        slim: boolean;
-        nav: boolean;
+        itemType: import('vuetify/lib/util/helpers.mjs').SelectItemKey;
     } & {
-        theme?: string | undefined;
-        class?: any;
+        height?: string | number | undefined;
+        width?: string | number | undefined;
         border?: string | number | boolean | undefined;
-        elevation?: string | number | undefined;
-        rounded?: string | number | boolean | undefined;
         color?: string | undefined;
-        height?: string | number | undefined;
         maxHeight?: string | number | undefined;
         maxWidth?: string | number | undefined;
         minHeight?: string | number | undefined;
         minWidth?: string | number | undefined;
-        width?: string | number | undefined;
-        valueComparator?: typeof import('vuetify/lib/util/deepEqual.mjs').deepEqual | undefined;
-        activeStrategy?: import('vuetify/lib/composables/nested/nested.mjs').ActiveStrategyProp | undefined;
         activated?: any;
+        class?: any;
+        theme?: string | undefined;
+        elevation?: string | number | undefined;
+        valueComparator?: typeof import('vuetify/lib/util/helpers.mjs').deepEqual | undefined;
+        rounded?: string | number | boolean | undefined;
         baseColor?: string | undefined;
+        bgColor?: string | undefined;
         activeColor?: string | undefined;
         activeClass?: string | undefined;
-        bgColor?: string | undefined;
-        expandIcon?: import('vuetify/lib/composables/icons.mjs').IconValue | undefined;
+        activeStrategy?: import('vuetify/lib/composables/nested/nested.mjs').ActiveStrategyProp | undefined;
         collapseIcon?: import('vuetify/lib/composables/icons.mjs').IconValue | undefined;
-        prependGap?: string | number | undefined;
-        indent?: string | number | undefined;
+        expandIcon?: import('vuetify/lib/composables/icons.mjs').IconValue | undefined;
     } & {
+        "onUpdate:activated"?: ((value: unknown) => any) | undefined;
         "onClick:activate"?: ((value: {
             id: unknown;
             value: boolean;
             path: unknown[];
         }) => any) | undefined;
-        "onUpdate:activated"?: ((value: unknown) => any) | undefined;
-    }, "focus" | "select" | "nav" | "style" | "tag" | "disabled" | "children" | "density" | "rounded" | "tile" | "variant" | "slim" | "itemType" | "returnObject" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "mandatory" | "itemsRegistration" | "filterable" | "lines" | "open" | "parents" | "getPath"> & import('vue').ShallowUnwrapRef<{
+    }, "focus" | "select" | "nav" | "style" | "tag" | "disabled" | "children" | "variant" | "rounded" | "tile" | "density" | "slim" | "itemType" | "returnObject" | "activatable" | "selectable" | "selectStrategy" | "openStrategy" | "mandatory" | "filterable" | "lines" | "open" | "parents" | "getPath"> & import('vue').ShallowUnwrapRef<{
         open: (id: unknown, value: boolean, event?: Event | undefined) => void;
         select: (id: unknown, value: boolean, event?: Event | undefined) => void;
-        focus: (location?: number | "next" | "first" | "last" | "prev" | undefined) => void;
+        focus: (location?: number | "next" | "prev" | "first" | "last" | undefined) => void;
         children: import('vue').Ref<Map<unknown, unknown[]>, Map<unknown, unknown[]>>;
         parents: import('vue').Ref<Map<unknown, unknown>, Map<unknown, unknown>>;
         getPath: (id: unknown) => unknown[];
@@ -664,5 +652,6 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         opened?: unknown;
         "onUpdate:opened"?: ((value: unknown) => void) | undefined;
     }, import('vuetify/lib/components/VList/VListChildren.mjs').VListChildrenSlots<any>>) | null;
+    htmlItemRefs: HTMLSpanElement;
 }, any>;
 export default _default;

package/dist/components/Customs/Selects/SySelect/composables/useSySelectKeyboard.d.ts CHANGED Viewed

@@ -12,9 +12,7 @@ export interface UseSySelectKeyboardOptions {
 export declare function useSySelectKeyboard(options: UseSySelectKeyboardOptions): {
     activeDescendantId: Ref<string, string>;
     lastFocusedIndex: Ref<number, number>;
-    setActiveDescendant: (index: number, options?: {
-        scrollIntoView?: boolean;
-    }) => void;
+    setActiveDescendant: (index: number) => void;
     clearActiveDescendant: () => void;
     findSelectedItemIndex: () => number;
     findItemStartingWith: (char: string) => number;

package/dist/components/Customs/SyCheckbox/SyCheckbox.d.ts CHANGED Viewed

@@ -58,8 +58,8 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<__
     title: string;
     color: string;
     disabled: boolean;
-    density: "default" | "comfortable" | "compact";
     value: undefined;
+    density: "default" | "comfortable" | "compact";
     readonly: boolean;
     id: string;
     name: string;