@rebnd/ui 0.0.2 → 0.0.4

package/dist/src/components/RButton/utils/button.style.d.ts

@@ -1,100 +1,154 @@
 declare const _default: import('../../../../styled-system/types').RecipeRuntimeFn<{
     color: {
-        error: {
+        primary: {
             backgroundColor: {
-                base: "error";
-                _hover: "error.darker";
+                base: "primary.850";
+                _hover: "primary.800";
+                _on: "primary.pressed";
             };
             outlineColor: {
-                _focus: "error.darker";
+                _focus: "primary.ring";
             };
         };
-        info: {
+        secondary: {
             backgroundColor: {
-                base: "info";
-                _hover: "info.darker";
+                base: "secondary.850";
+                _hover: "secondary.800";
+                _on: "secondary.pressed";
             };
             outlineColor: {
-                _focus: "info.darker";
+                _focus: "secondary.ring";
             };
         };
-        primary: {
+        success: {
             backgroundColor: {
-                base: "primary";
-                _hover: "primary.darker";
+                base: "success.850";
+                _hover: "success.800";
+                _on: "success.pressed";
             };
             outlineColor: {
-                _focus: "primary.darker";
+                _focus: "success.ring";
             };
         };
-        secondary: {
+        warning: {
             backgroundColor: {
-                base: "secondary";
-                _hover: "secondary.darker";
+                base: "warning.850";
+                _hover: "warning.800";
+                _on: "warning.pressed";
             };
             outlineColor: {
-                _focus: "secondary.darker";
+                _focus: "warning.ring";
             };
         };
-        success: {
+        error: {
             backgroundColor: {
-                base: "success";
-                _hover: "success.darker";
+                base: "error.850";
+                _hover: "error.800";
+                _on: "error.pressed";
             };
             outlineColor: {
-                _focus: "success.darker";
+                _focus: "error.ring";
             };
         };
-        warning: {
+        info: {
             backgroundColor: {
-                base: "warning";
-                _hover: "warning.darker";
+                base: "info.850";
+                _hover: "info.800";
+                _on: "info.pressed";
             };
             outlineColor: {
-                _focus: "warning.darker";
+                _focus: "info.ring";
             };
         };
     };
     size: {
         xs: {
-            fontSize: "0.625rem";
             paddingInline: "0.75rem";
-            paddingBlock: "0.375rem";
+            paddingBlock: "vs";
         };
         sm: {
-            fontSize: "0.875rem";
-            paddingInline: "1rem";
+            paddingInline: "sm";
+            paddingBlock: "vs";
         };
         md: {
-            fontSize: "1rem";
             paddingInline: "1.25rem";
+            paddingBlock: "0.625rem";
         };
         lg: {
-            fontSize: "1.125rem";
-            paddingInline: "1.75rem";
+            paddingInline: "md";
+            paddingBlock: "0.75rem";
         };
         xl: {
-            fontSize: "1.25rem";
-            paddingInline: "2rem";
+            paddingInline: "1.75rem";
+            paddingBlock: "0.875rem";
+        };
+    };
+    radius: {
+        sharp: {
+            borderRadius: "sharp";
+        };
+        xs: {
+            borderRadius: "xs";
+        };
+        sm: {
+            borderRadius: "sm";
+        };
+        md: {
+            borderRadius: "md";
+        };
+        lg: {
+            borderRadius: "lg";
+        };
+        pill: {
+            borderRadius: "pill";
         };
     };
     variant: {
-        solid: {
+        ghost: {
+            backgroundColor: {
+                base: "transparent";
+            };
             outline: {
                 base: "none";
             };
         };
-        ghost: {
+        outline: {
             backgroundColor: {
                 base: "transparent";
             };
+        };
+        solid: {
             outline: {
                 base: "none";
             };
         };
-        outlined: {
-            backgroundColor: {
-                base: "transparent";
+        soft: {
+            outline: {
+                base: "none";
+            };
+        };
+        surface: {};
+    };
+    loading: {
+        true: {
+            '& > svg': {
+                animation: "spin 1s linear infinite";
+                visibility: "visible";
+                opacity: number;
+            };
+            '& > span': {
+                visibility: "hidden";
+                opacity: number;
+            };
+        };
+        false: {
+            '& > svg': {
+                visibility: "hidden";
+                opacity: number;
+            };
+            '& > span': {
+                visibility: "visible";
+                opacity: number;
             };
         };
     };

package/dist/src/components/RButtonGroup/RButtonGroup.d.ts

@@ -0,0 +1,62 @@
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    color: {
+        type: import('vue').PropType<import('../../types').Color>;
+        default: import('../../types').Color;
+        validator(color: import('../../types').Color): boolean;
+    };
+    orientation: {
+        type: import('vue').PropType<import('../../types').Orientation>;
+        default: import('../../types').Orientation;
+        validator(orientation: import('../../types').Orientation): boolean;
+    };
+    radius: {
+        type: import('vue').PropType<import('../../types').Rounded>;
+        default: import('../../types').Rounded;
+        validator: (radii: import('../../types').Rounded) => boolean;
+    };
+    size: {
+        type: import('vue').PropType<import('../../types').ButtonSize>;
+        default: import('../../types').ButtonSize;
+        validator(size: import('../../types').ButtonSize): boolean;
+    };
+    variant: {
+        type: import('vue').PropType<import('../../types').Variant>;
+        default: import('../../types').Variant;
+        validator(variant: import('../../types').Variant): boolean;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    color: {
+        type: import('vue').PropType<import('../../types').Color>;
+        default: import('../../types').Color;
+        validator(color: import('../../types').Color): boolean;
+    };
+    orientation: {
+        type: import('vue').PropType<import('../../types').Orientation>;
+        default: import('../../types').Orientation;
+        validator(orientation: import('../../types').Orientation): boolean;
+    };
+    radius: {
+        type: import('vue').PropType<import('../../types').Rounded>;
+        default: import('../../types').Rounded;
+        validator: (radii: import('../../types').Rounded) => boolean;
+    };
+    size: {
+        type: import('vue').PropType<import('../../types').ButtonSize>;
+        default: import('../../types').ButtonSize;
+        validator(size: import('../../types').ButtonSize): boolean;
+    };
+    variant: {
+        type: import('vue').PropType<import('../../types').Variant>;
+        default: import('../../types').Variant;
+        validator(variant: import('../../types').Variant): boolean;
+    };
+}>> & Readonly<{}>, {
+    color: import('../../types').Color;
+    size: import('../../types').ButtonSize;
+    variant: import('../../types').Variant;
+    radius: import('../../types').Rounded;
+    orientation: import('../../types').Orientation;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/src/components/RButtonGroup/utils/button-group.props.d.ts

@@ -0,0 +1,30 @@
+import { PropType } from 'vue';
+import { ButtonSize, Color, Orientation, Rounded, Variant } from '../../../types';
+declare const _default: {
+    color: {
+        type: PropType<Color>;
+        default: Color;
+        validator(color: Color): boolean;
+    };
+    orientation: {
+        type: PropType<Orientation>;
+        default: Orientation;
+        validator(orientation: Orientation): boolean;
+    };
+    radius: {
+        type: PropType<Rounded>;
+        default: Rounded;
+        validator: (radii: Rounded) => boolean;
+    };
+    size: {
+        type: PropType<ButtonSize>;
+        default: ButtonSize;
+        validator(size: ButtonSize): boolean;
+    };
+    variant: {
+        type: PropType<Variant>;
+        default: Variant;
+        validator(variant: Variant): boolean;
+    };
+};
+export default _default;

package/dist/src/components/RButtonGroup/utils/button-group.style.d.ts

@@ -0,0 +1,123 @@
+declare const wrapper: import('../../../../styled-system/types').RecipeRuntimeFn<{
+    color: {
+        primary: {
+            border: "1px solid";
+            borderColor: "primary.border";
+        };
+        secondary: {
+            border: "1px solid";
+            borderColor: "secondary.border";
+        };
+        success: {
+            border: "1px solid";
+            borderColor: "success.border";
+        };
+        warning: {
+            border: "1px solid";
+            borderColor: "warning.border";
+        };
+        error: {
+            border: "1px solid";
+            borderColor: "error.border";
+        };
+        info: {
+            border: "1px solid";
+            borderColor: "info.border";
+        };
+    };
+    orientation: {
+        horizontal: {
+            flexDir: "row";
+        };
+        vertical: {
+            flexDir: "column";
+        };
+    };
+    radius: {
+        sharp: {
+            borderRadius: "sharp";
+        };
+        xs: {
+            borderRadius: "xs";
+            '& > *:first-child': {
+                borderStartStartRadius: "xs";
+                borderEndStartRadius: "xs";
+            };
+            '& > *:last-child': {
+                borderStartEndRadius: "xs";
+                borderEndEndRadius: "xs";
+            };
+            '& > *:not(:first-child):not(:last-child)': {
+                borderRadius: "0";
+            };
+        };
+        sm: {
+            borderRadius: "sm";
+            '& > *:first-child': {
+                borderStartStartRadius: "sm";
+                borderEndStartRadius: "sm";
+            };
+            '& > *:last-child': {
+                borderStartEndRadius: "sm";
+                borderEndEndRadius: "sm";
+            };
+            '& > *:not(:first-child):not(:last-child)': {
+                borderRadius: "0";
+            };
+        };
+        md: {
+            borderRadius: "md";
+            '& > *:first-child': {
+                borderStartStartRadius: "md";
+                borderEndStartRadius: "md";
+            };
+            '& > *:last-child': {
+                borderStartEndRadius: "md";
+                borderEndEndRadius: "md";
+            };
+            '& > *:not(:first-child):not(:last-child)': {
+                borderRadius: "0";
+            };
+        };
+        lg: {
+            borderRadius: "lg";
+            '& > *:first-child': {
+                borderStartStartRadius: "lg";
+                borderEndStartRadius: "lg";
+            };
+            '& > *:last-child': {
+                borderStartEndRadius: "lg";
+                borderEndEndRadius: "lg";
+            };
+            '& > *:not(:first-child):not(:last-child)': {
+                borderRadius: "0";
+            };
+        };
+        pill: {
+            borderRadius: "pill";
+            '& > *:first-child': {
+                borderStartStartRadius: "pill";
+                borderEndStartRadius: "pill";
+            };
+            '& > *:last-child': {
+                borderStartEndRadius: "pill";
+                borderEndEndRadius: "pill";
+            };
+            '& > *:not(:first-child):not(:last-child)': {
+                borderRadius: "0";
+            };
+        };
+    };
+    variant: {
+        ghost: {
+            border: "transparent";
+        };
+        soft: {
+            border: "transparent";
+        };
+        surface: {};
+        solid: {};
+        outline: {};
+    };
+}>;
+export { wrapper };

package/dist/src/components/RCheckbox/RCheckbox.d.ts

@@ -0,0 +1,62 @@
+import { SlotsType, VNode } from 'vue';
+interface Slots {
+    label?: () => VNode[];
+}
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    value: {
+        type: (BooleanConstructor | StringConstructor)[];
+        default: boolean;
+    };
+    modelValue: {
+        type: (ArrayConstructor | BooleanConstructor | StringConstructor)[];
+        default: string;
+    };
+    indeterminate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placement: {
+        type: import('vue').PropType<import('../../types').Placement>;
+        default: import('../../types').Placement;
+        validator: (placement: import('../../types').Placement) => boolean;
+    };
+    radius: {
+        type: import('vue').PropType<import('../../types').Rounded>;
+        default: import('../../types').Rounded;
+        validator: (radii: import('../../types').Rounded) => boolean;
+    };
+}>, () => VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    value: {
+        type: (BooleanConstructor | StringConstructor)[];
+        default: boolean;
+    };
+    modelValue: {
+        type: (ArrayConstructor | BooleanConstructor | StringConstructor)[];
+        default: string;
+    };
+    indeterminate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placement: {
+        type: import('vue').PropType<import('../../types').Placement>;
+        default: import('../../types').Placement;
+        validator: (placement: import('../../types').Placement) => boolean;
+    };
+    radius: {
+        type: import('vue').PropType<import('../../types').Rounded>;
+        default: import('../../types').Rounded;
+        validator: (radii: import('../../types').Rounded) => boolean;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}>, {
+    radius: import('../../types').Rounded;
+    value: string | boolean;
+    placement: import('../../types').Placement;
+    modelValue: string | boolean | unknown[];
+    indeterminate: boolean;
+}, SlotsType<Slots>, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/src/components/RCheckbox/utils/checkbox.props.d.ts

@@ -0,0 +1,27 @@
+import { PropType } from 'vue';
+import { Placement, Rounded } from '../../../types';
+declare const _default: {
+    value: {
+        type: (BooleanConstructor | StringConstructor)[];
+        default: boolean;
+    };
+    modelValue: {
+        type: (ArrayConstructor | BooleanConstructor | StringConstructor)[];
+        default: string;
+    };
+    indeterminate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    placement: {
+        type: PropType<Placement>;
+        default: Placement;
+        validator: (placement: Placement) => boolean;
+    };
+    radius: {
+        type: PropType<Rounded>;
+        default: Rounded;
+        validator: (radii: Rounded) => boolean;
+    };
+};
+export default _default;

package/dist/src/components/RCheckbox/utils/checkbox.style.d.ts

@@ -0,0 +1,38 @@
+declare const control: string;
+declare const checkIcon: string;
+declare const wrapper: import('../../../../styled-system/types').RecipeRuntimeFn<{
+    placement: {
+        before: {
+            flexDirection: "row-reverse";
+            justifyContent: "start";
+        };
+        after: {
+            flexDirection: "row";
+            justifyContent: "end";
+        };
+        hidden: {};
+    };
+}>;
+declare const input: import('../../../../styled-system/types').RecipeRuntimeFn<{
+    radius: {
+        sharp: {
+            borderRadius: "sharp";
+        };
+        xs: {
+            borderRadius: "xs";
+        };
+        sm: {
+            borderRadius: "sm";
+        };
+        md: {
+            borderRadius: "md";
+        };
+        lg: {
+            borderRadius: "lg";
+        };
+        pill: {
+            borderRadius: "pill";
+        };
+    };
+}>;
+export { checkIcon, control, input, wrapper };

package/dist/src/components/RCheckboxGroup/RCheckboxGroup.d.ts

@@ -0,0 +1,80 @@
+import { VNode } from 'vue';
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    legend: {
+        type: StringConstructor;
+        default: string;
+    };
+    modelValue: {
+        type: ArrayConstructor[];
+        required: boolean;
+    };
+    orientation: {
+        type: import('vue').PropType<import('../../types/component.ts').Orientation>;
+        default: import('../../types/component.ts').Orientation;
+        validator: (orientation: import('../../types/component.ts').Orientation) => boolean;
+    };
+    placement: {
+        type: import('vue').PropType<import('../../types/component.ts').Placement>;
+        default: import('../../types/component.ts').Placement;
+        validator: (placement: import('../../types/component.ts').Placement) => boolean;
+    };
+    radius: {
+        type: import('vue').PropType<import('../../types/component.ts').Rounded>;
+        default: import('../../types/component.ts').Rounded;
+        validator: (radii: import('../../types/component.ts').Rounded) => boolean;
+    };
+    showSelectAll: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    variant: {
+        type: import('vue').PropType<import('../../types/component.ts').RadioGroupType>;
+        default: import('../../types/component.ts').RadioGroupType;
+        validator: (variant: import('../../types/component.ts').RadioGroupType) => boolean;
+    };
+}>, () => VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    legend: {
+        type: StringConstructor;
+        default: string;
+    };
+    modelValue: {
+        type: ArrayConstructor[];
+        required: boolean;
+    };
+    orientation: {
+        type: import('vue').PropType<import('../../types/component.ts').Orientation>;
+        default: import('../../types/component.ts').Orientation;
+        validator: (orientation: import('../../types/component.ts').Orientation) => boolean;
+    };
+    placement: {
+        type: import('vue').PropType<import('../../types/component.ts').Placement>;
+        default: import('../../types/component.ts').Placement;
+        validator: (placement: import('../../types/component.ts').Placement) => boolean;
+    };
+    radius: {
+        type: import('vue').PropType<import('../../types/component.ts').Rounded>;
+        default: import('../../types/component.ts').Rounded;
+        validator: (radii: import('../../types/component.ts').Rounded) => boolean;
+    };
+    showSelectAll: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    variant: {
+        type: import('vue').PropType<import('../../types/component.ts').RadioGroupType>;
+        default: import('../../types/component.ts').RadioGroupType;
+        validator: (variant: import('../../types/component.ts').RadioGroupType) => boolean;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}>, {
+    legend: string;
+    variant: import('../../types/component.ts').RadioGroupType;
+    radius: import('../../types/component.ts').Rounded;
+    placement: import('../../types/component.ts').Placement;
+    orientation: import('../../types/component.ts').Orientation;
+    showSelectAll: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/src/components/RCheckboxGroup/utils/checkbox-group.props.d.ts

@@ -0,0 +1,37 @@
+import { PropType } from 'vue';
+import { Orientation, Placement, RadioGroupType, Rounded } from '../../../types';
+declare const _default: {
+    legend: {
+        type: StringConstructor;
+        default: string;
+    };
+    modelValue: {
+        type: ArrayConstructor[];
+        required: boolean;
+    };
+    orientation: {
+        type: PropType<Orientation>;
+        default: Orientation;
+        validator: (orientation: Orientation) => boolean;
+    };
+    placement: {
+        type: PropType<Placement>;
+        default: Placement;
+        validator: (placement: Placement) => boolean;
+    };
+    radius: {
+        type: PropType<Rounded>;
+        default: Rounded;
+        validator: (radii: Rounded) => boolean;
+    };
+    showSelectAll: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    variant: {
+        type: PropType<RadioGroupType>;
+        default: RadioGroupType;
+        validator: (variant: RadioGroupType) => boolean;
+    };
+};
+export default _default;