@cognitiv/components-web 1.0.4 → 1.1.0

package/dist/components/spinner/index.js

@@ -0,0 +1,12 @@
+"use strict";
+import { SpinnerRoot } from './spinner.js';
+export { spinnerVariants } from './styles.js';
+
+/* -------------------------------------------------------------------------------------------------
+ * Compound Component
+ * -----------------------------------------------------------------------------------------------*/
+const Spinner = Object.assign(SpinnerRoot, {
+  Root: SpinnerRoot
+});
+
+export { Spinner, SpinnerRoot };

package/dist/components/spinner/spinner.d.ts

@@ -0,0 +1,7 @@
+import type { SpinnerVariants } from "./styles";
+import type { ComponentPropsWithRef } from "react";
+interface SpinnerRootProps extends Omit<ComponentPropsWithRef<"svg">, "display" | "opacity" | "color">, SpinnerVariants {
+}
+declare const SpinnerRoot: ({ className, color, size, ...props }: SpinnerRootProps) => import("react/jsx-runtime").JSX.Element;
+export { SpinnerRoot };
+export type { SpinnerRootProps };

package/dist/components/spinner/spinner.js

@@ -0,0 +1,88 @@
+"use client";
+import { useId } from 'react';
+import { spinnerVariants } from './styles.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+const SpinnerPrimitive = ({
+  ...props
+}) => {
+  const id = useId();
+  return /*#__PURE__*/jsxs("svg", {
+    "data-slot": "spinner-icon",
+    viewBox: "0 0 24 24",
+    ...props,
+    children: [/*#__PURE__*/jsxs("defs", {
+      children: [/*#__PURE__*/jsxs("linearGradient", {
+        id: `«data-slot-icon-def-1»-${id}`,
+        x1: "50%",
+        x2: "50%",
+        y1: "5.271%",
+        y2: "91.793%",
+        children: [/*#__PURE__*/jsx("stop", {
+          offset: "0%",
+          stopColor: "currentColor"
+        }), /*#__PURE__*/jsx("stop", {
+          offset: "100%",
+          stopColor: "currentColor",
+          stopOpacity: 0.55
+        })]
+      }), /*#__PURE__*/jsxs("linearGradient", {
+        id: `«data-slot-icon-def-2»-${id}`,
+        x1: "50%",
+        x2: "50%",
+        y1: "15.24%",
+        y2: "87.15%",
+        children: [/*#__PURE__*/jsx("stop", {
+          offset: "0%",
+          stopColor: "currentColor",
+          stopOpacity: 0
+        }), /*#__PURE__*/jsx("stop", {
+          offset: "100%",
+          stopColor: "currentColor",
+          stopOpacity: 0.55
+        })]
+      })]
+    }), /*#__PURE__*/jsxs("g", {
+      fill: "none",
+      children: [/*#__PURE__*/jsx("path", {
+        d: "m12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035q-.016-.005-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093q.019.005.029-.008l.004-.014l-.034-.614q-.005-.018-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z"
+      }), /*#__PURE__*/jsx("path", {
+        d: "M8.749.021a1.5 1.5 0 0 1 .497 2.958A7.5 7.5 0 0 0 3 10.375a7.5 7.5 0 0 0 7.5 7.5v3c-5.799 0-10.5-4.7-10.5-10.5C0 5.23 3.726.865 8.749.021",
+        fill: `url(#«data-slot-icon-def-1»-${id})`,
+        transform: "translate(1.5 1.625)"
+      }), /*#__PURE__*/jsx("path", {
+        d: "M15.392 2.673a1.5 1.5 0 0 1 2.119-.115A10.48 10.48 0 0 1 21 10.375c0 5.8-4.701 10.5-10.5 10.5v-3a7.5 7.5 0 0 0 5.007-13.084a1.5 1.5 0 0 1-.115-2.118",
+        fill: `url(#«data-slot-icon-def-2»-${id})`,
+        transform: "translate(1.5 1.625)"
+      })]
+    })]
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Spinner Root
+ * -----------------------------------------------------------------------------------------------*/
+
+const SpinnerRoot = ({
+  className,
+  color,
+  size,
+  ...props
+}) => {
+  return /*#__PURE__*/jsx("span", {
+    "data-slot": "spinner",
+    className: spinnerVariants({
+      className,
+      color,
+      size
+    }),
+    children: /*#__PURE__*/jsx(SpinnerPrimitive, {
+      "aria-hidden": true,
+      "aria-label": "Loading",
+      role: "presentation",
+      ...props
+    })
+  });
+};
+
+export { SpinnerRoot };

package/dist/components/spinner/styles.d.ts

@@ -0,0 +1,45 @@
+import type { VariantProps } from "tailwind-variants";
+export declare const spinnerVariants: import("tailwind-variants").TVReturnType<{
+    color: {
+        accent: string;
+        current: string;
+        danger: string;
+        success: string;
+        warning: string;
+    };
+    size: {
+        lg: string;
+        md: string;
+        sm: string;
+        xl: string;
+    };
+}, undefined, "spinner", {
+    color: {
+        accent: string;
+        current: string;
+        danger: string;
+        success: string;
+        warning: string;
+    };
+    size: {
+        lg: string;
+        md: string;
+        sm: string;
+        xl: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    color: {
+        accent: string;
+        current: string;
+        danger: string;
+        success: string;
+        warning: string;
+    };
+    size: {
+        lg: string;
+        md: string;
+        sm: string;
+        xl: string;
+    };
+}, undefined, "spinner", unknown, unknown, undefined>>;
+export type SpinnerVariants = VariantProps<typeof spinnerVariants>;

package/dist/components/spinner/styles.js

@@ -0,0 +1,27 @@
+"use strict";
+import { tv } from 'tailwind-variants';
+
+const spinnerVariants = tv({
+  base: "spinner",
+  defaultVariants: {
+    color: "accent",
+    size: "md"
+  },
+  variants: {
+    color: {
+      accent: "spinner--accent",
+      current: "spinner--current",
+      danger: "spinner--danger",
+      success: "spinner--success",
+      warning: "spinner--warning"
+    },
+    size: {
+      lg: "spinner--lg",
+      md: "spinner--md",
+      sm: "spinner--sm",
+      xl: "spinner--xl"
+    }
+  }
+});
+
+export { spinnerVariants };

package/dist/components/surface/index.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentProps } from "react";
+import { SurfaceRoot } from "./surface";
+export declare const Surface: (({ children, className, variant, ...rest }: import("./surface").SurfaceRootProps) => import("react/jsx-runtime").JSX.Element) & {
+    Root: ({ children, className, variant, ...rest }: import("./surface").SurfaceRootProps) => import("react/jsx-runtime").JSX.Element;
+};
+export type Surface = {
+    Props: ComponentProps<typeof SurfaceRoot>;
+    RootProps: ComponentProps<typeof SurfaceRoot>;
+};
+export { SurfaceRoot } from "./surface";
+export type { SurfaceRootProps, SurfaceRootProps as SurfaceProps } from "./surface";
+export { SurfaceContext } from "./surface";
+export { surfaceVariants } from "./styles";
+export type { SurfaceVariants } from "./styles";

package/dist/components/surface/index.js

@@ -0,0 +1,13 @@
+"use strict";
+import { SurfaceRoot } from './surface.js';
+export { SurfaceContext } from './surface.js';
+export { surfaceVariants } from './styles.js';
+
+/* -------------------------------------------------------------------------------------------------
+ * Compound Component
+ * -----------------------------------------------------------------------------------------------*/
+const Surface = Object.assign(SurfaceRoot, {
+  Root: SurfaceRoot
+});
+
+export { Surface, SurfaceRoot };

package/dist/components/surface/styles.d.ts

@@ -0,0 +1,24 @@
+import type { VariantProps } from "tailwind-variants";
+export declare const surfaceVariants: import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string;
+        secondary: string;
+        tertiary: string;
+        transparent: string;
+    };
+}, undefined, "surface", {
+    variant: {
+        default: string;
+        secondary: string;
+        tertiary: string;
+        transparent: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string;
+        secondary: string;
+        tertiary: string;
+        transparent: string;
+    };
+}, undefined, "surface", unknown, unknown, undefined>>;
+export type SurfaceVariants = VariantProps<typeof surfaceVariants>;

package/dist/components/surface/styles.js

@@ -0,0 +1,19 @@
+"use strict";
+import { tv } from 'tailwind-variants';
+
+const surfaceVariants = tv({
+  base: "surface",
+  defaultVariants: {
+    variant: "default"
+  },
+  variants: {
+    variant: {
+      default: "surface--default",
+      secondary: "surface--secondary",
+      tertiary: "surface--tertiary",
+      transparent: "surface--transparent"
+    }
+  }
+});
+
+export { surfaceVariants };

package/dist/components/surface/surface.d.ts

@@ -0,0 +1,12 @@
+import type { SurfaceVariants } from "./styles";
+import type { ComponentPropsWithRef } from "react";
+import React from "react";
+type SurfaceContext = {
+    variant?: SurfaceVariants["variant"];
+};
+declare const SurfaceContext: React.Context<SurfaceContext>;
+interface SurfaceRootProps extends ComponentPropsWithRef<"div">, SurfaceVariants {
+}
+declare const SurfaceRoot: ({ children, className, variant, ...rest }: SurfaceRootProps) => import("react/jsx-runtime").JSX.Element;
+export { SurfaceRoot, SurfaceContext };
+export type { SurfaceRootProps };

package/dist/components/surface/surface.js

@@ -0,0 +1,34 @@
+"use client";
+import { createContext } from 'react';
+import { surfaceVariants } from './styles.js';
+import { jsx } from 'react/jsx-runtime';
+
+const SurfaceContext = /*#__PURE__*/createContext({});
+
+/* ------------------------------------------------------------------------------------------------
+ * Surface Root
+ * --------------------------------------------------------------------------------------------- */
+
+const SurfaceRoot = ({
+  children,
+  className,
+  variant = "default",
+  ...rest
+}) => {
+  return /*#__PURE__*/jsx(SurfaceContext, {
+    value: {
+      variant
+    },
+    children: /*#__PURE__*/jsx("div", {
+      className: surfaceVariants({
+        className,
+        variant
+      }),
+      "data-slot": "surface",
+      ...rest,
+      children: children
+    })
+  });
+};
+
+export { SurfaceContext, SurfaceRoot };

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

@@ -0,0 +1,21 @@
+import type { ComponentProps } from "react";
+import { SwitchContent, SwitchControl, SwitchIcon, SwitchRoot, SwitchThumb } from "./switch";
+export declare const Switch: (({ children, className, size, ...props }: import("./switch").SwitchRootProps) => import("react/jsx-runtime").JSX.Element) & {
+    Content: ({ children, className, ...props }: import("./switch").SwitchContentProps) => import("react/jsx-runtime").JSX.Element;
+    Control: ({ children, className, ...props }: import("./switch").SwitchControlProps) => import("react/jsx-runtime").JSX.Element;
+    Icon: ({ children, className, ...props }: import("./switch").SwitchIconProps) => import("react/jsx-runtime").JSX.Element;
+    Root: ({ children, className, size, ...props }: import("./switch").SwitchRootProps) => import("react/jsx-runtime").JSX.Element;
+    Thumb: ({ children, className, ...props }: import("./switch").SwitchThumbProps) => import("react/jsx-runtime").JSX.Element;
+};
+export type Switch = {
+    Props: ComponentProps<typeof SwitchRoot>;
+    RootProps: ComponentProps<typeof SwitchRoot>;
+    ContentProps: ComponentProps<typeof SwitchContent>;
+    ControlProps: ComponentProps<typeof SwitchControl>;
+    ThumbProps: ComponentProps<typeof SwitchThumb>;
+    IconProps: ComponentProps<typeof SwitchIcon>;
+};
+export { SwitchRoot, SwitchContent, SwitchControl, SwitchIcon, SwitchThumb };
+export type { SwitchRootProps, SwitchRootProps as SwitchProps, SwitchContentProps, SwitchControlProps, SwitchThumbProps, SwitchIconProps, } from "./switch";
+export { switchVariants } from "./styles";
+export type { SwitchVariants } from "./styles";

package/dist/components/switch/index.js

@@ -0,0 +1,16 @@
+"use strict";
+import { SwitchRoot, SwitchThumb, SwitchIcon, SwitchControl, SwitchContent } from './switch.js';
+export { switchVariants } from './styles.js';
+
+/* -------------------------------------------------------------------------------------------------
+ * Compound Component
+ * -----------------------------------------------------------------------------------------------*/
+const Switch = Object.assign(SwitchRoot, {
+  Content: SwitchContent,
+  Control: SwitchControl,
+  Icon: SwitchIcon,
+  Root: SwitchRoot,
+  Thumb: SwitchThumb
+});
+
+export { Switch, SwitchContent, SwitchControl, SwitchIcon, SwitchRoot, SwitchThumb };

package/dist/components/switch/styles.d.ts

@@ -0,0 +1,57 @@
+import type { VariantProps } from "tailwind-variants";
+export declare const switchVariants: import("tailwind-variants").TVReturnType<{
+    size: {
+        lg: {
+            base: string;
+        };
+        md: {
+            base: string;
+        };
+        sm: {
+            base: string;
+        };
+    };
+}, {
+    base: string;
+    content: string;
+    control: string;
+    icon: string;
+    thumb: string;
+}, undefined, {
+    size: {
+        lg: {
+            base: string;
+        };
+        md: {
+            base: string;
+        };
+        sm: {
+            base: string;
+        };
+    };
+}, {
+    base: string;
+    content: string;
+    control: string;
+    icon: string;
+    thumb: string;
+}, import("tailwind-variants").TVReturnType<{
+    size: {
+        lg: {
+            base: string;
+        };
+        md: {
+            base: string;
+        };
+        sm: {
+            base: string;
+        };
+    };
+}, {
+    base: string;
+    content: string;
+    control: string;
+    icon: string;
+    thumb: string;
+}, undefined, unknown, unknown, undefined>>;
+export type SwitchVariants = VariantProps<typeof switchVariants>;

package/dist/components/switch/styles.js

@@ -0,0 +1,30 @@
+"use strict";
+import { tv } from 'tailwind-variants';
+
+const switchVariants = tv({
+  defaultVariants: {
+    size: "md"
+  },
+  slots: {
+    base: "switch",
+    content: "switch__content",
+    control: "switch__control",
+    icon: "switch__icon",
+    thumb: "switch__thumb"
+  },
+  variants: {
+    size: {
+      lg: {
+        base: "switch--lg"
+      },
+      md: {
+        base: "switch--md"
+      },
+      sm: {
+        base: "switch--sm"
+      }
+    }
+  }
+});
+
+export { switchVariants };

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

@@ -0,0 +1,20 @@
+import type { SwitchVariants } from "./styles";
+import type { ComponentPropsWithRef } from "react";
+import { Switch as SwitchPrimitive } from "react-aria-components";
+interface SwitchRootProps extends ComponentPropsWithRef<typeof SwitchPrimitive>, SwitchVariants {
+}
+declare const SwitchRoot: ({ children, className, size, ...props }: SwitchRootProps) => import("react/jsx-runtime").JSX.Element;
+interface SwitchControlProps extends ComponentPropsWithRef<"span"> {
+}
+declare const SwitchControl: ({ children, className, ...props }: SwitchControlProps) => import("react/jsx-runtime").JSX.Element;
+interface SwitchThumbProps extends ComponentPropsWithRef<"span"> {
+}
+declare const SwitchThumb: ({ children, className, ...props }: SwitchThumbProps) => import("react/jsx-runtime").JSX.Element;
+interface SwitchIconProps extends ComponentPropsWithRef<"span"> {
+}
+declare const SwitchIcon: ({ children, className, ...props }: SwitchIconProps) => import("react/jsx-runtime").JSX.Element;
+interface SwitchContentProps extends ComponentPropsWithRef<"div"> {
+}
+declare const SwitchContent: ({ children, className, ...props }: SwitchContentProps) => import("react/jsx-runtime").JSX.Element;
+export { SwitchRoot, SwitchControl, SwitchThumb, SwitchIcon, SwitchContent };
+export type { SwitchRootProps, SwitchControlProps, SwitchThumbProps, SwitchIconProps, SwitchContentProps, };

package/dist/components/switch/switch.js

@@ -0,0 +1,118 @@
+"use client";
+import React__default, { useContext, createContext } from 'react';
+import { Switch } from 'react-aria-components';
+import { composeTwRenderProps, composeSlotClassName } from '../../utils/compose.js';
+import { switchVariants } from './styles.js';
+import { jsx, Fragment } from 'react/jsx-runtime';
+
+const SwitchContext = /*#__PURE__*/createContext({});
+
+/* -------------------------------------------------------------------------------------------------
+ * Switch Root
+ * -----------------------------------------------------------------------------------------------*/
+
+const SwitchRoot = ({
+  children,
+  className,
+  size,
+  ...props
+}) => {
+  const slots = React__default.useMemo(() => switchVariants({
+    size
+  }), [size]);
+  return /*#__PURE__*/jsx(SwitchContext, {
+    value: {
+      slots
+    },
+    children: /*#__PURE__*/jsx(Switch, {
+      "data-slot": "switch",
+      ...props,
+      className: composeTwRenderProps(className, slots.base()),
+      children: values => /*#__PURE__*/jsx(Fragment, {
+        children: typeof children === "function" ? children(values) : children
+      })
+    })
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Switch Control
+ * -----------------------------------------------------------------------------------------------*/
+
+const SwitchControl = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(SwitchContext);
+  return /*#__PURE__*/jsx("span", {
+    className: composeSlotClassName(slots?.control, className),
+    "data-slot": "switch-control",
+    ...props,
+    children: children
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Switch Thumb
+ * -----------------------------------------------------------------------------------------------*/
+
+const SwitchThumb = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(SwitchContext);
+  return /*#__PURE__*/jsx("span", {
+    className: composeSlotClassName(slots?.thumb, className),
+    "data-slot": "switch-thumb",
+    ...props,
+    children: children
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Switch Icon
+ * -----------------------------------------------------------------------------------------------*/
+
+const SwitchIcon = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(SwitchContext);
+  return /*#__PURE__*/jsx("span", {
+    className: composeSlotClassName(slots?.icon, className),
+    "data-slot": "switch-icon",
+    ...props,
+    children: children
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Switch Content
+ * -----------------------------------------------------------------------------------------------*/
+
+const SwitchContent = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(SwitchContext);
+  return /*#__PURE__*/jsx("div", {
+    className: composeSlotClassName(slots?.content, className),
+    "data-slot": "switch-content",
+    ...props,
+    children: children
+  });
+};
+
+export { SwitchContent, SwitchControl, SwitchIcon, SwitchRoot, SwitchThumb };

package/dist/components/switch-group/index.d.ts

@@ -0,0 +1,13 @@
+import type { ComponentProps } from "react";
+import { SwitchGroupRoot } from "./switch-group";
+export declare const SwitchGroup: (({ children, className, orientation, ...props }: import("./switch-group").SwitchGroupRootProps) => import("react/jsx-runtime").JSX.Element) & {
+    Root: ({ children, className, orientation, ...props }: import("./switch-group").SwitchGroupRootProps) => import("react/jsx-runtime").JSX.Element;
+};
+export type SwitchGroup = {
+    Props: ComponentProps<typeof SwitchGroupRoot>;
+    RootProps: ComponentProps<typeof SwitchGroupRoot>;
+};
+export { SwitchGroupRoot };
+export type { SwitchGroupRootProps, SwitchGroupRootProps as SwitchGroupProps, } from "./switch-group";
+export { switchGroupVariants } from "./styles";
+export type { SwitchGroupVariants } from "./styles";

package/dist/components/switch-group/index.js

@@ -0,0 +1,12 @@
+"use strict";
+import { SwitchGroupRoot } from './switch-group.js';
+export { switchGroupVariants } from './styles.js';
+
+/* -------------------------------------------------------------------------------------------------
+ * Compound Component
+ * -----------------------------------------------------------------------------------------------*/
+const SwitchGroup = Object.assign(SwitchGroupRoot, {
+  Root: SwitchGroupRoot
+});
+
+export { SwitchGroup, SwitchGroupRoot };

package/dist/components/switch-group/styles.d.ts

@@ -0,0 +1,39 @@
+import type { VariantProps } from "tailwind-variants";
+export declare const switchGroupVariants: import("tailwind-variants").TVReturnType<{
+    orientation: {
+        horizontal: {
+            base: string;
+        };
+        vertical: {
+            base: string;
+        };
+    };
+}, {
+    base: string;
+    items: string;
+}, undefined, {
+    orientation: {
+        horizontal: {
+            base: string;
+        };
+        vertical: {
+            base: string;
+        };
+    };
+}, {
+    base: string;
+    items: string;
+}, import("tailwind-variants").TVReturnType<{
+    orientation: {
+        horizontal: {
+            base: string;
+        };
+        vertical: {
+            base: string;
+        };
+    };
+}, {
+    base: string;
+    items: string;
+}, undefined, unknown, unknown, undefined>>;
+export type SwitchGroupVariants = VariantProps<typeof switchGroupVariants>;

package/dist/components/switch-group/styles.js

@@ -0,0 +1,24 @@
+"use strict";
+import { tv } from 'tailwind-variants';
+
+const switchGroupVariants = tv({
+  defaultVariants: {
+    orientation: "vertical"
+  },
+  slots: {
+    base: "switch-group",
+    items: "switch-group__items"
+  },
+  variants: {
+    orientation: {
+      horizontal: {
+        base: "switch-group--horizontal"
+      },
+      vertical: {
+        base: "switch-group--vertical"
+      }
+    }
+  }
+});
+
+export { switchGroupVariants };

package/dist/components/switch-group/switch-group.d.ts

@@ -0,0 +1,7 @@
+import type { SwitchGroupVariants } from "./styles";
+import type { ComponentPropsWithRef } from "react";
+interface SwitchGroupRootProps extends ComponentPropsWithRef<"div">, SwitchGroupVariants {
+}
+declare const SwitchGroupRoot: ({ children, className, orientation, ...props }: SwitchGroupRootProps) => import("react/jsx-runtime").JSX.Element;
+export { SwitchGroupRoot };
+export type { SwitchGroupRootProps };