@descope/flow-components 2.0.38

package/dist/index.d.ts

@@ -0,0 +1,397 @@
+export * from '@descope/web-components-ui';
+import React from 'react';
+
+type KebabCase<S extends string> = S extends `${infer First}${infer Rest}` ? Rest extends Uncapitalize<Rest> ? `${Uncapitalize<First>}${KebabCase<Rest>}` : `${Uncapitalize<First>}-${KebabCase<Rest>}` : S;
+type ComponentSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type TextAlign = 'left' | 'right' | 'center';
+type FlexAlignment = 'start' | 'center' | 'end';
+type HTMLInputAttrs = Omit<JSX.IntrinsicElements['input'], 'size'>;
+type DescopeInputExtraProps = {
+    'full-width'?: boolean;
+    bordered?: boolean;
+    label?: string;
+    placeholder?: string;
+    size?: ComponentSize;
+    'helper-text'?: string;
+    'data-errormessage-pattern-mismatch'?: string;
+    'data-errormessage-value-missing'?: string;
+};
+type DescopeInputProps = HTMLInputAttrs & DescopeInputExtraProps;
+type PropsToAttrs<R extends Record<string, any>> = {
+    [K in keyof R as KebabCase<K & string>]: R[K];
+};
+type TypographyVariants = 'h1' | 'h2' | 'h3' | 'subtitle1' | 'subtitle2' | 'body1' | 'body2';
+type Mode = 'primary' | 'secondary' | 'error' | 'success';
+
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-checkbox': DescopeInputProps;
+        }
+    }
+}
+declare const Checkbox: React.ForwardRefExoticComponent<Omit<DescopeInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-switch-toggle': DescopeInputProps;
+        }
+    }
+}
+declare const Switch: React.ForwardRefExoticComponent<Omit<DescopeInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+type BooleanType = {
+    type: 'switch' | 'checkbox';
+};
+type Props$e = React.ComponentProps<typeof Checkbox> & React.ComponentProps<typeof Switch> & BooleanType;
+declare const Boolean: React.ForwardRefExoticComponent<Omit<Props$e, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-button': React.DetailedHTMLProps<React.HTMLAttributes<HTMLButtonElement>, HTMLButtonElement> & {
+                mode: string;
+            };
+        }
+    }
+}
+declare const Button: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
+    variant?: string;
+    color?: string;
+    size?: string;
+    loading?: boolean;
+    startIcon?: string;
+    startIconColorText?: boolean;
+    'full-width'?: boolean;
+}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+
+type Props$d = {
+    digits?: number;
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-passcode': DescopeInputProps & Props$d;
+        }
+    }
+}
+declare const Code: React.ForwardRefExoticComponent<Omit<HTMLInputAttrs & DescopeInputExtraProps & Props$d, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+type Never<T extends Record<string, any>> = {
+    [K in keyof T]: never;
+};
+type SpaceBetween = '0' | '0.5' | '1' | '1.5' | '2' | '2.5' | '3' | '3.5' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12' | '14' | '16' | '20' | '24' | '28' | '32';
+type Flex = {
+    align?: 'start' | 'end' | 'center' | 'baseline' | 'stretch';
+    justify?: 'start' | 'center' | 'end' | 'between' | 'around' | 'evenly';
+    spaceBetween: SpaceBetween;
+};
+type ContainerAlignment = {
+    'horizontal-alignment'?: FlexAlignment | 'space-between';
+    'vertical-alignment'?: FlexAlignment;
+    'space-between'?: 'sm' | 'md' | 'lg';
+};
+type Props$c = {
+    direction?: 'row' | 'column';
+    shadow?: 'md' | 'lg' | 'xl' | '2xl';
+    'border-radius'?: 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl';
+    paddingX?: string;
+    paddingY?: string;
+    background?: string;
+    width?: string;
+} & ((Flex & Never<ContainerAlignment>) | (ContainerAlignment & Never<Flex>));
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-container': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        }
+    }
+}
+declare const Container: React.ForwardRefExoticComponent<(Props$c & React.HTMLAttributes<HTMLDivElement>) & React.RefAttributes<HTMLDivElement>>;
+
+type Props$b = {
+    vertical?: boolean;
+    italic?: boolean;
+    variant?: TypographyVariants;
+    mode?: Mode;
+    children?: JSX.Element;
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-divider': React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement> & Omit<Props$b, 'children'>;
+        }
+    }
+}
+declare const Divider: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "size"> & Props$b, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+declare const _default$a: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+declare const _default$9: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+declare const _default$8: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+declare const _default$7: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+declare const _default$6: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+declare const _default$5: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+declare const _default$4: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+declare const _default$3: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+declare const _default$2: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+declare const _default$1: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+declare const _default: ({ noColor }: {
+    noColor: any;
+}) => React.JSX.Element;
+
+type Props$a = {
+    width?: number;
+    height?: number;
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-image': React.DetailedHTMLProps<React.HTMLAttributes<HTMLImageElement>, HTMLImageElement> & Props$a;
+        }
+    }
+}
+declare const Image: React.ForwardRefExoticComponent<Props$a & React.HTMLAttributes<HTMLImageElement> & React.RefAttributes<HTMLImageElement>>;
+
+declare const Input: React.ForwardRefExoticComponent<Omit<DescopeInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+type Props$9 = {
+    italic?: boolean;
+    variant?: TypographyVariants;
+    mode?: Mode;
+    textAlign?: TextAlign;
+    'full-width'?: boolean;
+    children?: JSX.Element;
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-link': React.DetailedHTMLProps<React.HTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> & Omit<Props$9, 'children'>;
+        }
+    }
+}
+declare const Link: React.ForwardRefExoticComponent<Props$9 & React.RefAttributes<HTMLAnchorElement>>;
+
+type Props$8 = {
+    variant?: 'linear' | 'radial';
+    size?: 'xs' | 'sm' | 'md' | 'lg';
+    color?: Mode;
+};
+type LoaderType = React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> & PropsToAttrs<Props$8>;
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-loader-linear': LoaderType;
+            'descope-loader-radial': LoaderType;
+        }
+    }
+}
+declare const Loader: React.ForwardRefExoticComponent<Props$8 & React.RefAttributes<HTMLDivElement>>;
+
+type Props$7 = {
+    width?: string;
+    height?: string;
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-logo': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> & PropsToAttrs<Props$7>;
+        }
+    }
+}
+declare const Logo: React.ForwardRefExoticComponent<Props$7 & React.RefAttributes<HTMLDivElement>>;
+
+type Props$6 = {
+    'password-label'?: string;
+    'password-placeholder'?: string;
+    'confirm-label'?: string;
+    'confirm-placeholder'?: string;
+    'has-confirm'?: boolean;
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-new-password': DescopeInputProps & Props$6;
+        }
+    }
+}
+declare const NewPassword: React.ForwardRefExoticComponent<Omit<HTMLInputAttrs & DescopeInputExtraProps & Props$6, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-number-field': DescopeInputProps;
+        }
+    }
+}
+declare const NumberField: React.ForwardRefExoticComponent<Omit<DescopeInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-password-field': DescopeInputProps;
+        }
+    }
+}
+declare const PasswordField: React.ForwardRefExoticComponent<Omit<DescopeInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+type Props$5 = {
+    'default-code'?: string;
+    'phone-input-placeholder'?: string;
+    'country-input-placeholder'?: string;
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-phone-field': DescopeInputProps & Props$5;
+        }
+    }
+}
+declare const Phone: React.ForwardRefExoticComponent<Omit<HTMLInputAttrs & DescopeInputExtraProps & Props$5, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+type Props$4 = {
+    children?: JSX.Element[];
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-combo-box': DescopeInputProps;
+        }
+    }
+}
+declare const Select: React.ForwardRefExoticComponent<Omit<HTMLInputAttrs & DescopeInputExtraProps & Props$4, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+type Props$3 = {
+    italic?: boolean;
+    variant?: string;
+    mode?: string;
+    'full-width'?: boolean;
+    'text-align'?: TextAlign;
+};
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-text': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement> & Props$3;
+        }
+    }
+}
+declare const Text: React.ForwardRefExoticComponent<Omit<Props$3 & {
+    typography?: TypographyVariants;
+} & Omit<React.HTMLProps<HTMLSpanElement>, "mode">, "ref"> & React.RefAttributes<HTMLElement>>;
+
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-text-area': DescopeInputProps;
+        }
+    }
+}
+declare const Textarea: React.ForwardRefExoticComponent<Omit<DescopeInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'descope-text-field': DescopeInputProps;
+        }
+    }
+}
+declare const TextField: React.ForwardRefExoticComponent<Omit<DescopeInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+
+type Props$2 = {
+    varName: string;
+    fallback?: string;
+    width?: number;
+    height?: number;
+    className?: string;
+};
+declare const CssVarImage: React.ForwardRefExoticComponent<Props$2 & React.HTMLAttributes<HTMLImageElement> & React.RefAttributes<HTMLDivElement>>;
+
+type Props$1 = Omit<React.ComponentProps<typeof CssVarImage>, 'varName' | 'fallback'>;
+declare const TOTPImage: React.ForwardRefExoticComponent<Omit<Props$1, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+type Props = Omit<React.ComponentProps<typeof Link>, 'href'>;
+declare const TOTPLink: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+
+type TypographyShallowVariant = {
+    'font-family': string;
+};
+type FontFamily = {
+    label: string;
+    family: string[];
+    url?: string;
+};
+type TypographyVariant = TypographyShallowVariant & {
+    'font-size': string;
+    'font-weight': string;
+};
+type Theme = {
+    components: {
+        'input-border-opacity': '0' | undefined;
+        'container-background-color': string;
+        'button-border-radius': string;
+        'input-background-color': string;
+        'input-label-color': string;
+        'input-color': string;
+        'input-placeholder-color': string;
+        'input-border-radius': string;
+        'primary-text-color': string;
+        'secondary-text-color': string;
+    };
+    colors: {
+        primary: string;
+        secondary: string;
+        error: string;
+        accent: string;
+    };
+    logo: {
+        'logo-url'?: string;
+    };
+    typography: {
+        fontFamilies: [FontFamily, FontFamily];
+        variants: {
+            h1: TypographyVariant;
+            h2: TypographyVariant;
+            h3: TypographyVariant;
+            subtitle1: TypographyVariant;
+            subtitle2: TypographyVariant;
+            body1: TypographyVariant;
+            body2: TypographyVariant;
+            input: TypographyShallowVariant;
+            button: TypographyShallowVariant;
+        };
+    };
+};
+
+declare const generateCssVarsFromTheme: (theme?: Partial<Theme>) => {};
+
+export { Boolean, Button, Checkbox, Code, Container, Divider, Image, Input, Link, Loader, Logo, NewPassword, NumberField, PasswordField, Phone, Select, Switch, TOTPImage, TOTPLink, Text, TextField, Textarea, Theme, _default$a as apple, _default$2 as discord, _default$9 as facebook, _default$8 as fingerprint, _default$6 as github, _default$5 as gitlab, _default$4 as google, _default$1 as linkedin, _default$3 as microsoft, _default$7 as passkey, _default as sso, generateCssVarsFromTheme as themeToCssVars };