@speckle/ui-components 2.19.6 → 2.20.2

package/dist/components/form/Button.vue.d.ts

@@ -1,294 +1,157 @@
-import type { PropType } from 'vue';
 import type { PropAnyComponent } from '../../helpers/common/components';
-import type { Nullable, Optional } from '@speckle/shared';
-import type { FormButtonColor, FormButtonTextColor } from '../../helpers/form/button';
-type FormButtonSize = 'xs' | 'sm' | 'base' | 'lg' | 'xl';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+import type { Nullable } from '@speckle/shared';
+import type { FormButtonStyle, FormButtonSize } from '../../helpers/form/button';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
     /**
      * URL to which to navigate - can be a relative (app) path or an absolute link for an external URL
      */
-    to: {
-        type: PropType<Optional<string>>;
-        required: false;
-        default: undefined;
-    };
+    to?: string | undefined;
     /**
-     * Choose from one of many button sizes
+     * Choose from one of 3 button sizes
      */
-    size: {
-        type: PropType<FormButtonSize>;
-        default: string;
-    };
+    size?: FormButtonSize | undefined;
     /**
      * If set, will make the button take up all available space horizontally
      */
-    fullWidth: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Will outline the button.
-     */
-    outlined: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Will apply a rounded class.
-     */
-    rounded: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+    fullWidth?: boolean | undefined;
     /**
      * Similar to "link", but without an underline and possibly in different colors
      */
-    text: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+    text?: boolean | undefined;
     /**
      * Will remove paddings and background. Use for links.
      */
-    link: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+    link?: boolean | undefined;
     /**
-     * Colors:
-     * default: the default primary blue.
-     * invert: for when you want to use this button on a primary background.
-     * danger: for dangerous actions (e.g. deletions).
-     * warning: for less dangerous actions (e.g. archival).
+     * color:
+     * primary: the default primary blue.
+     * outline: foundation background and outline
+     * subtle: no styling
      */
-    color: {
-        type: PropType<FormButtonColor>;
-        default: string;
-    };
+    color?: FormButtonStyle | undefined;
     /**
-     * Text color, only used when color=secondary
+     * Should rounded-full be added?:
      */
-    textColor: {
-        type: PropType<FormButtonTextColor>;
-        default: string;
-    };
+    rounded?: boolean | undefined;
     /**
      * Whether the target location should be forcefully treated as an external URL
      * (for relative paths this will likely cause a redirect)
      */
-    external: {
-        type: PropType<Optional<boolean>>;
-        required: false;
-        default: undefined;
-    };
+    external?: boolean | undefined;
     /**
      * Whether to disable the button so that it can't be pressed
      */
-    disabled: {
-        type: PropType<Optional<boolean>>;
-        required: false;
-        default: undefined;
-    };
+    disabled?: boolean | undefined;
     /**
      * If set, will have type set to "submit" to enable it to submit any parent forms
      */
-    submit: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+    submit?: boolean | undefined;
     /**
      * Add icon to the left from the text
      */
-    iconLeft: {
-        type: PropType<Nullable<PropAnyComponent>>;
-        default: null;
-    };
+    iconLeft?: Nullable<PropAnyComponent> | undefined;
     /**
      * Add icon to the right from the text
      */
-    iconRight: {
-        type: PropType<Nullable<PropAnyComponent>>;
-        default: null;
-    };
+    iconRight?: Nullable<PropAnyComponent> | undefined;
     /**
      * Hide default slot (when you want to show icons only)
      */
-    hideText: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+    hideText?: boolean | undefined;
     /**
      * Customize component to be used when rendering links.
      *
      * The component will try to dynamically resolve NuxtLink and RouterLink and use those, if this is set to null.
      */
-    linkComponent: {
-        type: PropType<Nullable<PropAnyComponent>>;
-        default: null;
-    };
+    linkComponent?: Nullable<PropAnyComponent> | undefined;
     /**
      * Disables the button and shows a spinning loader
      */
-    loading: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    loading?: boolean | undefined;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: (val: MouseEvent) => void;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     /**
      * URL to which to navigate - can be a relative (app) path or an absolute link for an external URL
      */
-    to: {
-        type: PropType<Optional<string>>;
-        required: false;
-        default: undefined;
-    };
+    to?: string | undefined;
     /**
-     * Choose from one of many button sizes
+     * Choose from one of 3 button sizes
      */
-    size: {
-        type: PropType<FormButtonSize>;
-        default: string;
-    };
+    size?: FormButtonSize | undefined;
     /**
      * If set, will make the button take up all available space horizontally
      */
-    fullWidth: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Will outline the button.
-     */
-    outlined: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /**
-     * Will apply a rounded class.
-     */
-    rounded: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+    fullWidth?: boolean | undefined;
     /**
      * Similar to "link", but without an underline and possibly in different colors
      */
-    text: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+    text?: boolean | undefined;
     /**
      * Will remove paddings and background. Use for links.
      */
-    link: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+    link?: boolean | undefined;
     /**
-     * Colors:
-     * default: the default primary blue.
-     * invert: for when you want to use this button on a primary background.
-     * danger: for dangerous actions (e.g. deletions).
-     * warning: for less dangerous actions (e.g. archival).
+     * color:
+     * primary: the default primary blue.
+     * outline: foundation background and outline
+     * subtle: no styling
      */
-    color: {
-        type: PropType<FormButtonColor>;
-        default: string;
-    };
+    color?: FormButtonStyle | undefined;
     /**
-     * Text color, only used when color=secondary
+     * Should rounded-full be added?:
      */
-    textColor: {
-        type: PropType<FormButtonTextColor>;
-        default: string;
-    };
+    rounded?: boolean | undefined;
     /**
      * Whether the target location should be forcefully treated as an external URL
      * (for relative paths this will likely cause a redirect)
      */
-    external: {
-        type: PropType<Optional<boolean>>;
-        required: false;
-        default: undefined;
-    };
+    external?: boolean | undefined;
     /**
      * Whether to disable the button so that it can't be pressed
      */
-    disabled: {
-        type: PropType<Optional<boolean>>;
-        required: false;
-        default: undefined;
-    };
+    disabled?: boolean | undefined;
     /**
      * If set, will have type set to "submit" to enable it to submit any parent forms
      */
-    submit: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+    submit?: boolean | undefined;
     /**
      * Add icon to the left from the text
      */
-    iconLeft: {
-        type: PropType<Nullable<PropAnyComponent>>;
-        default: null;
-    };
+    iconLeft?: Nullable<PropAnyComponent> | undefined;
     /**
      * Add icon to the right from the text
      */
-    iconRight: {
-        type: PropType<Nullable<PropAnyComponent>>;
-        default: null;
-    };
+    iconRight?: Nullable<PropAnyComponent> | undefined;
     /**
      * Hide default slot (when you want to show icons only)
      */
-    hideText: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
+    hideText?: boolean | undefined;
     /**
      * Customize component to be used when rendering links.
      *
      * The component will try to dynamically resolve NuxtLink and RouterLink and use those, if this is set to null.
      */
-    linkComponent: {
-        type: PropType<Nullable<PropAnyComponent>>;
-        default: null;
-    };
+    linkComponent?: Nullable<PropAnyComponent> | undefined;
     /**
      * Disables the button and shows a spinning loader
      */
-    loading: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-}>> & {
+    loading?: boolean | undefined;
+}>>> & {
     onClick?: ((val: MouseEvent) => any) | undefined;
-}, {
-    to: Optional<string>;
-    size: FormButtonSize;
-    fullWidth: boolean;
-    outlined: boolean;
-    rounded: boolean;
-    text: boolean;
-    link: boolean;
-    color: FormButtonColor;
-    textColor: FormButtonTextColor;
-    external: Optional<boolean>;
-    disabled: Optional<boolean>;
-    submit: boolean;
-    iconLeft: Nullable<PropAnyComponent>;
-    iconRight: Nullable<PropAnyComponent>;
-    hideText: boolean;
-    linkComponent: Nullable<PropAnyComponent>;
-    loading: boolean;
-}, {}>, {
+}, {}, {}>, {
     default?(_: {}): any;
 }>;
 export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/components/form/Checkbox.vue.d.ts

@@ -183,10 +183,10 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     disabled: boolean;
     id: Optional<string>;
-    value: Optional<string | true>;
     description: Optional<string>;
     label: Optional<string>;
     modelValue: false | ValueType;
+    value: Optional<string | true>;
     inlineDescription: boolean;
     rules: RuleExpression<ValueType>;
     validateOnMount: boolean;

package/dist/components/form/Radio.vue.d.ts

@@ -197,11 +197,11 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     disabled: boolean;
     id: Optional<string>;
-    value: Optional<string | true>;
     description: Optional<string>;
     label: Optional<string>;
     icon: ConcreteComponent;
     modelValue: false | ValueType;
+    value: Optional<string | true>;
     inlineDescription: boolean;
     rules: RuleExpression<ValueType>;
     validateOnMount: boolean;

package/dist/components/form/TextInput.vue.d.ts

@@ -4,6 +4,7 @@ import type { Optional } from '@speckle/shared';
 import type { PropAnyComponent } from '../../helpers/common/components';
 type InputSize = 'sm' | 'base' | 'lg' | 'xl';
 type InputColor = 'page' | 'foundation' | 'transparent';
+type LabelPosition = 'top' | 'left';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     /**
      * Input "type" value (changes behaviour & look)
@@ -115,14 +116,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-    fullWidth: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
     inputClasses: {
         type: StringConstructor;
         default: null;
     };
+    fullWidth: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     hideErrorMessage: {
         type: BooleanConstructor;
         default: boolean;
@@ -135,6 +136,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: PropType<InputColor>;
         default: string;
     };
+    labelPosition: {
+        type: PropType<LabelPosition>;
+        default: string;
+    };
 }, {
     focus: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -261,14 +266,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-    fullWidth: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
     inputClasses: {
         type: StringConstructor;
         default: null;
     };
+    fullWidth: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     hideErrorMessage: {
         type: BooleanConstructor;
         default: boolean;
@@ -281,6 +286,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         type: PropType<InputColor>;
         default: string;
     };
+    labelPosition: {
+        type: PropType<LabelPosition>;
+        default: string;
+    };
 }>> & {
     onFocus?: (() => any) | undefined;
     onBlur?: (() => any) | undefined;
@@ -299,8 +308,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     fullWidth: boolean;
     color: InputColor;
     disabled: boolean;
-    type: string;
     placeholder: Optional<string>;
+    type: string;
     label: Optional<string>;
     customIcon: Optional<PropAnyComponent>;
     modelValue: string;
@@ -316,6 +325,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     hideErrorMessage: boolean;
     inputClasses: string;
     wrapperClasses: string;
+    labelPosition: LabelPosition;
 }, {}>, {
     "input-right"?(_: {}): any;
 }>;

package/dist/components/form/select/Base.vue.d.ts

@@ -4,8 +4,8 @@ import type { RuleExpression } from 'vee-validate';
 declare const _default: <SingleItem extends string | number | Record<string, unknown>>(__VLS_props: {
     disabled?: Optional<boolean>;
     readonly placeholder?: string | undefined;
-    search?: boolean | undefined;
     readonly label: string;
+    search?: boolean | undefined;
     readonly name: string;
     modelValue?: ([{
         type: PropType<SingleItem | SingleItem[] | undefined>;
@@ -60,8 +60,8 @@ declare const _default: <SingleItem extends string | number | Record<string, unk
     props: {
         disabled?: Optional<boolean>;
         readonly placeholder?: string | undefined;
-        search?: boolean | undefined;
         readonly label: string;
+        search?: boolean | undefined;
         readonly name: string;
         modelValue?: ([{
             type: PropType<SingleItem | SingleItem[] | undefined>;
@@ -120,8 +120,8 @@ declare const _default: <SingleItem extends string | number | Record<string, unk
         props: {
             disabled?: Optional<boolean>;
             readonly placeholder?: string | undefined;
-            search?: boolean | undefined;
             readonly label: string;
+            search?: boolean | undefined;
             readonly name: string;
             modelValue?: ([{
                 type: PropType<SingleItem | SingleItem[] | undefined>;

package/dist/components/layout/Dialog.vue.d.ts

@@ -1,9 +1,12 @@
 import { type LayoutDialogButton } from '../../lib';
 type MaxWidthValue = 'sm' | 'md' | 'lg' | 'xl';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
+type FullscreenValues = 'mobile' | 'desktop' | 'all' | 'none';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     open: boolean;
     maxWidth?: MaxWidthValue | undefined;
+    fullscreen?: FullscreenValues | undefined;
     hideCloser?: boolean | undefined;
+    showBackButton?: boolean | undefined;
     /**
      * Prevent modal from closing when the user clicks outside of the modal or presses Esc
      */
@@ -18,13 +21,18 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
      * If set, the modal will be wrapped in a form element and the `onSubmit` callback will be invoked when the user submits the form
      */
     onSubmit?: ((e: SubmitEvent) => void) | undefined;
+}>, {
+    fullscreen: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:open": (v: boolean) => void;
     "fully-closed": () => void;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+    back: () => void;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     open: boolean;
     maxWidth?: MaxWidthValue | undefined;
+    fullscreen?: FullscreenValues | undefined;
     hideCloser?: boolean | undefined;
+    showBackButton?: boolean | undefined;
     /**
      * Prevent modal from closing when the user clicks outside of the modal or presses Esc
      */
@@ -39,10 +47,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
      * If set, the modal will be wrapped in a form element and the `onSubmit` callback will be invoked when the user submits the form
      */
     onSubmit?: ((e: SubmitEvent) => void) | undefined;
+}>, {
+    fullscreen: string;
 }>>> & {
     "onUpdate:open"?: ((v: boolean) => any) | undefined;
     "onFully-closed"?: (() => any) | undefined;
-}, {}, {}>, {
+    onBack?: (() => any) | undefined;
+}, {
+    fullscreen: FullscreenValues;
+}, {}>, {
     header?(_: {}): any;
     default?(_: {}): any;
     buttons?(_: {}): any;
@@ -57,6 +70,14 @@ type __VLS_TypePropsToRuntimeProps<T> = {
         required: true;
     };
 };
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/components/layout/DialogSection.vue.d.ts

@@ -1,7 +1,7 @@
 import type { PropType } from 'vue';
 import type { PropAnyComponent } from '../../helpers/common/components';
+import type { FormButtonStyle } from '../../helpers/form/button';
 type TitleColor = 'default' | 'danger' | 'warning' | 'success' | 'secondary' | 'info';
-type FormButtonColor = 'default' | 'invert' | 'danger' | 'warning' | 'success' | 'card' | 'secondary' | 'info';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     title: StringConstructor;
     borderT: BooleanConstructor;
@@ -15,7 +15,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         expandContent?: boolean | undefined;
         text: string;
         to?: string | undefined;
-        color: FormButtonColor;
+        color: FormButtonStyle;
         iconRight?: PropAnyComponent | undefined;
         onClick?: (() => void) | undefined;
     } | undefined;
@@ -41,7 +41,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         expandContent?: boolean | undefined;
         text: string;
         to?: string | undefined;
-        color: FormButtonColor;
+        color: FormButtonStyle;
         iconRight?: PropAnyComponent | undefined;
         onClick?: (() => void) | undefined;
     } | undefined;

package/dist/components/layout/Table.vue.d.ts

@@ -1,5 +1,4 @@
 import type { PropAnyComponent } from '../../helpers/common/components';
-import type { FormButtonTextColor } from '../../helpers/form/button';
 export type TableColumn<I> = {
     id: I;
     header: string;
@@ -10,7 +9,6 @@ export interface RowButton<T = unknown> {
     label: string;
     action: (item: T) => void | string;
     class?: string;
-    textColor?: FormButtonTextColor;
 }
 declare const _default: <T extends {
     id: string;

package/dist/components/layout/sidebar/menu/group/Item.vue.d.ts

@@ -1,13 +1,17 @@
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<{
     label: string;
-    to: string;
+    to?: string | undefined;
     tag?: string | undefined;
     external?: boolean | undefined;
+    disabled?: boolean | undefined;
+    tooltipText?: string | undefined;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     label: string;
-    to: string;
+    to?: string | undefined;
     tag?: string | undefined;
     external?: boolean | undefined;
+    disabled?: boolean | undefined;
+    tooltipText?: string | undefined;
 }>>>, {}, {}>, {
     icon?(_: {}): any;
     default?(_: {}): any;

package/dist/composables/user/avatar.d.ts

@@ -12,8 +12,8 @@ export declare function useAvatarSizeClasses(params: {
         size?: UserAvatarSize;
     }>;
 }): {
-    heightClasses: import("vue").ComputedRef<"h-8" | "h-10" | "h-14" | "h-6" | "h-5" | "h-32" | "h-60">;
-    widthClasses: import("vue").ComputedRef<"w-5" | "w-6" | "w-10" | "w-14" | "w-32" | "w-60" | "w-8">;
+    heightClasses: import("vue").ComputedRef<"h-8" | "h-6" | "h-10" | "h-14" | "h-5" | "h-32" | "h-60">;
+    widthClasses: import("vue").ComputedRef<"w-6" | "w-10" | "w-8" | "w-5" | "w-14" | "w-32" | "w-60">;
     sizeClasses: import("vue").ComputedRef<string>;
     iconClasses: import("vue").ComputedRef<"w-5 h-5" | "w-3 h-3" | "w-8 h-8" | "w-10 h-10" | "w-20 h-20" | "w-4 h-4">;
 };

package/dist/helpers/form/button.d.ts

@@ -1,2 +1,2 @@
-export type FormButtonColor = 'default' | 'invert' | 'danger' | 'warning' | 'success' | 'card' | 'secondary' | 'info';
-export type FormButtonTextColor = 'default' | 'primary' | 'warning' | 'success' | 'danger' | 'info';
+export type FormButtonStyle = 'primary' | 'outline' | 'subtle' | 'danger';
+export type FormButtonSize = 'sm' | 'base' | 'lg';

package/dist/helpers/layout/components.d.ts

@@ -40,4 +40,5 @@ export type LayoutDialogButton = {
      */
     id?: string;
 };
+export type LayoutTableColours = 'primary' | 'outline' | 'subtle' | 'danger';
 export {};

package/dist/helpers/tailwind.d.ts

@@ -12,7 +12,7 @@ export declare function markClassesUsed(classes: string[]): void;
  */
 export declare enum TailwindBreakpoints {
     sm = 640,
-    md = 746,
+    md = 768,
     lg = 1024,
     xl = 1280,
     '2xl' = 1536