@qasa/qds-ui 0.11.0 → 0.13.0-next.0

package/dist/esm/types/components/select/select-option.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import type { HTMLQdsProps } from '../../types';
-interface SelectOptionOptions {
-    isDisabled?: boolean;
-}
-type OmittedProps = 'disabled' | 'label';
-export interface SelectOptionProps extends Omit<HTMLQdsProps<'option'>, OmittedProps>, SelectOptionOptions {
-}
-export declare const SelectOption: import("react").ForwardRefExoticComponent<SelectOptionProps & import("react").RefAttributes<HTMLOptionElement>>;
-export {};

package/dist/esm/types/components/select/select.d.ts

@@ -1,25 +0,0 @@
-/// <reference types="react" />
-import type { HTMLQdsProps } from '../../types';
-import type { SelectBaseOptions } from '../primitives/select-base';
-import type { SelectOptionProps } from './select-option';
-interface SelectOptions extends SelectBaseOptions {
-    /**
-     * The label for the select field
-     */
-    label: string;
-    /**
-     * The error message to display if `isInvalid` is `true`
-     */
-    errorMessage?: string;
-    /**
-     * Text that provides additional guidance to the user
-     */
-    helperText?: string;
-}
-type OmittedProps = 'readOnly' | 'size';
-export interface SelectProps extends Omit<HTMLQdsProps<'select'>, OmittedProps>, SelectOptions {
-}
-export declare const Select: import("react").ForwardRefExoticComponent<SelectProps & import("react").RefAttributes<HTMLSelectElement>> & {
-    Option: import("react").ForwardRefExoticComponent<SelectOptionProps & import("react").RefAttributes<HTMLOptionElement>>;
-};
-export type { SelectOptionProps };

package/dist/esm/types/components/spacer/index.d.ts

@@ -1 +0,0 @@
-export * from './spacer';

package/dist/esm/types/components/spacer/spacer.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-import type { Theme } from '../../theme';
-import type { HTMLQdsProps } from '../../types';
-import { type ResponsiveProp } from '../../hooks/use-responsive-prop';
-interface SpacerOptions {
-    axis?: 'x' | 'y';
-    size: ResponsiveProp<keyof Theme['spacing']>;
-}
-export interface SpacerProps extends HTMLQdsProps<'span'>, SpacerOptions {
-}
-export declare const Spacer: import("react").ForwardRefExoticComponent<SpacerProps & import("react").RefAttributes<HTMLSpanElement>>;
-export {};

package/dist/esm/types/components/stack/index.d.ts

@@ -1 +0,0 @@
-export * from './stack';

package/dist/esm/types/components/stack/stack.d.ts

@@ -1,44 +0,0 @@
-import type { ReactNode } from 'react';
-import type { Theme } from '../../theme';
-import type * as Polymorphic from '../../utils/polymorphic';
-import { type ResponsiveProp } from '../../hooks/use-responsive-prop';
-import type { AlignItems, FlexDirection, JustifyContent, FlexWrap } from './stack.types';
-type GapProp = keyof Theme['spacing'];
-interface StackOptions {
-    /**
-     * The direction of the stack.
-     * @default 'column'
-     */
-    direction?: ResponsiveProp<FlexDirection>;
-    /**
-     * The CSS `justify-content` property.
-     * Controls the alignment of items on the main axis.
-     */
-    justifyContent?: JustifyContent;
-    /**
-     * The CSS `align-items` property.
-     * Controls the alignment of items on the cross axis.
-     */
-    alignItems?: AlignItems;
-    /**
-     * The CSS `flex-wrap` property.
-     * Controls whether children can wrap onto multiple lines.
-     * @default 'nowrap'
-     */
-    wrap?: FlexWrap;
-    /**
-     * The gap between each child element.
-     */
-    gap?: ResponsiveProp<GapProp>;
-    /**
-     * A divider element to be rendered between each child element.
-     *
-     * _Note: For the divider to be rendered, the child elements can't be loose strings or numbers.
-     *  Wrap them in a `div` or other element._
-     */
-    divider?: ReactNode;
-}
-type StackComponent = Polymorphic.ForwardRefComponent<'div', StackOptions>;
-export type StackProps = Polymorphic.PropsOf<StackComponent>;
-export declare const Stack: StackComponent;
-export {};

package/dist/esm/types/components/stack/stack.types.d.ts

@@ -1,4 +0,0 @@
-export type AlignItems = 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline';
-export type JustifyContent = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';
-export type FlexDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
-export type FlexWrap = 'wrap' | 'nowrap' | 'wrap-reverse';

package/dist/esm/types/components/stack/stack.utils.d.ts

@@ -1,6 +0,0 @@
-import type { ReactElement, ReactNode } from 'react';
-/**
- * Gets only the valid children of a component,
- * and ignores any nullish or falsy child.
- */
-export declare function getValidChildren(children: ReactNode): ReactElement<any, string | import("react").JSXElementConstructor<any>>[];

package/dist/esm/types/components/switch/index.d.ts

@@ -1 +0,0 @@
-export * from './switch';

package/dist/esm/types/components/switch/switch.d.ts

@@ -1,35 +0,0 @@
-/// <reference types="react" />
-import * as RadixSwitch from '@radix-ui/react-switch';
-interface SwitchOptions {
-    /**
-     * The label for the switch
-     */
-    label: string;
-    /**
-     * The text that appears below the label
-     * to provide additional guidance to the user
-     */
-    helperText?: string;
-    /**
-     * The checked state of the checkbox when it is initially rendered. Use when you do not need to control its checked state.
-     */
-    isDefaultChecked?: boolean;
-    /**
-     * If `true`, the switch will be checked
-     */
-    isChecked?: boolean;
-    /**
-     * If `true`, the switch will be disabled and
-     * cannot be interacted with
-     */
-    isDisabled?: boolean;
-    /**
-     * If `true`, indicates that the switch is required
-     */
-    isRequired?: boolean;
-    onCheckedChange?: (isChecked: boolean) => void;
-}
-interface SwitchProps extends Omit<RadixSwitch.SwitchProps, 'asChild' | keyof SwitchOptions>, SwitchOptions {
-}
-export declare const Switch: import("react").ForwardRefExoticComponent<SwitchProps & import("react").RefAttributes<HTMLButtonElement>>;
-export {};

package/dist/esm/types/components/text-field/index.d.ts

@@ -1 +0,0 @@
-export * from './text-field';

package/dist/esm/types/components/text-field/text-field.d.ts

@@ -1,32 +0,0 @@
-/// <reference types="react" />
-import type { HTMLQdsProps } from '../../types';
-import type { InputBaseOptions } from '../primitives/input-base';
-interface TextFieldOptions extends InputBaseOptions {
-    /**
-     * The label for the input
-     */
-    label: string;
-    /**
-     * The error message to display if `isInvalid` is `true`
-     */
-    errorMessage?: string;
-    /**
-     * If `true`, the input will display an optional indicator.
-     * If the `isRequired` prop is also `true`, this prop will be ignored.
-     */
-    isOptional?: boolean;
-    /**
-     * Text that provides additional guidance to the user
-     */
-    helperText?: string;
-    /**
-     * Suffixed text to display after the input.
-     * This is useful for e.g. displaying units of measurement.
-     */
-    suffix?: string;
-}
-type OmittedProps = 'children' | 'readOnly' | 'size';
-export interface TextFieldProps extends Omit<HTMLQdsProps<'input'>, OmittedProps>, TextFieldOptions {
-}
-export declare const TextField: import("react").ForwardRefExoticComponent<TextFieldProps & import("react").RefAttributes<HTMLInputElement>>;
-export {};

package/dist/esm/types/components/textarea/index.d.ts

@@ -1 +0,0 @@
-export * from './textarea';

package/dist/esm/types/components/textarea/textarea.d.ts

@@ -1,27 +0,0 @@
-/// <reference types="react" />
-import type { HTMLQdsProps } from '../../types';
-import type { TextareaBaseOptions } from '../primitives/textarea-base';
-interface TextareaOptions extends TextareaBaseOptions {
-    /**
-     * The label for the textarea field
-     */
-    label: string;
-    /**
-     * The error message to display if `isInvalid` is `true`
-     */
-    errorMessage?: string;
-    /**
-     * Text that provides additional guidance to the user
-     */
-    helperText?: string;
-    /**
-     * If `true`, the input will display an optional indicator.
-     * If the `isRequired` prop is also `true`, this prop will be ignored.
-     */
-    isOptional?: boolean;
-}
-type OmittedProps = 'children' | 'readOnly' | 'size';
-export interface TextareaProps extends Omit<HTMLQdsProps<'textarea'>, OmittedProps>, TextareaOptions {
-}
-export declare const Textarea: import("react").ForwardRefExoticComponent<TextareaProps & import("react").RefAttributes<HTMLTextAreaElement>>;
-export {};

package/dist/esm/types/components/toast/index.d.ts

@@ -1 +0,0 @@
-export { toast } from './toast-store';

package/dist/esm/types/components/toast/toast-provider.d.ts

@@ -1,4 +0,0 @@
-import type { ReactNode } from 'react';
-export declare function ToastProvider({ children }: {
-    children: ReactNode;
-}): import("react/jsx-runtime").JSX.Element;

package/dist/esm/types/components/toast/toast-store.d.ts

@@ -1,44 +0,0 @@
-import type { ToastVariant } from './toast-styles';
-type Id = number | string;
-interface Toast {
-    id: Id;
-    /**
-     * The text for the toast
-     */
-    text: string;
-    /**
-     * Sets the style variant of the toast, currently supports 'neutral' and 'negative'
-     * @default 'neutral'
-     */
-    variant?: ToastVariant;
-}
-interface ToastOptions {
-    /**
-     * Unique identifier for the toast (can be used for removing it prematurely). If a toast with this
-     * identifier already exists it will be removed before the new toast is added.
-     * @default a random unique id will be set and returned
-     */
-    id?: Id;
-}
-type Subscriber = () => void;
-declare class ToastStore {
-    toasts: Toast[];
-    subscribers: Subscriber[];
-    id: number;
-    constructor();
-    subscribe: (subscriber: Subscriber) => () => void;
-    notify: () => void;
-    add: (toast: Omit<Toast, 'id'> & ToastOptions) => Id;
-    addNeutral: (text: string, options?: ToastOptions) => Id;
-    addError: (text: string, options?: ToastOptions) => Id;
-    remove: (id: Id) => void;
-    removeAll: () => void;
-    getSnapshot: () => Toast[];
-}
-export declare const toastStore: ToastStore;
-export declare const toast: ((text: string, options?: ToastOptions) => Id) & {
-    error: (text: string, options?: ToastOptions) => Id;
-    remove: (id: Id) => void;
-    removeAll: () => void;
-};
-export {};

package/dist/esm/types/components/toast/toast-styles.d.ts

@@ -1,416 +0,0 @@
-import type { VariantProps } from '../../styles';
-export declare const getVariantStyles: (theme: {
-    mediaQueries: {
-        readonly smUp: "@media(min-width: 480px)";
-        readonly mdUp: "@media(min-width: 768px)";
-        readonly lgUp: "@media(min-width: 1024px)";
-        readonly xlUp: "@media(min-width: 1280px)";
-        readonly '2xlUp': "@media(min-width: 1536px)";
-    };
-    spacing: {
-        '0x': string;
-        '1x': string;
-        '2x': string;
-        '3x': string;
-        '4x': string;
-        '5x': string;
-        '6x': string;
-        '8x': string;
-        '10x': string;
-        '12x': string;
-        '14x': string;
-        '16x': string;
-        '20x': string;
-        '24x': string;
-    };
-    breakpoints: {
-        readonly base: 0;
-        readonly sm: 480;
-        readonly md: 768;
-        readonly lg: 1024;
-        readonly xl: 1280;
-        readonly '2xl': 1536;
-    };
-    zIndices: {
-        hide: number;
-        auto: string;
-        base: number;
-        docked: number;
-        dropdown: number;
-        sticky: number;
-        banner: number;
-        overlay: number;
-        modal: number;
-        popover: number;
-        skipLink: number;
-        toast: number;
-        tooltip: number;
-    };
-    colors: {
-        core: {
-            black: string;
-            white: string;
-            gray90: string;
-            gray80: string;
-            gray70: string;
-            gray60: string;
-            gray50: string;
-            gray40: string;
-            gray30: string;
-            gray20: string;
-            gray10: string;
-            pink: string;
-            uiPink: string;
-            uiPinkDark: string;
-            uiPinkLight: string;
-            brown: string;
-            brownDark: string;
-            brownLight: string;
-            offWhite: string;
-            offWhiteDark: string;
-            offWhiteLight: string;
-            softPink: string;
-            warmYellow: string;
-            softYellow: string;
-            red90: string;
-            red80: string;
-            red70: string;
-            red60: string;
-            red50: string;
-            red40: string;
-            red30: string;
-            red20: string;
-            red10: string;
-            green90: string;
-            green80: string;
-            green70: string;
-            green60: string;
-            green50: string;
-            green40: string;
-            green30: string;
-            green20: string;
-            green10: string;
-            blue90: string;
-            blue80: string;
-            blue70: string;
-            blue60: string;
-            blue50: string;
-            blue40: string;
-            blue30: string;
-            blue20: string;
-            blue10: string;
-            yellow90: string;
-            yellow80: string;
-            yellow70: string;
-            yellow60: string;
-            yellow50: string;
-            yellow40: string;
-            yellow30: string;
-            yellow20: string;
-            yellow10: string;
-            blackAlpha20: string;
-        };
-        bg: {
-            default: string;
-            brandPrimary: string;
-            brandPrimaryHover: string;
-            brandPrimaryActive: string;
-            brandSecondary: string;
-            brandSecondaryHover: string;
-            brandSecondaryActive: string;
-            brandTertiary: string;
-            brandTertiaryHover: string;
-            brandTertiaryActive: string;
-            negative: string;
-            warning: string;
-            positive: string;
-            inset: string;
-            backdrop: string;
-        };
-        text: {
-            strong: string;
-            default: string;
-            subtle: string;
-            disabled: string;
-            negative: string;
-            warning: string;
-            positive: string;
-            onBrandPrimary: string;
-            onBrandSecondary: string;
-            onBrandTertiary: string;
-        };
-        icon: {
-            default: string;
-            strong: string;
-            subtle: string;
-            disabled: string;
-            negative: string;
-            warning: string;
-            positive: string;
-            onBrandPrimary: string;
-            onBrandSecondary: string;
-            onBrandTertiary: string;
-        };
-        border: {
-            default: string;
-            defaultHover: string;
-            defaultSelected: string;
-            strong: string;
-            subtle: string;
-            negative: string;
-            warning: string;
-            positive: string;
-        };
-    };
-    sizes: {
-        112: string;
-        128: string;
-        144: string;
-        160: string;
-        176: string;
-        192: string;
-        224: string;
-        256: string;
-        288: string;
-        320: string;
-        384: string;
-        448: string;
-        512: string;
-        576: string;
-        672: string;
-        768: string;
-        896: string;
-        1024: string;
-        '0x': string;
-        '1x': string;
-        '2x': string;
-        '3x': string;
-        '4x': string;
-        '5x': string;
-        '6x': string;
-        '8x': string;
-        '10x': string;
-        '12x': string;
-        '14x': string;
-        '16x': string;
-        '20x': string;
-        '24x': string;
-    };
-    radii: {
-        none: string;
-        '2xs': string;
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-        '2xl': string;
-        full: string;
-    };
-    shadows: {
-        none: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
-    typography: {
-        display: {
-            '3xl': {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-                fontFeatureSettings: string;
-            };
-            '2xl': {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-                fontFeatureSettings: string;
-            };
-            xl: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-                fontFeatureSettings: string;
-            };
-            lg: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-                fontFeatureSettings: string;
-            };
-            md: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-                fontFeatureSettings: string;
-            };
-            sm: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-                fontFeatureSettings: string;
-            };
-            xs: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-                fontFeatureSettings: string;
-            };
-        };
-        title: {
-            lg: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            md: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            sm: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            xs: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            '2xs': {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            '3xs': {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-        };
-        body: {
-            xl: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            lg: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            md: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            sm: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            xs: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-        };
-        label: {
-            md: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            sm: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-        };
-        button: {
-            md: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            sm: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-        };
-        caption: {
-            md: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-            sm: {
-                fontFamily: string;
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-            };
-        };
-    };
-}) => {
-    neutral: {
-        background: string;
-        color: string;
-    };
-    error: {
-        background: string;
-        color: string;
-    };
-};
-export type ToastVariant = VariantProps<typeof getVariantStyles>;