twenty-ui 2.46.0 → 2.48.0

package/dist/theme.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./theme-Zf62UE02.cjs");exports.ANIMATION=e.ANIMATION;exports.DEFAULT_THEME_COLOR_FALLBACK=e.DEFAULT_THEME_COLOR_FALLBACK;exports.GRAY_SCALE_DARK=e.GRAY_SCALE_DARK;exports.GRAY_SCALE_LIGHT=e.GRAY_SCALE_LIGHT;exports.MAIN_COLOR_NAMES=e.MAIN_COLOR_NAMES;exports.MOBILE_VIEWPORT=e.MOBILE_VIEWPORT;exports.RGBA=e.RGBA;exports.THEME_COMMON=e.THEME_COMMON;exports.THEME_DARK=e.THEME_DARK;exports.THEME_LIGHT=e.THEME_LIGHT;exports.ThemeProvider=e.ThemeProvider;exports.getNextThemeColor=e.getNextThemeColor;exports.themeCssVariables=e.themeCssVariables;exports.useTheme=e.useTheme;exports.useThemeColorScheme=e.useThemeColorScheme;exports.useThemeContainer=e.useThemeContainer;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./theme-1XkFz8Qu.cjs");exports.ANIMATION=e.ANIMATION;exports.DEFAULT_THEME_COLOR_FALLBACK=e.DEFAULT_THEME_COLOR_FALLBACK;exports.GRAY_SCALE_DARK=e.GRAY_SCALE_DARK;exports.GRAY_SCALE_LIGHT=e.GRAY_SCALE_LIGHT;exports.MAIN_COLOR_NAMES=e.MAIN_COLOR_NAMES;exports.MOBILE_VIEWPORT=e.MOBILE_VIEWPORT;exports.RGBA=e.RGBA;exports.THEME_COMMON=e.THEME_COMMON;exports.THEME_DARK=e.THEME_DARK;exports.THEME_LIGHT=e.THEME_LIGHT;exports.ThemeProvider=e.ThemeProvider;exports.getNextThemeColor=e.getNextThemeColor;exports.themeCssVariables=e.themeCssVariables;exports.useTheme=e.useTheme;exports.useThemeColorScheme=e.useThemeColorScheme;exports.useThemeContainer=e.useThemeContainer;

package/dist/theme.mjs

@@ -1,4 +1,4 @@
-import { a as s, c as a, d as A, f as E, g as T, h as _, i as m, l as o, m as r, n as C, o as L, p as M, r as O, s as h, t as R, u as t } from "./theme-yAk9zrNA.js";
+import { a as s, c as a, d as A, f as E, g as T, h as _, i as m, l as o, m as r, n as C, o as L, p as M, r as O, s as h, t as R, u as t } from "./theme-B2EaXhye.js";
 export {
   T as ANIMATION,
   _ as DEFAULT_THEME_COLOR_FALLBACK,

package/dist/typography-B5QEuPaL.cjs

@@ -0,0 +1 @@
+const t=require("./Shortcut-CgrdLv_L.cjs"),o=require("./OverflowingTextWithTooltip-Z2daM0_x.cjs");let i=require("react/jsx-runtime");var n=({mode:e,children:r})=>(0,i.jsx)(o.OverflowingTextTooltipModeContext.Provider,{value:e,children:r}),u=e=>t.getShortcutPresentation(e).text;Object.defineProperty(exports,"OverflowingTextTooltipModeProvider",{enumerable:!0,get:function(){return n}});Object.defineProperty(exports,"formatShortcut",{enumerable:!0,get:function(){return u}});

package/dist/typography-fOTFr0jS.js

@@ -0,0 +1,11 @@
+import { n as r } from "./Shortcut-BvWUZ3pb.js";
+import { n as e } from "./OverflowingTextWithTooltip-BmUROIah.js";
+import { jsx as i } from "react/jsx-runtime";
+var v = ({ mode: o, children: t }) => /* @__PURE__ */ i(e.Provider, {
+  value: o,
+  children: t
+}), f = (o) => r(o).text;
+export {
+  v as n,
+  f as t
+};

package/dist/{useIsMobile-C_rtkXZO.cjs → useIsMobile-DxOPI2_E.cjs}

@@ -1 +1 @@
-const w=require("./theme-Zf62UE02.cjs"),u=require("./isDefined-DS2Q42p5.cjs");let s=require("@sniptt/guards"),c=require("react");var d=()=>{const r=globalThis.navigator?.userAgent;if(!(0,s.isString)(r))return"unknown";const e=r.toLowerCase();return e.includes("ios")||e.includes("iphone")||e.includes("ipad")?"ios":e.includes("mac os x")||e.includes("macos")?"mac":e.includes("windows")?"windows":e.includes("android")?"android":e.includes("linux")?"linux":"unknown"},a="(max-width: 768px)",l={getSnapshot:()=>!1,subscribe:()=>()=>{}},i=new WeakMap,f=r=>({getSnapshot:()=>r.matches,subscribe:e=>(r.addEventListener("change",e),()=>r.removeEventListener("change",e))}),g=r=>{const e=i.get(r);if(u.isDefined(e))return e;const t=new Map;return i.set(r,t),t},y=r=>{if(typeof window>"u"||!(0,s.isFunction)(window.matchMedia))return l;const e=g(window.matchMedia),t=e.get(r);if(u.isDefined(t))return t;const n=f(window.matchMedia(r));return e.set(r,n),n},M=()=>!1,o=r=>{const{subscribe:e,getSnapshot:t}=y(r);return(0,c.useSyncExternalStore)(e,t,M)},m=()=>o(a);Object.defineProperty(exports,"MOBILE_MEDIA_QUERY",{enumerable:!0,get:function(){return a}});Object.defineProperty(exports,"getUserDevice",{enumerable:!0,get:function(){return d}});Object.defineProperty(exports,"useIsMobile",{enumerable:!0,get:function(){return m}});Object.defineProperty(exports,"useMediaQuery",{enumerable:!0,get:function(){return o}});
+const w=require("./theme-1XkFz8Qu.cjs"),u=require("./isDefined-DS2Q42p5.cjs");let s=require("@sniptt/guards"),c=require("react");var d=()=>{const r=globalThis.navigator?.userAgent;if(!(0,s.isString)(r))return"unknown";const e=r.toLowerCase();return e.includes("ios")||e.includes("iphone")||e.includes("ipad")?"ios":e.includes("mac os x")||e.includes("macos")?"mac":e.includes("windows")?"windows":e.includes("android")?"android":e.includes("linux")?"linux":"unknown"},a="(max-width: 768px)",l={getSnapshot:()=>!1,subscribe:()=>()=>{}},i=new WeakMap,f=r=>({getSnapshot:()=>r.matches,subscribe:e=>(r.addEventListener("change",e),()=>r.removeEventListener("change",e))}),g=r=>{const e=i.get(r);if(u.isDefined(e))return e;const t=new Map;return i.set(r,t),t},y=r=>{if(typeof window>"u"||!(0,s.isFunction)(window.matchMedia))return l;const e=g(window.matchMedia),t=e.get(r);if(u.isDefined(t))return t;const n=f(window.matchMedia(r));return e.set(r,n),n},M=()=>!1,o=r=>{const{subscribe:e,getSnapshot:t}=y(r);return(0,c.useSyncExternalStore)(e,t,M)},m=()=>o(a);Object.defineProperty(exports,"MOBILE_MEDIA_QUERY",{enumerable:!0,get:function(){return a}});Object.defineProperty(exports,"getUserDevice",{enumerable:!0,get:function(){return d}});Object.defineProperty(exports,"useIsMobile",{enumerable:!0,get:function(){return m}});Object.defineProperty(exports,"useMediaQuery",{enumerable:!0,get:function(){return o}});

package/dist/{useIsMobile-BvEB9MOV.js → useIsMobile-nrufFzMb.js}

@@ -1,5 +1,5 @@
 import { t as s } from "./isDefined-fMi6eQ4r.js";
-import "./theme-yAk9zrNA.js";
+import "./theme-B2EaXhye.js";
 import { isFunction as a, isString as o } from "@sniptt/guards";
 import { useSyncExternalStore as u } from "react";
 var h = () => {

package/dist/utilities/index.d.ts

@@ -13,3 +13,4 @@ export type { Nullable } from './types/Nullable';
 export { getSafeUrl } from './utils/getSafeUrl';
 export { isDefined } from './utils/isDefined';
 export { normalizeSearchText } from './utils/normalizeSearchText';
+export { preventDismissingClickActivation } from './utils/preventDismissingClickActivation';

package/dist/{utilities-06FvJQzl.cjs → utilities-BeLfNQ0Q.cjs}

@@ -1 +1 @@
-const n=require("./theme-Zf62UE02.cjs"),i=require("./useIsMobile-C_rtkXZO.cjs");let m=require("zod");var h=e=>e.replace(/\d+$/,""),u=m.z.enum(n.MAIN_COLOR_NAMES),f=e=>{const r=u.safeParse(e??"");return r.success?r.data:n.DEFAULT_THEME_COLOR_FALLBACK},c=e=>{let r=0;for(let t=0;t<e.length;t++)r=e.charCodeAt(t)+((r<<5)-r);return n.MAIN_COLOR_NAMES[Math.abs(r)%n.MAIN_COLOR_NAMES.length]??n.MAIN_COLOR_NAMES[0]},O=({string:e,variant:r=9,theme:t})=>{if(r<1||r>12)throw new Error("Variant must be between 1 and 12");const l=`${c(e)}${r}`;return t.color[l]},C=()=>{const e=i.getUserDevice();return e==="mac"||e==="ios"?"⌘":"Ctrl"},s="(hover: none) and (pointer: coarse)",g=()=>i.useMediaQuery(s),b=["http:","https:","mailto:","tel:"],o="https://same-origin-probe.invalid",a=e=>{if(e.startsWith("/"))try{return new URL(e,o).origin===o}catch{return!1}try{const r=new URL(e);return b.includes(r.protocol)}catch{return!1}},_=e=>{if(!e||e.trim().length===0)return;if(a(e))return e;if(e.startsWith("/"))return;const r=`https://${e}`;return a(r)?r:void 0};Object.defineProperty(exports,"TOUCH_DEVICE_MEDIA_QUERY",{enumerable:!0,get:function(){return s}});Object.defineProperty(exports,"getMainColorNameFromPaletteColorName",{enumerable:!0,get:function(){return h}});Object.defineProperty(exports,"getOsControlSymbol",{enumerable:!0,get:function(){return C}});Object.defineProperty(exports,"getSafeUrl",{enumerable:!0,get:function(){return _}});Object.defineProperty(exports,"parseThemeColor",{enumerable:!0,get:function(){return f}});Object.defineProperty(exports,"stringToThemeColor",{enumerable:!0,get:function(){return c}});Object.defineProperty(exports,"stringToThemeColorP3String",{enumerable:!0,get:function(){return O}});Object.defineProperty(exports,"themeColorSchema",{enumerable:!0,get:function(){return u}});Object.defineProperty(exports,"useIsTouchDevice",{enumerable:!0,get:function(){return g}});
+const n=require("./theme-1XkFz8Qu.cjs"),i=require("./useIsMobile-DxOPI2_E.cjs");let m=require("zod");var h=e=>e.replace(/\d+$/,""),u=m.z.enum(n.MAIN_COLOR_NAMES),f=e=>{const r=u.safeParse(e??"");return r.success?r.data:n.DEFAULT_THEME_COLOR_FALLBACK},c=e=>{let r=0;for(let t=0;t<e.length;t++)r=e.charCodeAt(t)+((r<<5)-r);return n.MAIN_COLOR_NAMES[Math.abs(r)%n.MAIN_COLOR_NAMES.length]??n.MAIN_COLOR_NAMES[0]},O=({string:e,variant:r=9,theme:t})=>{if(r<1||r>12)throw new Error("Variant must be between 1 and 12");const l=`${c(e)}${r}`;return t.color[l]},C=()=>{const e=i.getUserDevice();return e==="mac"||e==="ios"?"⌘":"Ctrl"},s="(hover: none) and (pointer: coarse)",g=()=>i.useMediaQuery(s),b=["http:","https:","mailto:","tel:"],o="https://same-origin-probe.invalid",a=e=>{if(e.startsWith("/"))try{return new URL(e,o).origin===o}catch{return!1}try{const r=new URL(e);return b.includes(r.protocol)}catch{return!1}},_=e=>{if(!e||e.trim().length===0)return;if(a(e))return e;if(e.startsWith("/"))return;const r=`https://${e}`;return a(r)?r:void 0};Object.defineProperty(exports,"TOUCH_DEVICE_MEDIA_QUERY",{enumerable:!0,get:function(){return s}});Object.defineProperty(exports,"getMainColorNameFromPaletteColorName",{enumerable:!0,get:function(){return h}});Object.defineProperty(exports,"getOsControlSymbol",{enumerable:!0,get:function(){return C}});Object.defineProperty(exports,"getSafeUrl",{enumerable:!0,get:function(){return _}});Object.defineProperty(exports,"parseThemeColor",{enumerable:!0,get:function(){return f}});Object.defineProperty(exports,"stringToThemeColor",{enumerable:!0,get:function(){return c}});Object.defineProperty(exports,"stringToThemeColorP3String",{enumerable:!0,get:function(){return O}});Object.defineProperty(exports,"themeColorSchema",{enumerable:!0,get:function(){return u}});Object.defineProperty(exports,"useIsTouchDevice",{enumerable:!0,get:function(){return g}});

package/dist/{utilities-DpSj_IdQ.js → utilities-CEi9I09B.js}

@@ -1,5 +1,5 @@
-import { f as a, h as i } from "./theme-yAk9zrNA.js";
-import { i as h, n as c } from "./useIsMobile-BvEB9MOV.js";
+import { f as a, h as i } from "./theme-B2EaXhye.js";
+import { i as h, n as c } from "./useIsMobile-nrufFzMb.js";
 import { z as m } from "zod";
 var E = (e) => e.replace(/\d+$/, ""), l = m.enum(a), d = (e) => {
   const r = l.safeParse(e ?? "");

package/dist/utilities.cjs

@@ -1 +1 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("./isDefined-DS2Q42p5.cjs"),e=require("./utilities-06FvJQzl.cjs"),r=require("./useIsMobile-C_rtkXZO.cjs"),i=require("./normalizeSearchText-DoNMfZqV.cjs");exports.MOBILE_MEDIA_QUERY=r.MOBILE_MEDIA_QUERY;exports.TOUCH_DEVICE_MEDIA_QUERY=e.TOUCH_DEVICE_MEDIA_QUERY;exports.getMainColorNameFromPaletteColorName=e.getMainColorNameFromPaletteColorName;exports.getOsControlSymbol=e.getOsControlSymbol;exports.getSafeUrl=e.getSafeUrl;exports.getUserDevice=r.getUserDevice;exports.isDefined=o.isDefined;exports.normalizeSearchText=i.normalizeSearchText;exports.parseThemeColor=e.parseThemeColor;exports.stringToThemeColor=e.stringToThemeColor;exports.stringToThemeColorP3String=e.stringToThemeColorP3String;exports.themeColorSchema=e.themeColorSchema;exports.useIsMobile=r.useIsMobile;exports.useIsTouchDevice=e.useIsTouchDevice;exports.useMediaQuery=r.useMediaQuery;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("./isDefined-DS2Q42p5.cjs"),e=require("./utilities-BeLfNQ0Q.cjs"),i=require("./useIsMobile-DxOPI2_E.cjs"),r=require("./preventDismissingClickActivation-DZxTSLV3.cjs");exports.MOBILE_MEDIA_QUERY=i.MOBILE_MEDIA_QUERY;exports.TOUCH_DEVICE_MEDIA_QUERY=e.TOUCH_DEVICE_MEDIA_QUERY;exports.getMainColorNameFromPaletteColorName=e.getMainColorNameFromPaletteColorName;exports.getOsControlSymbol=e.getOsControlSymbol;exports.getSafeUrl=e.getSafeUrl;exports.getUserDevice=i.getUserDevice;exports.isDefined=o.isDefined;exports.normalizeSearchText=r.normalizeSearchText;exports.parseThemeColor=e.parseThemeColor;exports.preventDismissingClickActivation=r.preventDismissingClickActivation;exports.stringToThemeColor=e.stringToThemeColor;exports.stringToThemeColorP3String=e.stringToThemeColorP3String;exports.themeColorSchema=e.themeColorSchema;exports.useIsMobile=i.useIsMobile;exports.useIsTouchDevice=e.useIsTouchDevice;exports.useMediaQuery=i.useMediaQuery;

package/dist/utilities.mjs

@@ -1,21 +1,22 @@
 import { t as o } from "./isDefined-fMi6eQ4r.js";
-import { a as s, c as a, i as t, l as m, n as i, o as l, r as n, s as C, t as T } from "./utilities-DpSj_IdQ.js";
-import { i as h, n as E, r as c, t as f } from "./useIsMobile-BvEB9MOV.js";
-import { t as D } from "./normalizeSearchText-DA4xMLCJ.js";
+import { a as r, c as a, i as t, l as i, n as m, o as l, r as n, s as C, t as c } from "./utilities-CEi9I09B.js";
+import { i as T, n as h, r as p, t as D } from "./useIsMobile-nrufFzMb.js";
+import { n as f, t as I } from "./preventDismissingClickActivation-CzWqpjiX.js";
 export {
-  c as MOBILE_MEDIA_QUERY,
+  p as MOBILE_MEDIA_QUERY,
   n as TOUCH_DEVICE_MEDIA_QUERY,
-  m as getMainColorNameFromPaletteColorName,
+  i as getMainColorNameFromPaletteColorName,
   t as getOsControlSymbol,
-  T as getSafeUrl,
-  h as getUserDevice,
+  c as getSafeUrl,
+  T as getUserDevice,
   o as isDefined,
-  D as normalizeSearchText,
+  f as normalizeSearchText,
   C as parseThemeColor,
-  s as stringToThemeColor,
+  I as preventDismissingClickActivation,
+  r as stringToThemeColor,
   l as stringToThemeColorP3String,
   a as themeColorSchema,
-  f as useIsMobile,
-  i as useIsTouchDevice,
-  E as useMediaQuery
+  D as useIsMobile,
+  m as useIsTouchDevice,
+  h as useMediaQuery
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "twenty-ui",
-  "version": "2.46.0",
+  "version": "2.48.0",
   "description": "Twenty's shared React UI component library.",
   "license": "MIT",
   "repository": {
@@ -55,6 +55,7 @@
     "jsdom": "^30.0.1",
     "lightningcss": "^1.32.0",
     "monaco-editor": "0.52.2",
+    "postcss": "^8.5.15",
     "prettier": "^3.1.1",
     "react": "^19.2.0",
     "react-docgen-typescript": "^2.2.2",
@@ -63,6 +64,7 @@
     "sass-embedded": "^1.83.0",
     "size-limit": "^12.1.0",
     "slash": "^5.1.0",
+    "storybook": "^10.4.6",
     "storybook-addon-pseudo-states": "^10.3.3",
     "tsx": "^4.19.3",
     "typescript": "^5.9.3",

package/dist/Button-DkijwPOi.cjs

@@ -1 +0,0 @@
-const t=require("./isDefined-DS2Q42p5.cjs"),u=require("./Loader-GFhTL4Aw.cjs"),w=require("./Shortcut-oYvcja2P.cjs"),A=require("./mergeClassNames-D4lshrT6.cjs");let E=require("clsx"),m=require("react"),e=require("react/jsx-runtime"),J=require("@base-ui/react/button");var q=(0,m.createContext)(null),R="_button_vtbjg_1",V="_content_vtbjg_181",F="_label_vtbjg_190",H="_icon_vtbjg_196",K="_hidden_vtbjg_206",M="_loader_vtbjg_210",r={button:R,content:V,label:F,icon:H,hidden:K,loader:M},Q=({variant:p,color:h,size:D,fullWidth:C=!1,loading:n=!1,loadingPosition:s="center",elevated:N=!1,startIcon:L,endIcon:B,shortcut:l,shortcutJoinLabel:g,disabled:y=!1,href:a,render:c,nativeButton:v,role:k,className:S,children:i,..._})=>{const o=(0,m.useContext)(q),z=p??o?.variant??"outline",G=h??o?.color??"neutral",I=D??o?.size??"md",d=t.isDefined(a)&&!t.isDefined(c)&&v!==!0,O=t.isDefined(a)?{href:a}:void 0,b=k??(d?"link":void 0),P=t.isDefined(b)?{role:b}:void 0,j=n&&s==="center",x=n&&s==="start"?(0,e.jsx)(u.Loader,{}):L,f=n&&s==="end"?(0,e.jsx)(u.Loader,{}):B;return(0,e.jsxs)(J.Button,{..._,...O,className:A.mergeClassNames(r.button,S),"data-variant":z,"data-color":G,"data-size":I,"data-full-width":C||void 0,"data-loading":n||void 0,"data-elevated":N||void 0,"aria-busy":n?"true":_["aria-busy"],disabled:y||n,...P,nativeButton:v??!d,render:c??(d?(0,e.jsx)("a",{href:a,children:i}):void 0),children:[(0,e.jsxs)("span",{className:(0,E.clsx)(r.content,j&&r.hidden),children:[t.isDefined(x)&&(0,e.jsx)("span",{className:r.icon,"aria-hidden":!0,children:x}),t.isDefined(i)&&(0,e.jsx)("span",{className:r.label,children:i}),t.isDefined(f)&&(0,e.jsx)("span",{className:r.icon,"aria-hidden":!0,children:f}),t.isDefined(l)&&(0,e.jsx)(w.Shortcut,{shortcut:l,sequenceJoinLabel:g,variant:"button",visibility:"desktop","aria-hidden":!0})]}),j&&(0,e.jsx)("span",{className:r.loader,"aria-hidden":!0,children:(0,e.jsx)(u.Loader,{})})]})};Object.defineProperty(exports,"Button",{enumerable:!0,get:function(){return Q}});Object.defineProperty(exports,"ButtonGroupContext",{enumerable:!0,get:function(){return q}});