welcome-ui 10.4.0 → 10.5.0

package/dist/{tab-panel-BFzjhpJq.js → tab-panel-Cc3MfOBM.js}

@@ -1,11 +1,11 @@
 "use client";
-import { C as q, a as B, c as V, b as X, d as z } from "./WZWDIE3S-DDipnVYO.js";
-import { b as w } from "./Q5W46E73-ClIlNE6g.js";
+import { C as q, a as B, c as V, b as X, d as z } from "./WZWDIE3S-CGqoM1Fy.js";
+import { b as w } from "./Q5W46E73-5xQblshY.js";
 import { b as G, w as J, f as N, c as k, a as _, i as R, j as H, B as Q, u as L, h as K, a9 as U, q as Y, X as Z } from "./U6HHPQDW-CzxyP5H7.js";
 import { useCallback as O, useRef as W, useEffect as M, useState as p } from "react";
 import { jsx as D } from "react/jsx-runtime";
-import { u as ee } from "./ZMWF7ASR-BGZQn0ZB.js";
-import { u as te, d as ne } from "./WLZ6H5FH-6NScq2Y6.js";
+import { u as ee } from "./ZMWF7ASR-Jc8y_k3t.js";
+import { u as te, d as ne } from "./WLZ6H5FH-CuTcX7sR.js";
 var A = G(
   [B],
   [q]

package/dist/{tslib.es6-C80jYMbM.js → tslib.es6-CKhMT3k3.js}

@@ -1,5 +1,5 @@
 "use client";
-import { g as Se } from "./index-PAaZGbyz.js";
+import { g as Se } from "./index-B6iGEm-i.js";
 var V = { exports: {} }, N = { exports: {} }, g = {}, ue;
 function _e() {
   if (ue) return g;

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

@@ -18,7 +18,7 @@ export declare const Drawer: import('react').ForwardRefExoticComponent<Omit<Draw
     Header: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & {
         children?: import('react').ReactNode | undefined;
     } & import('react').RefAttributes<HTMLDivElement>> & {
-        Button: ({ "aria-label": ariaLabel, className, icon, onClick, ...rest }: import('../../utils').PropsWithAs<import('../../utils').As, import('../Window/types').ActionButtonProps>) => import("react/jsx-runtime").JSX.Element;
+        Button: ({ "aria-label": ariaLabel, className, icon, isActive, onClick, ...rest }: import('../../utils').PropsWithAs<import('../../utils').As, import('../Window/types').ActionButtonProps>) => import("react/jsx-runtime").JSX.Element;
         CloseButton: ({ as, className, onClick, }: import('../../utils').PropsWithAs<import('../../utils').As, Omit<import('../Window/types').ActionButtonProps, "icon">>) => import("react/jsx-runtime").JSX.Element;
         LeftActions: ({ isExpandable, onExpandChange }: import('../Window/types').HeaderLeftActionsProps) => import("react/jsx-runtime").JSX.Element;
         RightActions: ({ children, isClosable, onClose }: import('../Window/types').HeaderRightActionsProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -33,7 +33,7 @@ export declare const Modal: import('../../utils').FunctionComponentWithAs<"div",
     WindowHeader: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & {
         children?: import('react').ReactNode | undefined;
     } & import('react').RefAttributes<HTMLDivElement>> & {
-        Button: ({ "aria-label": ariaLabel, className, icon, onClick, ...rest }: import('../../utils').PropsWithAs<import('../../utils').As, import('../Window/types').ActionButtonProps>) => import("react/jsx-runtime").JSX.Element;
+        Button: ({ "aria-label": ariaLabel, className, icon, isActive, onClick, ...rest }: import('../../utils').PropsWithAs<import('../../utils').As, import('../Window/types').ActionButtonProps>) => import("react/jsx-runtime").JSX.Element;
         CloseButton: ({ as, className, onClick, }: import('../../utils').PropsWithAs<import('../../utils').As, Omit<import('../Window/types').ActionButtonProps, "icon">>) => import("react/jsx-runtime").JSX.Element;
         LeftActions: ({ isExpandable, onExpandChange }: import('../Window/types').HeaderLeftActionsProps) => import("react/jsx-runtime").JSX.Element;
         RightActions: ({ children, isClosable, onClose }: import('../Window/types').HeaderRightActionsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/components/Window/components/Header.d.ts

@@ -6,7 +6,7 @@ export declare const HeaderComponent: import('react').ForwardRefExoticComponent<
 export declare const Header: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & {
     children?: import('react').ReactNode | undefined;
 } & import('react').RefAttributes<HTMLDivElement>> & {
-    Button: ({ "aria-label": ariaLabel, className, icon, onClick, ...rest }: PropsWithAs<As, ActionButtonProps>) => import("react/jsx-runtime").JSX.Element;
+    Button: ({ "aria-label": ariaLabel, className, icon, isActive, onClick, ...rest }: PropsWithAs<As, ActionButtonProps>) => import("react/jsx-runtime").JSX.Element;
     CloseButton: ({ as, className, onClick, }: PropsWithAs<As, Omit<ActionButtonProps, "icon">>) => import("react/jsx-runtime").JSX.Element;
     LeftActions: ({ isExpandable, onExpandChange }: HeaderLeftActionsProps) => import("react/jsx-runtime").JSX.Element;
     RightActions: ({ children, isClosable, onClose }: HeaderRightActionsProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -11,7 +11,7 @@ export declare const Window: import('../../utils').FunctionComponentWithAs<"div"
     Header: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLDivElement> & {
         children?: import('react').ReactNode | undefined;
     } & import('react').RefAttributes<HTMLDivElement>> & {
-        Button: ({ "aria-label": ariaLabel, className, icon, onClick, ...rest }: import('../../utils').PropsWithAs<import('../../utils').As, import('./types').ActionButtonProps>) => import("react/jsx-runtime").JSX.Element;
+        Button: ({ "aria-label": ariaLabel, className, icon, isActive, onClick, ...rest }: import('../../utils').PropsWithAs<import('../../utils').As, import('./types').ActionButtonProps>) => import("react/jsx-runtime").JSX.Element;
         CloseButton: ({ as, className, onClick, }: import('../../utils').PropsWithAs<import('../../utils').As, Omit<import('./types').ActionButtonProps, "icon">>) => import("react/jsx-runtime").JSX.Element;
         LeftActions: ({ isExpandable, onExpandChange }: import('./types').HeaderLeftActionsProps) => import("react/jsx-runtime").JSX.Element;
         RightActions: ({ children, isClosable, onClose }: import('./types').HeaderRightActionsProps) => import("react/jsx-runtime").JSX.Element;

package/dist/types/components/Window/types.d.ts

@@ -5,6 +5,7 @@ import { MergeProps, PropsWithAs } from '../../utils';
 import { IconName } from '../Icon/types';
 export interface ActionButtonOptions {
     icon: IconName;
+    isActive?: boolean;
 }
 export type ActionButtonProps = MergeProps<HTMLAttributes<HTMLButtonElement>, ActionButtonOptions>;
 export interface BodyOptions {

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

@@ -1,4 +1,7 @@
 export * from './classNames';
 export * from './forwardRefWithAs';
 export * from './ts-utils';
+export * from './use-breakpoint';
 export * from './use-copy-text';
+export * from './use-screens';
+export * from './use-viewport';

package/dist/types/utils/use-breakpoint.d.ts

@@ -0,0 +1,15 @@
+import { ScreenSizes } from '../theme/types';
+export type Breakpoint = Exclude<ScreenSizes, 'xxl'>;
+export type BreakpointBoundary = 'excludeThreshold' | 'includeThreshold';
+/**
+ * Reactive current breakpoint name, derived from the theme's screen tokens
+ * and the live viewport width.
+ *
+ * @param boundary - How to resolve a viewport that's exactly at a breakpoint's threshold:
+ * - `'includeThreshold'` (default): the breakpoint starts as soon as the viewport reaches its
+ *   threshold (`width >= threshold`). E.g. at exactly 736px, `useBreakpoint()` returns `'md'`.
+ * - `'excludeThreshold'`: the breakpoint only starts once the viewport strictly passes its
+ *   threshold (`width > threshold`). E.g. at exactly 736px, `useBreakpoint('excludeThreshold')`
+ *   returns `'sm'` — `'md'` only kicks in at 737px.
+ */
+export declare function useBreakpoint(boundary?: BreakpointBoundary): Breakpoint;

package/dist/types/utils/use-breakpoint.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/utils/use-viewport.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/use-viewport-GQu4vkby.js

@@ -0,0 +1,20 @@
+"use client";
+import { useEffect as s, useLayoutEffect as u, useState as f, useRef as d } from "react";
+const m = typeof window > "u" ? s : u, S = 300;
+function z() {
+  const [o, i] = f({ height: void 0, width: void 0 }), e = d();
+  return m(() => {
+    const t = new ResizeObserver(([n]) => {
+      const { blockSize: c, inlineSize: r } = n.contentBoxSize[0];
+      clearTimeout(e.current), e.current = setTimeout(() => {
+        i({ height: c, width: r });
+      }, S);
+    });
+    return t.observe(document.documentElement), () => {
+      clearTimeout(e.current), t.disconnect();
+    };
+  }, []), o;
+}
+export {
+  z as u
+};

package/dist/{utils-BGmdljvh.js → utils-ZE_dEXnJ.js}

@@ -1,5 +1,5 @@
 "use client";
-import { g as J } from "./index-PAaZGbyz.js";
+import { g as J } from "./index-B6iGEm-i.js";
 const Y = {
   "custom-header": "_custom-header_1w74t_2",
   "date-picker": "_date-picker_1w74t_9",

package/dist/utils.js

@@ -1,20 +1,31 @@
 "use client";
 import './utils.css';
-import { b as f } from "./index-PAaZGbyz.js";
-import { c as d } from "./index-PAaZGbyz.js";
-import { f as C } from "./forwardRefWithAs-8eP3ZN15.js";
-import { useState as p, useCallback as a } from "react";
-function n(e, o) {
-  const [t, s] = p();
-  return [a(() => {
-    let r;
-    typeof e == "number" || typeof e == "string" ? r = e.toString() : e.current instanceof HTMLInputElement ? r = e.current.value : e.current instanceof HTMLElement && (r = e.current.textContent);
-    const i = f(r);
-    s(i), o && setTimeout(s, o);
+import { u, b as f } from "./index-B6iGEm-i.js";
+import { c as b } from "./index-B6iGEm-i.js";
+import { f as S } from "./forwardRefWithAs-8eP3ZN15.js";
+import { u as p } from "./use-viewport-GQu4vkby.js";
+import { useState as a, useCallback as d } from "react";
+function y(e = "includeThreshold") {
+  const { width: o } = p(), t = u(), i = o ?? (typeof window < "u" ? window.innerWidth : 0), c = (r) => e === "includeThreshold" ? i >= r : i > r, s = Object.keys(t).filter((r) => r !== "xxl").sort((r, n) => t[r] - t[n]);
+  return s.reduce(
+    (r, n) => c(t[n]) ? n : r,
+    s[0]
+  );
+}
+function w(e, o) {
+  const [t, i] = a();
+  return [d(() => {
+    let s;
+    typeof e == "number" || typeof e == "string" ? s = e.toString() : e.current instanceof HTMLInputElement ? s = e.current.value : e.current instanceof HTMLElement && (s = e.current.textContent);
+    const r = f(s);
+    i(r), o && setTimeout(i, o);
   }, [e, o]), t];
 }
 export {
-  d as classNames,
-  C as forwardRefWithAs,
-  n as useCopyText
+  b as classNames,
+  S as forwardRefWithAs,
+  y as useBreakpoint,
+  w as useCopyText,
+  u as useScreens,
+  p as useViewportSize
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "welcome-ui",
-  "version": "10.4.0",
+  "version": "10.5.0",
   "description": "Customizable design system with react, typescript, tailwindcss and ariakit.",
   "files": [
     "dist"

package/dist/index-PAaZGbyz.js

@@ -1,102 +0,0 @@
-"use client";
-var R = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
-function D(e) {
-  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
-}
-function S(e) {
-  return function(...o) {
-    const c = /* @__PURE__ */ new Set();
-    function l(...f) {
-      for (const a of f)
-        if (a) {
-          if (typeof a == "string")
-            c.add((e == null ? void 0 : e[a]) || a);
-          else if (Array.isArray(a))
-            l(...a);
-          else if (typeof a == "object")
-            for (const t in a)
-              Object.prototype.hasOwnProperty.call(a, t) && a[t] && c.add((e == null ? void 0 : e[t]) || t);
-        }
-    }
-    return l(...o), Array.from(c).join(" ");
-  };
-}
-var y, v;
-function h() {
-  return v || (v = 1, y = function() {
-    var e = document.getSelection();
-    if (!e.rangeCount)
-      return function() {
-      };
-    for (var o = document.activeElement, c = [], l = 0; l < e.rangeCount; l++)
-      c.push(e.getRangeAt(l));
-    switch (o.tagName.toUpperCase()) {
-      // .toUpperCase handles XHTML
-      case "INPUT":
-      case "TEXTAREA":
-        o.blur();
-        break;
-      default:
-        o = null;
-        break;
-    }
-    return e.removeAllRanges(), function() {
-      e.type === "Caret" && e.removeAllRanges(), e.rangeCount || c.forEach(function(f) {
-        e.addRange(f);
-      }), o && o.focus();
-    };
-  }), y;
-}
-var g, C;
-function T() {
-  if (C) return g;
-  C = 1;
-  var e = h(), o = {
-    "text/plain": "Text",
-    "text/html": "Url",
-    default: "Text"
-  }, c = "Copy to clipboard: #{key}, Enter";
-  function l(a) {
-    var t = (/mac os x/i.test(navigator.userAgent) ? "⌘" : "Ctrl") + "+C";
-    return a.replace(/#{\s*key\s*}/g, t);
-  }
-  function f(a, t) {
-    var i, b, m, u, s, r, d = !1;
-    t || (t = {}), i = t.debug || !1;
-    try {
-      m = e(), u = document.createRange(), s = document.getSelection(), r = document.createElement("span"), r.textContent = a, r.ariaHidden = "true", r.style.all = "unset", r.style.position = "fixed", r.style.top = 0, r.style.clip = "rect(0, 0, 0, 0)", r.style.whiteSpace = "pre", r.style.webkitUserSelect = "text", r.style.MozUserSelect = "text", r.style.msUserSelect = "text", r.style.userSelect = "text", r.addEventListener("copy", function(n) {
-        if (n.stopPropagation(), t.format)
-          if (n.preventDefault(), typeof n.clipboardData > "u") {
-            i && console.warn("unable to use e.clipboardData"), i && console.warn("trying IE specific stuff"), window.clipboardData.clearData();
-            var p = o[t.format] || o.default;
-            window.clipboardData.setData(p, a);
-          } else
-            n.clipboardData.clearData(), n.clipboardData.setData(t.format, a);
-        t.onCopy && (n.preventDefault(), t.onCopy(n.clipboardData));
-      }), document.body.appendChild(r), u.selectNodeContents(r), s.addRange(u);
-      var w = document.execCommand("copy");
-      if (!w)
-        throw new Error("copy command was unsuccessful");
-      d = !0;
-    } catch (n) {
-      i && console.error("unable to copy using execCommand: ", n), i && console.warn("trying IE specific stuff");
-      try {
-        window.clipboardData.setData(t.format || "text", a), t.onCopy && t.onCopy(window.clipboardData), d = !0;
-      } catch (p) {
-        i && console.error("unable to copy using clipboardData: ", p), i && console.error("falling back to prompt"), b = l("message" in t ? t.message : c), window.prompt(b, a);
-      }
-    } finally {
-      s && (typeof s.removeRange == "function" ? s.removeRange(u) : s.removeAllRanges()), r && document.body.removeChild(r), m();
-    }
-    return d;
-  }
-  return g = f, g;
-}
-var E = T();
-const x = /* @__PURE__ */ D(E);
-export {
-  R as a,
-  x as b,
-  S as c,
-  D as g
-};