@propelinc/citrus-ui 0.6.0 → 1.0.0

package/dist/components/CTextField.vue.d.ts

@@ -0,0 +1,647 @@
+import { PropType, Ref, StyleValue, DefineComponent, ExtractPropTypes, ComputedRef, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { Rules } from '../composables/validations';
+import { IconDefinition } from '@fortawesome/pro-regular-svg-icons';
+import { ButtonLevel, ButtonSize, ButtonVariant, ButtonIconPosition, ButtonShoelaceVariant } from './CButton/types';
+import { RouteLocationRaw, RouteLocationAsRelativeGeneric, RouteLocationAsPathGeneric } from 'vue-router';
+import { FontAwesomeIconProps } from '@fortawesome/vue-fontawesome';
+export interface CTextFieldExposed {
+    input: Ref<HTMLInputElement | null>;
+    focus: () => void;
+    blur: () => void;
+    startValidating: () => void;
+}
+declare const _default: DefineComponent<ExtractPropTypes<{
+    id: {
+        type: PropType<string | null>;
+        default: null;
+    };
+    label: {
+        type: PropType<string | null>;
+        default: null;
+    };
+    ariaLabel: {
+        type: PropType<string | null>;
+        default: null;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    type: {
+        type: PropType<"text" | "password" | "email" | "tel" | "url" | "search" | "number" | "decimal" | "numeric">;
+        default: string;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    size: {
+        type: PropType<"medium" | "large">;
+        default: string;
+    };
+    inputmode: {
+        type: PropType<"text" | "search" | "none" | "tel" | "url" | "email" | "numeric" | "decimal">;
+        default: undefined;
+    };
+    minlength: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: undefined;
+    };
+    maxlength: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideLabel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideDetails: {
+        type: PropType<boolean | "auto">;
+        default: boolean;
+    };
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+    dataTest: {
+        type: StringConstructor;
+        default: string;
+    };
+    counter: {
+        type: PropType<number | null>;
+        default: null;
+    };
+    counterValue: {
+        type: PropType<number | (() => number | null)>;
+        default: null;
+    };
+    rules: {
+        type: PropType<Rules<string>>;
+        default: () => never[];
+    };
+    validateOnBlur: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Overrides the default validation message. If provided, this error message will always
+     * be shown, regardless of any other failing validation rules.
+     */
+    errorMessage: {
+        type: StringConstructor;
+        default: null;
+    };
+}>, {
+    faXmark: IconDefinition;
+    faEye: IconDefinition;
+    faEyeSlash: IconDefinition;
+    fallthroughAttrs: ComputedRef<{
+        [x: string]: unknown;
+    }>;
+    hideToggleAriaLabel: ComputedRef<string>;
+    idWithFallback: Ref<string, string>;
+    input: Ref<HTMLInputElement | null, HTMLInputElement | null>;
+    inputHidden: Ref<boolean, boolean>;
+    inputType: ComputedRef<"number" | "text" | "search" | "email" | "password" | "tel" | "url" | "decimal" | "numeric">;
+    inputValue: Ref<string, string>;
+    isFocused: Ref<boolean, boolean>;
+    messageSlotHasContent: Ref<boolean, boolean>;
+    prefixSlotHasContent: Ref<boolean, boolean>;
+    rootStyles: ComputedRef<StyleValue>;
+    suffixSlotHasContent: Ref<boolean, boolean>;
+    isValidationValid: Ref<boolean | null, boolean | null>;
+    validationMessage: Ref<string | null, string | null>;
+    clearInput: () => void;
+    onBlur: (event: Event) => void;
+    onChange: (event: Event) => void;
+    onFocus: (event: Event) => void;
+    onInput: (event: Event) => void;
+    toggleHidden: () => void;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ("change" | "input" | "focus" | "blur" | "click" | "keydown" | "keypress" | "keyup" | "click:hide")[], "change" | "input" | "focus" | "blur" | "click" | "keydown" | "keypress" | "keyup" | "click:hide", PublicProps, Readonly< ExtractPropTypes<{
+    id: {
+        type: PropType<string | null>;
+        default: null;
+    };
+    label: {
+        type: PropType<string | null>;
+        default: null;
+    };
+    ariaLabel: {
+        type: PropType<string | null>;
+        default: null;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    type: {
+        type: PropType<"text" | "password" | "email" | "tel" | "url" | "search" | "number" | "decimal" | "numeric">;
+        default: string;
+    };
+    clearable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    size: {
+        type: PropType<"medium" | "large">;
+        default: string;
+    };
+    inputmode: {
+        type: PropType<"text" | "search" | "none" | "tel" | "url" | "email" | "numeric" | "decimal">;
+        default: undefined;
+    };
+    minlength: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: undefined;
+    };
+    maxlength: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideLabel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hideDetails: {
+        type: PropType<boolean | "auto">;
+        default: boolean;
+    };
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+    dataTest: {
+        type: StringConstructor;
+        default: string;
+    };
+    counter: {
+        type: PropType<number | null>;
+        default: null;
+    };
+    counterValue: {
+        type: PropType<number | (() => number | null)>;
+        default: null;
+    };
+    rules: {
+        type: PropType<Rules<string>>;
+        default: () => never[];
+    };
+    validateOnBlur: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Overrides the default validation message. If provided, this error message will always
+     * be shown, regardless of any other failing validation rules.
+     */
+    errorMessage: {
+        type: StringConstructor;
+        default: null;
+    };
+}>> & Readonly<{
+    onChange?: ((...args: any[]) => any) | undefined;
+    onFocus?: ((...args: any[]) => any) | undefined;
+    onBlur?: ((...args: any[]) => any) | undefined;
+    onInput?: ((...args: any[]) => any) | undefined;
+    onKeydown?: ((...args: any[]) => any) | undefined;
+    onKeypress?: ((...args: any[]) => any) | undefined;
+    onKeyup?: ((...args: any[]) => any) | undefined;
+    onClick?: ((...args: any[]) => any) | undefined;
+    "onClick:hide"?: ((...args: any[]) => any) | undefined;
+}>, {
+    type: "number" | "text" | "search" | "email" | "password" | "tel" | "url" | "decimal" | "numeric";
+    label: string | null;
+    id: string | null;
+    value: string;
+    size: "large" | "medium";
+    dataTest: string;
+    placeholder: string;
+    disabled: boolean;
+    ariaLabel: string | null;
+    rules: Rules<string>;
+    required: boolean;
+    hideDetails: boolean | "auto";
+    counter: number | null;
+    counterValue: number | (() => number | null);
+    clearable: boolean;
+    inputmode: "text" | "search" | "none" | "email" | "tel" | "url" | "decimal" | "numeric";
+    minlength: string | number;
+    maxlength: string | number;
+    hideable: boolean;
+    hideLabel: boolean;
+    validateOnBlur: boolean;
+    errorMessage: string;
+}, {}, {
+    CFormFieldCounter: DefineComponent<ExtractPropTypes<{
+        counter: {
+            type: PropType<number | null>;
+            default: null;
+        };
+        counterValue: {
+            type: PropType<number | (() => number | null)>;
+            default: null;
+        };
+        value: {
+            type: StringConstructor;
+            default: string;
+        };
+    }>, {
+        numerator: ComputedRef<number | null>;
+        displayText: ComputedRef<string>;
+    }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly< ExtractPropTypes<{
+        counter: {
+            type: PropType<number | null>;
+            default: null;
+        };
+        counterValue: {
+            type: PropType<number | (() => number | null)>;
+            default: null;
+        };
+        value: {
+            type: StringConstructor;
+            default: string;
+        };
+    }>> & Readonly<{}>, {
+        value: string;
+        counter: number | null;
+        counterValue: number | (() => number | null);
+    }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+    CIconButton: DefineComponent<ExtractPropTypes<{
+        ariaLabel: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        ariaLabelledby: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        href: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        icon: {
+            type: PropType<string | string[] | IconDefinition>;
+            default: undefined;
+        };
+        large: {
+            type: BooleanConstructor;
+            default: boolean;
+            deprecated: boolean;
+        };
+        level: {
+            type: PropType< ButtonLevel>;
+            default: string;
+        };
+        loading: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        secondary: {
+            type: BooleanConstructor;
+            default: boolean;
+            deprecated: boolean;
+        };
+        size: {
+            type: PropType< ButtonSize>;
+            default: string;
+        };
+        spinIcon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        target: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        tertiary: {
+            type: BooleanConstructor;
+            default: boolean;
+            deprecated: boolean;
+        };
+        to: {
+            type: PropType< RouteLocationRaw>;
+            default: undefined;
+        };
+        variant: {
+            type: PropType< ButtonVariant>;
+            default: string;
+        };
+    }>, {
+        computedSize: ComputedRef<ButtonSize>;
+        computedVariant: ComputedRef<ButtonVariant>;
+        inheritColor: Ref<boolean, boolean> | undefined;
+    }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ("focus" | "blur" | "click")[], "focus" | "blur" | "click", PublicProps, Readonly< ExtractPropTypes<{
+        ariaLabel: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        ariaLabelledby: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        href: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        icon: {
+            type: PropType<string | string[] | IconDefinition>;
+            default: undefined;
+        };
+        large: {
+            type: BooleanConstructor;
+            default: boolean;
+            deprecated: boolean;
+        };
+        level: {
+            type: PropType< ButtonLevel>;
+            default: string;
+        };
+        loading: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        secondary: {
+            type: BooleanConstructor;
+            default: boolean;
+            deprecated: boolean;
+        };
+        size: {
+            type: PropType< ButtonSize>;
+            default: string;
+        };
+        spinIcon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        target: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        tertiary: {
+            type: BooleanConstructor;
+            default: boolean;
+            deprecated: boolean;
+        };
+        to: {
+            type: PropType< RouteLocationRaw>;
+            default: undefined;
+        };
+        variant: {
+            type: PropType< ButtonVariant>;
+            default: string;
+        };
+    }>> & Readonly<{
+        onFocus?: ((...args: any[]) => any) | undefined;
+        onBlur?: ((...args: any[]) => any) | undefined;
+        onClick?: ((...args: any[]) => any) | undefined;
+    }>, {
+        to: string | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric;
+        size: ButtonSize;
+        icon: string | string[] | IconDefinition;
+        target: string;
+        tertiary: boolean;
+        loading: boolean;
+        large: boolean;
+        disabled: boolean;
+        ariaLabel: string;
+        secondary: boolean;
+        href: string;
+        level: ButtonLevel;
+        variant: ButtonVariant;
+        ariaLabelledby: string;
+        spinIcon: boolean;
+    }, {}, {
+        FontAwesomeIcon: DefineComponent<FontAwesomeIconProps>;
+        CButton: DefineComponent<ExtractPropTypes<{
+            block: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            href: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            icon: {
+                type: PropType<string | string[] | IconDefinition>;
+                default: undefined;
+            };
+            iconPosition: {
+                type: PropType< ButtonIconPosition>;
+                default: string;
+                validator: (value: string) => boolean;
+            };
+            large: {
+                type: BooleanConstructor;
+                default: boolean;
+                deprecated: boolean;
+            };
+            level: {
+                type: PropType< ButtonLevel>;
+                default: string;
+                validator: (value: string) => boolean;
+            };
+            loading: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            secondary: {
+                type: BooleanConstructor;
+                default: boolean;
+                deprecated: boolean;
+            };
+            size: {
+                type: PropType< ButtonSize>;
+                default: string;
+                validator: (value: string) => boolean;
+            };
+            target: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            tertiary: {
+                type: BooleanConstructor;
+                default: boolean;
+                deprecated: boolean;
+            };
+            to: {
+                type: PropType< RouteLocationRaw>;
+                default: undefined;
+            };
+            variant: {
+                type: PropType< ButtonVariant>;
+                default: string;
+                validator: (value: string) => boolean;
+            };
+        }>, {
+            animationListeners: Record<string, () => void>;
+            button: Ref<HTMLElement | null, HTMLElement | null>;
+            computedSize: ComputedRef<ButtonSize>;
+            computedVariant: ComputedRef<ButtonVariant>;
+            dataBlock: ComputedRef<true | undefined>;
+            dataLoading: ComputedRef<true | undefined>;
+            hasIcon: ComputedRef<boolean>;
+            injectedOrPropBlock: ComputedRef<boolean>;
+            injectedOrPropsLarge: ComputedRef<boolean>;
+            onClick: (event: MouseEvent) => void;
+            routerDestinationOrHref: ComputedRef<string | undefined>;
+            shoelaceVariant: ComputedRef<ButtonShoelaceVariant>;
+        }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ("focus" | "blur" | "click")[], "focus" | "blur" | "click", PublicProps, Readonly< ExtractPropTypes<{
+            block: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            href: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            icon: {
+                type: PropType<string | string[] | IconDefinition>;
+                default: undefined;
+            };
+            iconPosition: {
+                type: PropType< ButtonIconPosition>;
+                default: string;
+                validator: (value: string) => boolean;
+            };
+            large: {
+                type: BooleanConstructor;
+                default: boolean;
+                deprecated: boolean;
+            };
+            level: {
+                type: PropType< ButtonLevel>;
+                default: string;
+                validator: (value: string) => boolean;
+            };
+            loading: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            secondary: {
+                type: BooleanConstructor;
+                default: boolean;
+                deprecated: boolean;
+            };
+            size: {
+                type: PropType< ButtonSize>;
+                default: string;
+                validator: (value: string) => boolean;
+            };
+            target: {
+                type: StringConstructor;
+                default: undefined;
+            };
+            tertiary: {
+                type: BooleanConstructor;
+                default: boolean;
+                deprecated: boolean;
+            };
+            to: {
+                type: PropType< RouteLocationRaw>;
+                default: undefined;
+            };
+            variant: {
+                type: PropType< ButtonVariant>;
+                default: string;
+                validator: (value: string) => boolean;
+            };
+        }>> & Readonly<{
+            onFocus?: ((...args: any[]) => any) | undefined;
+            onBlur?: ((...args: any[]) => any) | undefined;
+            onClick?: ((...args: any[]) => any) | undefined;
+        }>, {
+            to: string | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric;
+            size: ButtonSize;
+            icon: string | string[] | IconDefinition;
+            target: string;
+            tertiary: boolean;
+            loading: boolean;
+            block: boolean;
+            large: boolean;
+            disabled: boolean;
+            secondary: boolean;
+            href: string;
+            iconPosition: ButtonIconPosition;
+            level: ButtonLevel;
+            variant: ButtonVariant;
+        }, {}, {
+            FontAwesomeIcon: DefineComponent<FontAwesomeIconProps>;
+        }, {}, string, ComponentProvideOptions, true, {}, any>;
+    }, {}, string, ComponentProvideOptions, true, {}, any>;
+    CValidationMessage: DefineComponent<ExtractPropTypes<{
+        dataTest: {
+            type: StringConstructor;
+            default: string;
+        };
+        validationMessage: {
+            type: PropType<string | null>;
+            default: null;
+        };
+        hide: {
+            type: PropType<boolean | "auto">;
+            default: boolean;
+        };
+    }>, {
+        isHidden: ComputedRef<boolean>;
+    }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly< ExtractPropTypes<{
+        dataTest: {
+            type: StringConstructor;
+            default: string;
+        };
+        validationMessage: {
+            type: PropType<string | null>;
+            default: null;
+        };
+        hide: {
+            type: PropType<boolean | "auto">;
+            default: boolean;
+        };
+    }>> & Readonly<{}>, {
+        dataTest: string;
+        validationMessage: string | null;
+        hide: boolean | "auto";
+    }, {}, {
+        CFadeTransition: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+    }, {}, string, ComponentProvideOptions, true, {}, any>;
+}, {}, string, ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/CTextLink.vue.d.ts

@@ -0,0 +1,55 @@
+import { PropType, DefineComponent, ExtractPropTypes, ComputedRef, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { RouteLocationRaw, RouteLocationAsRelativeGeneric, RouteLocationAsPathGeneric } from 'vue-router';
+declare const _default: DefineComponent<ExtractPropTypes<{
+    /** Controls whether the text link functions as a router-link */
+    to: {
+        type: PropType<RouteLocationRaw>;
+        default: undefined;
+    };
+    /** Designates the text link as an anchor and applies the href attribute */
+    href: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /** Designates the target attribute. Only use with the href prop. */
+    target: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /** Toggles whether the link should have an underline */
+    underline: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {
+    isRoleButton: ComputedRef<boolean>;
+    navigate: (event: MouseEvent) => Promise<void>;
+    routerDestinationOrHref: ComputedRef<string | undefined>;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly< ExtractPropTypes<{
+    /** Controls whether the text link functions as a router-link */
+    to: {
+        type: PropType<RouteLocationRaw>;
+        default: undefined;
+    };
+    /** Designates the text link as an anchor and applies the href attribute */
+    href: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /** Designates the target attribute. Only use with the href prop. */
+    target: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    /** Toggles whether the link should have an underline */
+    underline: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    to: string | RouteLocationAsRelativeGeneric | RouteLocationAsPathGeneric;
+    target: string;
+    href: string;
+    underline: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+export default _default;