welcome-ui 7.1.0 → 7.2.0

package/dist/types/components/Alert/index.d.ts

@@ -1,8 +1,7 @@
 import { default as React } from 'react';
+import { Size, Variant } from './theme';
 import { ButtonProps } from '../Button';
 import { CreateWuiProps } from '../System';
-type Size = 'sm' | 'md';
-type Variant = 'danger' | 'success' | 'warning' | 'info' | 'default' | 'beige';
 export interface AlertOptions {
     closeButtonDataTestId?: string;
     cta?: JSX.Element;
@@ -18,7 +17,6 @@ export interface AlertOptions {
 export type AlertProps = CreateWuiProps<'div', AlertOptions>;
 export declare const Alert: import('../System').CreateWuiComponent<"div", AlertProps> & {
     Title: React.FC<import('./Title').AlertTitleProps>;
-    Button: import('../System').CreateWuiComponent<"button", Omit<ButtonProps, "size" | "variant">>;
-    SecondaryButton: import('../System').CreateWuiComponent<"button", Omit<ButtonProps, "size" | "variant">>;
+    Button: import('../System').CreateWuiComponent<"button", Omit<ButtonProps, "size">>;
+    SecondaryButton: import('../System').CreateWuiComponent<"button", Omit<ButtonProps, "size">>;
 };
-export {};

package/dist/types/components/Alert/theme.d.ts

@@ -1,15 +1,15 @@
 import { CSSObject } from '@xstyled/styled-components';
 import { ThemeValues } from '../../theme';
-type State = 'default' | 'danger' | 'warning' | 'info' | 'success' | 'beige';
-type Sizes = 'sm' | 'md';
+export type Variant = 'default' | 'danger' | 'warning' | 'info' | 'success' | 'beige' | 'ai';
+export type Size = 'sm' | 'md';
 type AttributesState = CSSObject;
 export type ThemeAlerts = {
     default: CSSObject;
-    sizes: Record<Sizes, CSSObject>;
+    sizes: Record<Size, CSSObject>;
     title: {
         default: CSSObject;
-        sizes: Record<Sizes, CSSObject>;
+        sizes: Record<Size, CSSObject>;
     };
-} & Record<State, AttributesState>;
+} & Record<Variant, AttributesState>;
 export declare const getAlerts: (theme: ThemeValues) => ThemeAlerts;
 export {};

package/dist/types/components/Button/index.d.ts

@@ -1,14 +1,17 @@
 import { default as React } from 'react';
+import { Size, Variant } from './theme';
 import { CreateWuiProps } from '../System';
-type Shape = 'circle' | 'square';
-type Size = 'xs' | 'sm' | 'md' | 'lg';
-type Variant = 'primary' | 'secondary' | 'tertiary' | 'ghost' | 'disabled';
 export interface ButtonOptions {
-    /** Danger button with 3 variants: primary / tertiary / ghost */
+    /** AI button with 3 variants: primary / tertiary / ghost */
+    ai?: boolean;
+    /**
+     * Danger button with 3 variants: primary / tertiary / ghost
+     * Take precedence hover the AI prop
+     */
     danger?: boolean;
     disabled?: boolean;
     isLoading?: boolean;
-    shape?: Shape;
+    shape?: 'circle' | 'square';
     size?: Size;
     variant?: Variant;
 }
@@ -18,4 +21,3 @@ export type ButtonProps = CreateWuiProps<'button', ButtonOptions>;
  */
 export declare const Button: import('../System').CreateWuiComponent<"button", ButtonProps>;
 export declare const StyledButton: import('styled-components').StyledComponent<(props: import('@ariakit/react').ButtonProps) => import('react').ReactElement<any, string | import('react').JSXElementConstructor<any>>, import('@xstyled/system').Theme, ButtonOptions, never>;
-export {};

package/dist/types/components/Button/theme.d.ts

@@ -3,10 +3,10 @@ import { ThemeFocus } from '../../theme/focus';
 import { ThemeValues } from '../../theme';
 type CommonAttributesButton = CSSObject;
 type SizeAttributesButton = CSSObject;
-type Variant = 'primary' | 'secondary' | 'tertiary' | 'ghost';
-type Size = 'xs' | 'sm' | 'md' | 'lg';
+export type Variant = 'primary' | 'secondary' | 'tertiary' | 'ghost';
+export type Size = 'xs' | 'sm' | 'md' | 'lg';
 type Icon = 'only' | 'default';
-export type ThemeButtons = Record<Variant | 'danger', CommonAttributesButton> & Record<'hover', Record<Variant | 'danger', CommonAttributesButton>> & Record<'focus', Record<Variant | 'danger', unknown>> & Record<'active', Record<Variant | 'danger', CommonAttributesButton>> & Record<'disabled', CommonAttributesButton & {
+export type ThemeButtons = Record<Variant | 'danger' | 'ai', CommonAttributesButton> & Record<'hover', Record<Variant | 'danger' | 'ai', CommonAttributesButton>> & Record<'focus', Record<Variant | 'danger' | 'ai', unknown>> & Record<'active', Record<Variant | 'danger' | 'ai', CommonAttributesButton>> & Record<'disabled', CommonAttributesButton & {
     '&:focus': ReturnType<ThemeFocus>;
 }> & Record<'sizes', Record<Size, SizeAttributesButton>> & Record<'icon', Record<Icon, Record<Size, string>>>;
 export declare const getButtons: (theme: ThemeValues) => ThemeButtons;

package/dist/types/components/Tag/index.d.ts

@@ -1,8 +1,6 @@
-import { ThemeSecondaryColors } from '../../theme/colors';
+import { Size, Variant } from './theme';
 import { CreateWuiProps } from '../System';
 import * as S from './styles';
-type Size = 'xs' | 'sm' | 'md';
-type Variant = ThemeSecondaryColors | 'default' | 'info' | 'success' | 'danger' | 'warning' | 'primary';
 export interface TagOptions {
     href?: string;
     onClick?: () => void;
@@ -14,4 +12,3 @@ export interface TagOptions {
 export type TagProps = CreateWuiProps<'div', TagOptions>;
 export declare const Tag: import('../System').CreateWuiComponent<"div", TagProps>;
 export declare const StyledTag: import('styled-components').StyledComponent<string, import('@xstyled/system').Theme, S.StyledTagProps & import('../System').WuiProps, never>;
-export {};

package/dist/types/components/Tag/theme.d.ts

@@ -2,7 +2,7 @@ import { CSSObject } from '@xstyled/styled-components';
 import { ThemeSecondaryColors } from '../../theme/colors';
 import { ThemeValues } from '../../theme';
 export type Size = 'xs' | 'sm' | 'md';
-export type Variant = ThemeSecondaryColors | 'default' | 'danger' | 'info' | 'success' | 'warning' | 'primary';
+export type Variant = ThemeSecondaryColors | 'default' | 'danger' | 'info' | 'success' | 'warning' | 'primary' | 'ai';
 export type ThemeTags = {
     default: CSSObject;
     hover: Record<Variant, CSSObject>;

package/dist/types/components/Toast/styles.d.ts

@@ -5,14 +5,14 @@ export declare const ToastWrapper: import('styled-components').StyledComponent<i
 }, never>;
 export declare const Growl: import('styled-components').StyledComponent<import('../System').CreateWuiComponent<"div", import('../Alert').AlertProps> & {
     Title: import('react').FC<import('../Alert/Title').AlertTitleProps>;
-    Button: import('../System').CreateWuiComponent<"button", Omit<import('../Button').ButtonProps, "size" | "variant">>;
-    SecondaryButton: import('../System').CreateWuiComponent<"button", Omit<import('../Button').ButtonProps, "size" | "variant">>;
+    Button: import('../System').CreateWuiComponent<"button", Omit<import('../Button').ButtonProps, "size">>;
+    SecondaryButton: import('../System').CreateWuiComponent<"button", Omit<import('../Button').ButtonProps, "size">>;
 }, import('@xstyled/system').Theme, GrowlOptions, never>;
 export declare const Title: import('styled-components').StyledComponent<import('../System').CreateWuiComponent<"div", import('../Box').BoxProps>, import('@xstyled/system').Theme, {}, never>;
 export declare const Snackbar: import('styled-components').StyledComponent<import('../System').CreateWuiComponent<"div", import('../Alert').AlertProps> & {
     Title: import('react').FC<import('../Alert/Title').AlertTitleProps>;
-    Button: import('../System').CreateWuiComponent<"button", Omit<import('../Button').ButtonProps, "size" | "variant">>;
-    SecondaryButton: import('../System').CreateWuiComponent<"button", Omit<import('../Button').ButtonProps, "size" | "variant">>;
+    Button: import('../System').CreateWuiComponent<"button", Omit<import('../Button').ButtonProps, "size">>;
+    SecondaryButton: import('../System').CreateWuiComponent<"button", Omit<import('../Button').ButtonProps, "size">>;
 }, import('@xstyled/system').Theme, {}, never>;
 export declare const SnackbarSeparator: import('styled-components').StyledComponent<"div", import('@xstyled/system').Theme, import('@xstyled/system').SystemProps<import('@xstyled/system').Theme> & {
     variant: SnackbarProps["variant"];

package/dist/types/components/VariantIcon/index.d.ts

@@ -1,6 +1,5 @@
+import { Size, Variant } from './theme';
 import { CreateWuiProps } from '../System';
-type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
-type Variant = 'danger' | 'warning' | 'success' | 'info' | 'default';
 export interface VariantIconOptions {
     icon?: JSX.Element;
     size?: Size;
@@ -8,4 +7,3 @@ export interface VariantIconOptions {
 }
 export type VariantIconProps = CreateWuiProps<'div', VariantIconOptions>;
 export declare const VariantIcon: import('../System').CreateWuiComponent<"div", VariantIconProps>;
-export {};

package/dist/types/components/VariantIcon/theme.d.ts

@@ -1,10 +1,6 @@
 import { CSSObject } from '@xstyled/styled-components';
 import { ThemeValues } from '../../theme';
-export type ThemeVariantIcon = {
-    danger: CSSObject;
-    default: CSSObject;
-    info: CSSObject;
-    success: CSSObject;
-    warning: CSSObject;
-};
+export type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+export type Variant = 'danger' | 'warning' | 'success' | 'info' | 'default' | 'ai';
+export type ThemeVariantIcon = Record<Variant, CSSObject>;
 export declare const getVariantIcon: (theme: ThemeValues) => ThemeVariantIcon;

package/dist/types/utils/index.d.ts

@@ -6,3 +6,4 @@ export * from './throttle';
 export * from './use-copy-text';
 export * from './use-fork-ref';
 export * from './use-isomorphic-layout-effect';
+export * from './use-viewport';

package/dist/utils.mjs

@@ -6,8 +6,9 @@ import { o as N } from "./overflow-ellipsis-DGV5Kgt-.mjs";
 import { t as P } from "./throttle-BDBzFeFj.mjs";
 import { useState as d, useCallback as m } from "react";
 import { g as y } from "./_commonjsHelpers-CXJ7dpIk.mjs";
-import { s as _, u as j } from "./use-fork-ref-CUZErtAC.mjs";
+import { s as B, u as _ } from "./use-fork-ref-CUZErtAC.mjs";
 import { u as G } from "./use-isomorphic-layout-effect-Izr-e2pi.mjs";
+import { u as O } from "./use-viewport-m3glsbna.mjs";
 var g = function() {
   var e = document.getSelection();
   if (!e.rangeCount)
@@ -25,8 +26,8 @@ var g = function() {
       break;
   }
   return e.removeAllRanges(), function() {
-    e.type === "Caret" && e.removeAllRanges(), e.rangeCount || r.forEach(function(s) {
-      e.addRange(s);
+    e.type === "Caret" && e.removeAllRanges(), e.rangeCount || r.forEach(function(c) {
+      e.addRange(c);
     }), t && t.focus();
   };
 }, v = g, f = {
@@ -39,10 +40,10 @@ function C(e) {
   return e.replace(/#{\s*key\s*}/g, t);
 }
 function x(e, t) {
-  var r, o, s, n, c, a, i = !1;
+  var r, o, c, n, s, a, i = !1;
   t || (t = {}), r = t.debug || !1;
   try {
-    s = v(), n = document.createRange(), c = document.getSelection(), a = document.createElement("span"), a.textContent = e, a.ariaHidden = "true", a.style.all = "unset", a.style.position = "fixed", a.style.top = 0, a.style.clip = "rect(0, 0, 0, 0)", a.style.whiteSpace = "pre", a.style.webkitUserSelect = "text", a.style.MozUserSelect = "text", a.style.msUserSelect = "text", a.style.userSelect = "text", a.addEventListener("copy", function(l) {
+    c = v(), n = document.createRange(), s = document.getSelection(), a = document.createElement("span"), a.textContent = e, a.ariaHidden = "true", a.style.all = "unset", a.style.position = "fixed", a.style.top = 0, a.style.clip = "rect(0, 0, 0, 0)", a.style.whiteSpace = "pre", a.style.webkitUserSelect = "text", a.style.MozUserSelect = "text", a.style.msUserSelect = "text", a.style.userSelect = "text", a.addEventListener("copy", function(l) {
       if (l.stopPropagation(), t.format)
         if (l.preventDefault(), typeof l.clipboardData > "u") {
           r && console.warn("unable to use e.clipboardData"), r && console.warn("trying IE specific stuff"), window.clipboardData.clearData();
@@ -51,7 +52,7 @@ function x(e, t) {
         } else
           l.clipboardData.clearData(), l.clipboardData.setData(t.format, e);
       t.onCopy && (l.preventDefault(), t.onCopy(l.clipboardData));
-    }), document.body.appendChild(a), n.selectNodeContents(a), c.addRange(n);
+    }), document.body.appendChild(a), n.selectNodeContents(a), s.addRange(n);
     var p = document.execCommand("copy");
     if (!p)
       throw new Error("copy command was unsuccessful");
@@ -64,19 +65,19 @@ function x(e, t) {
       r && console.error("unable to copy using clipboardData: ", u), r && console.error("falling back to prompt"), o = C("message" in t ? t.message : b), window.prompt(o, e);
     }
   } finally {
-    c && (typeof c.removeRange == "function" ? c.removeRange(n) : c.removeAllRanges()), a && document.body.removeChild(a), s();
+    s && (typeof s.removeRange == "function" ? s.removeRange(n) : s.removeAllRanges()), a && document.body.removeChild(a), c();
   }
   return i;
 }
 var w = x;
 const D = /* @__PURE__ */ y(w);
-function R(e, t) {
+function S(e, t) {
   const [r, o] = d();
   return [m(() => {
     let n;
     typeof e == "number" || typeof e == "string" ? n = e.toString() : e.current instanceof HTMLInputElement ? n = e.current.value : e.current instanceof HTMLElement && (n = e.current.textContent);
-    const c = D(n);
-    o(c), t && setTimeout(o, t);
+    const s = D(n);
+    o(s), t && setTimeout(o, t);
   }, [e, t]), r];
 }
 export {
@@ -85,9 +86,10 @@ export {
   k as formatBytes,
   A as hexToRGBA,
   N as overflowEllipsis,
-  _ as setRef,
+  B as setRef,
   P as throttle,
-  R as useCopyText,
-  j as useForkRef,
-  G as useIsomorphicLayoutEffect
+  S as useCopyText,
+  _ as useForkRef,
+  G as useIsomorphicLayoutEffect,
+  O as useViewportSize
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "welcome-ui",
-  "version": "7.1.0",
+  "version": "7.2.0",
   "description": "Customizable design system with react • styled-components • styled-system and ariakit.",
   "files": [
     "dist"

package/dist/index-RUkz9Z2V.mjs

@@ -1,31 +0,0 @@
-"use client";
-import c from "react";
-import { Icon as e } from "./Icon.mjs";
-const o = 15, n = 15, l = '<path fill="currentColor" d="m55.542 9.07 41.48 66.67a6.395 6.395 0 0 1 .32 6.225 6.482 6.482 0 0 1-5.123 3.604L9.256 94.957A6.502 6.502 0 0 1 3.12 92.15a6.41 6.41 0 0 1-.33-6.703L44.27 9.39v-.001c1.12-2.053 3.193-3.318 5.544-3.385a6.475 6.475 0 0 1 5.728 3.067Zm-3.217 61.689a3.726 3.726 0 0 0-.493-.601c-1.495-1.497-4.173-1.497-5.655 0a4.016 4.016 0 0 0-1.173 2.833c0 1.042.428 2.085 1.173 2.833A3.992 3.992 0 0 0 49.004 77a4.015 4.015 0 0 0 2.828-1.176 4.414 4.414 0 0 0 .867-1.31c.092-.24.173-.494.226-.748a5.24 5.24 0 0 0 .067-.775c0-.268-.028-.535-.067-.789a4.985 4.985 0 0 0-.226-.748 4.443 4.443 0 0 0-.374-.695ZM45 37.009v20.257a4.005 4.005 0 0 0 4 4.009c2.21 0 4-1.796 4-4.01V37.01c0-2.215-1.79-4.01-4-4.01-2.209 0-4 1.795-4 4.01Z"/>', a = {
-  width: o,
-  height: n,
-  block: l
-}, A = (t) => /* @__PURE__ */ c.createElement(e, { alt: "Alert", content: a, ...t }), r = 15, h = 15, i = '<path fill="currentColor" fill-rule="evenodd" d="M74.68 21.64a6.51 6.51 0 0 1 9.155-.492 6.453 6.453 0 0 1 .707 8.907l-.211.246-43.47 48.058a6.495 6.495 0 0 1-4.828 2.141c-1.449 0-2.86-.48-4.013-1.385l-.283-.235-15.54-13.665a6.455 6.455 0 0 1-.555-9.153 6.512 6.512 0 0 1 8.902-.756l.248.208 10.72 9.425L74.68 21.641Z" clip-rule="evenodd"/>', s = {
-  width: r,
-  height: h,
-  block: i
-}, L = (t) => /* @__PURE__ */ c.createElement(e, { alt: "Check", content: s, ...t }), d = 15, u = 15, m = '<path fill="currentColor" d="M83.95 12.62C74.807 4.513 62.657.85 49.731 2.317 23.412 5.297 2 29.005 2 55.167c0 12.738 4.992 24.178 14.054 32.214C23.876 94.32 33.9 98 44.73 98c1.824 0 3.674-.105 5.536-.315C76.587 94.703 98 70.995 98 44.833c0-12.737-4.99-24.177-14.05-32.213ZM56.492 66.181c2.219-.25 4.228 1.293 4.48 3.432.254 2.139-1.341 4.07-3.562 4.314-.439.048-.878.073-1.314.073-2.838 0-5.599-1.003-7.737-2.84-2.467-2.121-3.882-5.163-3.882-8.347V49.825l-3.97.436c-2.224.244-4.23-1.293-4.482-3.432-.253-2.139 1.342-4.07 3.565-4.314l8.477-.93a4.142 4.142 0 0 1 3.155.963 3.842 3.842 0 0 1 1.352 2.91v17.355a3.29 3.29 0 0 0 1.177 2.529 3.582 3.582 0 0 0 2.74.84Zm-12.33-35.895a4.548 4.548 0 0 1-.365-1.742 4.52 4.52 0 0 1 1.391-3.222c1.092-1.053 2.725-1.533 4.264-1.235.298.052.593.143.877.26.283.104.567.247.81.416.27.17.514.351.728.559a4.51 4.51 0 0 1 1.377 3.223c0 .298-.027.597-.095.883a3.677 3.677 0 0 1-.27.858 3.699 3.699 0 0 1-.43.78c-.175.246-.366.48-.582.688a4.43 4.43 0 0 1-.729.572 5.21 5.21 0 0 1-.81.416 5.177 5.177 0 0 1-.877.26c-.31.051-.62.09-.93.09a4.846 4.846 0 0 1-3.928-2.027 5.523 5.523 0 0 1-.432-.78Z"/>', $ = {
-  width: d,
-  height: u,
-  block: m
-}, M = (t) => /* @__PURE__ */ c.createElement(e, { alt: "Information", content: $, ...t }), f = 15, k = 15, p = '<path fill="currentColor" fill-rule="evenodd" d="M80.086 40.154a2.402 2.402 0 0 0-2.25-1.02l-24.929 2.81V6.365a2.37 2.37 0 0 0-1.812-2.294 2.4 2.4 0 0 0-2.692 1.183L19.781 58.402a2.345 2.345 0 0 0 .133 2.443 2.4 2.4 0 0 0 2.25 1.021l24.928-2.81v35.578a2.37 2.37 0 0 0 1.813 2.296c.194.047.388.07.58.07.869 0 1.69-.468 2.111-1.253l28.624-53.15a2.348 2.348 0 0 0-.134-2.443Z" clip-rule="evenodd"/>', v = {
-  width: f,
-  height: k,
-  block: p
-}, E = (t) => /* @__PURE__ */ c.createElement(e, { alt: "Promote", content: v, ...t }), C = 15, Z = 15, b = '<path fill="currentColor" fill-rule="evenodd" d="M5.863 49.971c-3.518 3.745-3.835 8.974-.723 11.924L41.114 96c3.378 3.203 9.445 2.476 13.264-1.589L95.137 51.03c3.518-3.745 3.835-8.974.723-11.924L59.886 5c-3.378-3.203-9.445-2.476-13.264 1.589L5.862 49.97ZM53.325 64.76c.145.214.267.454.373.695.093.24.174.494.227.748.039.254.067.522.067.789 0 .254-.028.52-.067.775a5 5 0 0 1-.226.748c-.107.24-.228.481-.374.695a3.822 3.822 0 0 1-.493.615A4.015 4.015 0 0 1 50.004 71a3.991 3.991 0 0 1-2.827-1.176 4.062 4.062 0 0 1-1.173-2.833c0-1.056.428-2.098 1.173-2.833 1.481-1.497 4.16-1.497 5.655 0 .185.173.345.387.493.601ZM46 31.009a4.005 4.005 0 0 1 4-4.01c2.21 0 4 1.796 4 4.01v20.257a4.005 4.005 0 0 1-4 4.009c-2.209 0-4-1.796-4-4.01V31.01Z" clip-rule="evenodd"/>', g = {
-  width: C,
-  height: Z,
-  block: b
-}, V = (t) => /* @__PURE__ */ c.createElement(e, { alt: "SquareAlert", content: g, ...t });
-export {
-  A,
-  L as C,
-  M as I,
-  E as P,
-  V as S
-};