@epam/ai-dial-ui-kit 0.15.0-dev.13 → 0.15.0-dev.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +33 -0
- package/dist/CHANGELOG.md +4 -0
- package/dist/DateCellRenderer-Cci6cUvX.cjs +1 -0
- package/dist/{DateCellRenderer-S5QJV-Wp.cjs → DateCellRenderer-Cm09x2e4.cjs} +2 -2
- package/dist/IconButton-CVttu-k-.cjs +1 -0
- package/dist/{JsonEditor-qv1Z0dLX.cjs → JsonEditor-BDe6elKO.cjs} +1 -1
- package/dist/{MarkdownEditor-DHn2pYOJ.cjs → MarkdownEditor-C7BONfsl.cjs} +1 -1
- package/dist/{MarkdownEditor-jQ8nDJfx.cjs → MarkdownEditor-FVzYMdkC.cjs} +1 -1
- package/dist/{MarkdownEditorContainer-Bzcnoemw.cjs → MarkdownEditorContainer-BA94ffC4.cjs} +1 -1
- package/dist/{Switch-CUKClcEz.cjs → Switch-CfxMs3AZ.cjs} +1 -1
- package/dist/components/Dropdown/constants.js +5 -5
- package/dist/components/New/Calendar/constants.js +5 -5
- package/dist/components/New/Dropdown/Dropdown.js +94 -93
- package/dist/components/New/Dropdown/constants.js +3 -3
- package/dist/components/New/InteractiveTooltip/constants.js +2 -2
- package/dist/components/New/Popup/constants.js +3 -3
- package/dist/components/New/Tooltip/constants.js +1 -1
- package/dist/components/Popup/constants.js +8 -8
- package/dist/components/Tooltip/TooltipContent.js +11 -11
- package/dist/components-manifest.json +9 -3
- package/dist/dial-ui-kit.cjs +2 -2
- package/dist/editors.cjs +1 -1
- package/dist/file-manager.cjs +1 -1
- package/dist/grid.cjs +1 -1
- package/dist/index.css +1 -1
- package/dist/lazy-BEsZqouS.cjs +1 -0
- package/dist/merge-classes-BEJXjzkx.cjs +1 -0
- package/dist/node_modules/tailwind-merge/dist/bundle-mjs.js +419 -399
- package/dist/src/components/New/Calendar/constants.d.ts +1 -1
- package/dist/src/components/New/Dropdown/Dropdown.d.ts +9 -1
- package/dist/src/components/New/InteractiveTooltip/constants.d.ts +5 -4
- package/dist/src/components/New/Popup/constants.d.ts +1 -1
- package/dist/src/components/New/Tooltip/constants.d.ts +5 -3
- package/dist/src/components/Popup/constants.d.ts +1 -1
- package/dist/use-file-manager-tabs-Atz7tLcd.cjs +3 -0
- package/dist/utils/merge-classes.js +12 -5
- package/dist/utils/sub-menu-floating.js +11 -11
- package/package.json +1 -1
- package/dist/DateCellRenderer-Ba9tlNbk.cjs +0 -1
- package/dist/IconButton-DWqoaBWf.cjs +0 -1
- package/dist/lazy-tfN4sKhq.cjs +0 -1
- package/dist/merge-classes-Dipy1Ih1.cjs +0 -1
- package/dist/use-file-manager-tabs-Ff6KIQOF.cjs +0 -3
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const u=require("react/jsx-runtime"),s=require("@floating-ui/react"),c=require("react"),x=require("classnames"),F=require("./merge-classes-BEJXjzkx.cjs");var l=(e=>(e.Primary="primary",e.Neutral="neutral",e.Danger="danger",e.Static="static",e.Success="success",e.Secondary="secondary",e.Tertiary="tertiary",e))(l||{}),r=(e=>(e.Solid="solid",e.Outlined="outlined",e.Ghost="ghost",e.Link="link",e))(r||{});const v={[l.Primary]:{[r.Solid]:"dial-primary-solid-button",[r.Ghost]:"dial-primary-ghost-button",[r.Link]:"dial-primary-link-button"},[l.Neutral]:{[r.Outlined]:"dial-neutral-outlined-button"},[l.Danger]:{[r.Solid]:"dial-danger-solid-button",[r.Ghost]:"dial-danger-ghost-button",[r.Outlined]:"dial-danger-outlined-button"},[l.Success]:{[r.Ghost]:"dial-success-ghost-button"},[l.Secondary]:{[r.Ghost]:"dial-secondary-ghost-button"},[l.Tertiary]:{[r.Ghost]:"dial-tertiary-ghost-button"},[l.Static]:{}},S=(e=l.Primary,o=r.Solid)=>{const t=v[e]?.[o];return t||(console.warn(`Could not find Button styles for variant: ${e} and appearance: ${o}. Using default primary solid button styles.`),v[l.Primary][r.Solid])};var h=(e=>(e.Small="small",e.Standard="standard",e.Large="large",e))(h||{});const I=7,A=2,C=c.createContext(null),N=()=>{const e=c.useContext(C);if(e==null)throw new Error("Tooltip components must be wrapped in <Tooltip />");return e},q=({initialOpen:e=!1,placement:o="bottom",isTriggerClickable:t=!1,open:n,onOpenChange:i}={})=>{const[a,p]=c.useState(e),g=c.useRef(null),m=n??a,d=i??p,f=s.useFloating({placement:o,open:m,onOpenChange:d,whileElementsMounted:s.autoUpdate,middleware:[s.offset(I+A),s.flip({crossAxis:o.includes("-"),fallbackAxisSideDirection:"start",padding:5}),s.shift({padding:5}),s.arrow({element:g})]}),M=s.useHover(f.context,{move:!1,enabled:n==null,mouseOnly:t,delay:{open:500,close:0}}),k=s.useFocus(f.context,{enabled:n==null}),P=s.useDismiss(f.context),G=s.useRole(f.context,{role:"tooltip"}),b=s.useInteractions([M,k,P,G]);return c.useEffect(()=>{if(!m)return;const y=f.refs.reference.current;if(!(y instanceof Element))return;const w=new IntersectionObserver(([L])=>{L.isIntersecting||d(!1)},{root:null,threshold:0});return w.observe(y),()=>w.disconnect()},[m,f.refs.reference,d]),c.useMemo(()=>({open:m,setOpen:d,arrowRef:g,...b,...f}),[m,d,b,f])},R=({children:e,...o})=>{const t=q(o);return u.jsx(C.Provider,{value:t,children:e})},T="(hover: none)",_=()=>typeof window>"u"||typeof window.matchMedia!="function"?!1:window.matchMedia(T).matches,D=()=>{const[e,o]=c.useState(()=>!_());return c.useEffect(()=>{if(typeof window>"u"||typeof window.matchMedia!="function")return;const t=window.matchMedia(T);if(o(!t.matches),typeof t.addEventListener!="function")return;const n=i=>o(!i.matches);return t.addEventListener("change",n),()=>t.removeEventListener("change",n)},[]),e},E=({style:e,...o})=>{const t=N(),n=D(),i=c.useRef(null),a=s.useMergeRefs([t.refs.setFloating,i]);return!t.open||!n?null:u.jsx(s.FloatingPortal,{id:"tooltip-portal",children:u.jsxs("div",{ref:a,style:{...t.floatingStyles,...e},...t.getFloatingProps(o),className:x("z-tooltip whitespace-pre-wrap break-words rounded border border-primary bg-layer-0 px-2 py-1 dial-tiny-text shadow max-w-[300px]",t.getFloatingProps(o).className),children:[o.children,u.jsx(s.FloatingArrow,{ref:t.arrowRef,context:t.context,fill:"currentColor",strokeWidth:1,className:"stroke-primary text-[var(--bg-layer-0,_#000000)]"})]})})},H=({children:e,asChild:o=!1,...t})=>{const n=N(),i=o&&c.isValidElement(e),a=i?e.props?.ref:null,p=s.useMergeRefs([n.refs.setReference,...a?[a]:[]]);return i?c.cloneElement(e,n.getReferenceProps({...e.props,...t,ref:p})):u.jsx("span",{ref:p,...n.getReferenceProps(t),className:t.className??"dial-tooltip-trigger text-start",children:e})},j=({hideTooltip:e,tooltip:o,children:t,triggerClassName:n,contentClassName:i,...a})=>u.jsxs(R,{...a,children:[u.jsx(H,{className:x(n,"truncate"),children:t}),u.jsx(E,{className:x("text-primary",i,"max-w-[300px]",(e||!o)&&"hidden"),children:o})]}),O=(...e)=>e.find(o=>typeof o=="string"&&o.length>0),U=({variant:e,appearance:o=r.Solid,size:t=h.Standard,className:n,icon:i,tooltipProps:a,type:p="button",...g})=>{const m=F.mergeClasses(e&&S(e,o),t===h.Small?"h-[24px] w-[24px]":"h-[40px] w-[40px] dial-kit-enhanced-target","dial-icon-button disabled:cursor-not-allowed focus-visible:outline focus-visible:outline-focus outline-offset-0 disabled:text-controls-secondary-disable",n),d=u.jsx("button",{...g,type:p,className:m,"aria-label":O(g["aria-label"],a?.tooltip),children:i});return a?u.jsx(j,{...a,children:d}):d};exports.ButtonAppearance=r;exports.ButtonVariant=l;exports.DialIconButton=U;exports.DialTooltip=j;exports.DialTooltipContainer=R;exports.DialTooltipContent=E;exports.DialTooltipTrigger=H;exports.ElementSize=h;exports.getButtonClassNames=S;exports.resolveAccessibleName=O;exports.useHasHover=D;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),a=require("./lazy-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),a=require("./lazy-BEsZqouS.cjs"),c=require("@monaco-editor/react");function g(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,t.get?t:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const f=g(c),b={[a.EditorThemes.dark]:{base:"vs-dark",inherit:!1,rules:[{token:"string.key.json",foreground:"#37BABC"},{token:"string.value.json",foreground:"#5C8DEA"},{token:"number",foreground:"#D97C27"},{token:"keyword.json",foreground:"#F4CE46"},{token:"delimiter",foreground:"#EEF1F7"},{token:"delimiter.bracket.json",foreground:"#A972FF"},{token:"delimiter.parenthesis",foreground:"#A972FF"}],colors:{"editor.foreground":"#F76464","editor.background":"#161B2D","editorCursor.foreground":"#EEF1F7","editor.selectionBackground":"#5C8DEA2B","editorLineNumber.foreground":"#242C42","scrollbarSlider.background":"#242C42","scrollbarSlider.hoverBackground":"#242C42","scrollbarSlider.activeBackground":"#242C42"}},[a.EditorThemes.light]:{base:"vs",inherit:!1,rules:[{token:"string.key.json",foreground:"#009D9F"},{token:"string.value.json",foreground:"#2764D9"},{token:"number",foreground:"#B25500"},{token:"keyword.json",foreground:"#3F3D25"},{token:"delimiter",foreground:"#161B2D"},{token:"delimiter.bracket.json",foreground:"#7E39EC"},{token:"delimiter.parenthesis",foreground:"#7E39EC"}],colors:{"editor.foreground":"#AE2F2F","editor.background":"#EEF1F7","editorCursor.foreground":"#161B2D","editor.selectionBackground":"#5C8DEA2B","editorLineNumber.foreground":"#242C42","scrollbarSlider.background":"#242C42","scrollbarSlider.hoverBackground":"#242C42","scrollbarSlider.activeBackground":"#242C42"}}},k=({value:e,onChange:o,onValidateJSON:r,options:t,currentTheme:n,themesConfig:s=b})=>{function d(i){i?.editor?.defineTheme(n,s[n]),i.languages.json.jsonDefaults.setDiagnosticsOptions({validate:!0,enableSchemaRequest:!1,schemas:[{uri:"http://custom-schema/object-required.json",fileMatch:["*"],schema:{type:"object",description:"Top-level value must be an object",additionalProperties:!0}}]})}const{Editor:l}=f;return u.jsx(l,{beforeMount:d,height:"100%",defaultLanguage:"json",value:e,onChange:o,theme:n,onValidate:r,options:{minimap:{enabled:!1},formatOnType:!0,formatOnPaste:!0,selectOnLineNumbers:!1,automaticLayout:!0,scrollBeyondLastLine:!1,wordWrap:"on",smoothScrolling:!0,overviewRulerLanes:0,scrollbar:{horizontal:"hidden",verticalScrollbarSize:4,verticalSliderSize:4},...t??{}}})};exports.DialJsonEditor=k;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),j=require("react"),O=require("@uiw/react-md-editor"),_=require("./lazy-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),j=require("react"),O=require("@uiw/react-md-editor"),_=require("./lazy-BEsZqouS.cjs"),k=require("./merge-classes-BEJXjzkx.cjs"),o=require("@tabler/icons-react"),p=require("./icon-DhjrDQ8I.cjs"),f=require("./icon-CrGVkVpG.cjs");function E(n){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const r in n)if(r!=="default"){const c=Object.getOwnPropertyDescriptor(n,r);Object.defineProperty(i,r,c.get?c:{enumerable:!0,get:()=>n[r]})}}return i.default=n,Object.freeze(i)}const b=E(O),L=f.DIAL_ICON_SIZE.SM,t={size:L,stroke:p.DIAL_KIT_ICON_STROKE},s=(n,i)=>({...n,icon:i}),M=()=>{const{bold:n,code:i,divider:r,group:c,heading1:a,heading2:d,heading3:u,italic:l,link:m,orderedListCommand:I,quote:x,strikethrough:g,table:h,unorderedListCommand:C}=b;return[s(n,e.jsx(o.IconBold,{...t})),s(l,e.jsx(o.IconItalic,{...t})),s(g,e.jsx(o.IconStrikethrough,{...t})),r,c([a,d,u],{name:"heading",groupName:"heading",icon:e.jsx(o.IconTextSize,{...t}),buttonProps:{"aria-label":"Text style",title:"Text style"}}),r,s(C,e.jsx(o.IconList,{...t})),s(I,e.jsx(o.IconListNumbers,{...t})),r,s(x,e.jsx(o.IconQuote,{...t})),s(m,e.jsx(o.IconLink,{...t})),s(i,e.jsx(o.IconCode,{...t})),r,s(h,e.jsx(o.IconTable,{...t}))]},S=()=>{const{codeEdit:n,codeLive:i,codePreview:r,divider:c,fullscreen:a}=b;return[s(n,e.jsx(o.IconPencil,{...t})),s(i,e.jsx(o.IconLayoutColumns,{...t})),s(r,e.jsx(o.IconEye,{...t})),c,s(a,e.jsx(o.IconMaximize,{...t}))]},T=({value:n,onChange:i,height:r=300,theme:c=_.EditorThemes.light,className:a,placeholder:d,defaultPreview:u="edit",id:l,ariaLabel:m})=>{const I=j.useMemo(()=>M(),[]),x=j.useMemo(()=>S(),[]);return e.jsx("div",{"data-color-mode":c,className:k.mergeClasses("dial-kit-markdown-editor",a),children:e.jsx(O,{value:n,onChange:g=>i?.(g||""),height:r,preview:u,commands:I,extraCommands:x,textareaProps:{placeholder:d,id:l,"aria-label":m}})})};exports.MarkdownEditor=T;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("@uiw/react-md-editor"),m=require("./lazy-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("@uiw/react-md-editor"),m=require("./lazy-BEsZqouS.cjs"),u=require("./merge-classes-BEJXjzkx.cjs"),x=({value:t,onChange:s,height:o=300,preview:i="edit",theme:a=m.EditorThemes.dark,className:n,placeholder:r})=>{const d=r!==void 0&&!t;return e.jsxs("div",{"data-color-mode":a,className:u.mergeClasses("relative",n),children:[e.jsx(c,{value:t,onChange:l=>s?.(l||""),height:o,preview:i}),d&&e.jsx("div",{className:"pointer-events-none absolute left-0 top-8 px-2 dial-small-text text-secondary opacity-40",children:r})]})};exports.DialMarkdownEditor=x;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),m=require("./Switch-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),m=require("./Switch-CfxMs3AZ.cjs"),E=require("./lazy-BEsZqouS.cjs"),N=require("./MarkdownEditor-FVzYMdkC.cjs"),b=({value:r,onChangeValue:l,label:i,headerContent:a,switcherLabel:d,height:c=300,theme:u=E.EditorThemes.dark,onValidateJSON:x,preview:j="edit"})=>{const w=n.useId(),[t,C]=n.useState(!1),[f,p]=n.useState(null);n.useEffect(()=>{t&&typeof window<"u"&&Promise.resolve().then(()=>require("./JsonEditor-BDe6elKO.cjs")).then(s=>{p(()=>s.DialJsonEditor)})},[t]);const h=n.useCallback(s=>{l?.(s)},[l]),S=n.useCallback(s=>{x?.(s)},[x]),o=!!d;return e.jsx("div",{className:"size-full flex flex-col",children:e.jsx("div",{className:"flex flex-col gap-8",children:e.jsxs("div",{children:[(i||a||o)&&e.jsxs("div",{className:"flex justify-between items-center mb-2",children:[i&&e.jsx(m.DialLabel,{label:i}),e.jsxs("div",{className:"flex items-center gap-2 flex-1 justify-end",children:[a,o&&e.jsx("label",{className:"flex items-center gap-2 cursor-pointer",children:e.jsx(m.DialSwitch,{isOn:t,label:d,switchId:w,onChange:s=>C(s)})})]})]}),o&&t?e.jsx("div",{className:"border border-primary rounded",style:{height:`${c}px`},children:f&&e.jsx(f,{value:r,onChange:h,onValidateJSON:S,currentTheme:u})}):e.jsx(N.DialMarkdownEditor,{value:r,onChange:h,height:c,preview:j,theme:u})]})})})};exports.DialMarkdownEditorContainer=b;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const e=require("react/jsx-runtime"),p=require("./merge-classes-
|
|
1
|
+
"use strict";const e=require("react/jsx-runtime"),p=require("./merge-classes-BEJXjzkx.cjs"),d=require("@tabler/icons-react"),i=require("./IconButton-CVttu-k-.cjs"),f=require("./icon-CrGVkVpG.cjs"),l=require("classnames"),h=require("react"),y="w-[24px] h-[24px] border border-solid rounded-[6px] border-transparent flex items-center justify-center text-secondary hover:text-controls-accent-primary-hover active:text-controls-accent-primary-active",o=({caption:t,onClick:a})=>{if(!t)return null;const s=e.jsx(i.DialIconButton,{"aria-label":t,className:y,icon:e.jsx(d.IconInfoCircle,{size:f.DIAL_ICON_SIZE.SM}),onClick:a});return t?e.jsx(i.DialTooltip,{tooltip:t,triggerClassName:"flex justify-center items-center",children:s}):s},j=({label:t,required:a,className:s,caption:r,...n})=>t?e.jsxs("label",{...n,className:p.mergeClasses("dial-tiny-text text-secondary flex items-center gap-1",s),children:[typeof t=="string"?e.jsx("span",{className:"min-h-4",children:t}):t,a&&e.jsx("span",{className:"text-accent-primary",children:"*"}),e.jsx(o,{caption:r})]}):null,N=({label:t,switchId:a,isOn:s=!1,disabled:r,onChange:n,caption:c})=>{const x=l("flex shrink-0 w-[36px] h-[18px] cursor-pointer items-center gap-1 rounded-full p-0.5 transition-all duration-200",s?"flex-row-reverse":"flex-row",r?"pointer-events-none":"",r?s?"bg-controls-disable":"bg-layer-4":s?"bg-accent-primary":"bg-layer-4"),m=h.useCallback(u=>{u.stopPropagation(),n?.(!s)},[n,s]);return e.jsxs("div",{className:"flex flex-row items-start",role:"switch",children:[e.jsx("input",{type:"checkbox",onChange:m,id:a,disabled:r,className:"invisible size-0",checked:s}),e.jsx("label",{htmlFor:a,className:x,"aria-describedby":c&&"caption",children:e.jsx("span",{className:l("size-3 rounded-full",r?"bg-controls-disable-accent":"bg-controls-enable-primary")})}),(t||c)&&e.jsxs("div",{className:"flex flex-col gap-1 ml-2",children:[t&&e.jsx("span",{className:l("dial-small-text py-[1px]",r?"text-secondary":"text-primary"),"aria-label":"switch-title",children:t}),c&&e.jsx("span",{id:"caption",className:"dial-tiny-text text-secondary",children:c})]})]})};exports.DialInfoButton=o;exports.DialLabel=j;exports.DialSwitch=N;
|
|
@@ -2,11 +2,11 @@ import { jsx as e } from "react/jsx-runtime";
|
|
|
2
2
|
import o from "classnames";
|
|
3
3
|
import { IconChevronRight as r } from "@tabler/icons-react";
|
|
4
4
|
import { DIAL_KIT_CLASS as s } from "../../constants/public-class-names.js";
|
|
5
|
-
const
|
|
5
|
+
const i = o(
|
|
6
6
|
"flex items-center gap-2 align-middle",
|
|
7
7
|
"h-auto px-0 bg-transparent border-0"
|
|
8
|
-
),
|
|
9
|
-
"z-
|
|
8
|
+
), m = o(
|
|
9
|
+
"z-floating overflow-auto rounded bg-layer-0 text-primary shadow focus-visible:outline-none"
|
|
10
10
|
), l = o(
|
|
11
11
|
"flex w-full cursor-pointer items-center gap-3",
|
|
12
12
|
"focus-visible:border-none focus-visible:outline-none",
|
|
@@ -15,12 +15,12 @@ const m = o(
|
|
|
15
15
|
s.menuItem
|
|
16
16
|
), p = "opacity-75 !cursor-not-allowed", c = "text-error", u = "my-1 border-t border-hover border-secondary", b = 4, f = /* @__PURE__ */ e(r, { size: 14 });
|
|
17
17
|
export {
|
|
18
|
-
|
|
18
|
+
i as dropdownBaseClassName,
|
|
19
19
|
u as dropdownDividerClassName,
|
|
20
20
|
b as dropdownGap,
|
|
21
21
|
l as dropdownItemBaseClassName,
|
|
22
22
|
c as dropdownItemDangerClassName,
|
|
23
23
|
p as dropdownItemDisabledClassName,
|
|
24
|
-
|
|
24
|
+
m as dropdownListBaseClassName,
|
|
25
25
|
f as submenuCaretIcon
|
|
26
26
|
};
|
|
@@ -3,18 +3,18 @@ import { IconChevronRight as o, IconChevronLeft as n, IconCalendar as l } from "
|
|
|
3
3
|
import { DIAL_KIT_ICON_STROKE as r } from "../constants/icon.js";
|
|
4
4
|
import { DIAL_ICON_SIZE as t } from "../../../constants/icon.js";
|
|
5
5
|
import { CalendarMode as e } from "../../../types/calendar.js";
|
|
6
|
-
const u = "en-GB",
|
|
6
|
+
const u = "en-GB", f = {
|
|
7
7
|
[e.Date]: "Select date",
|
|
8
8
|
[e.DateTime]: "Select date and time",
|
|
9
9
|
[e.Time]: "--:--",
|
|
10
10
|
[e.Weekday]: "Select day"
|
|
11
|
-
},
|
|
11
|
+
}, x = (
|
|
12
12
|
// TODO: check after design review for input
|
|
13
13
|
"flex w-full items-center justify-between gap-2 rounded-xl border border-secondary bg-layer-raised px-4 py-3 dial-small-text text-primary outline-none transition-colors hover:border-accent-alpha focus-within:border-accent-focus"
|
|
14
14
|
), y = (
|
|
15
15
|
// TODO: check after design review for input
|
|
16
16
|
"!cursor-not-allowed !border-transparent bg-layer-sunken text-control-disable-primary hover:!border-transparent"
|
|
17
|
-
), b = "!border-error", C = "z-
|
|
17
|
+
), b = "!border-error", C = "z-floating flex w-[248px] flex-col gap-4 rounded-lg bg-layer-raised px-2 py-4 shadow-md", h = "flex size-10 items-center justify-center rounded-full dial-small-text text-primary hover:bg-control-accent-alpha-hover hover:text-primary focus:outline-none focus-visible:outline focus-visible:outline-focus", N = "bg-control-accent text-control-permanent", v = "text-accent dial-small-semi-text", D = "text-control-disable-primary", s = "text-secondary", I = /* @__PURE__ */ a(
|
|
18
18
|
l,
|
|
19
19
|
{
|
|
20
20
|
size: t.MD,
|
|
@@ -46,12 +46,12 @@ export {
|
|
|
46
46
|
D as calendarDayOutsideClassName,
|
|
47
47
|
N as calendarDaySelectedClassName,
|
|
48
48
|
v as calendarDayTodayClassName,
|
|
49
|
-
|
|
49
|
+
x as calendarFieldBaseClassName,
|
|
50
50
|
y as calendarFieldDisabledClassName,
|
|
51
51
|
s as calendarFieldIconClassName,
|
|
52
52
|
b as calendarFieldInvalidClassName,
|
|
53
53
|
I as calendarIcon,
|
|
54
|
-
|
|
54
|
+
f as calendarModeDefaultPlaceholder,
|
|
55
55
|
g as calendarNavIcons,
|
|
56
56
|
C as calendarPopoverClassName
|
|
57
57
|
};
|
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
import { jsxs as N, Fragment as A, jsx as n } from "react/jsx-runtime";
|
|
2
|
-
import { useFloatingNodeId as
|
|
3
|
-
import { useState as
|
|
4
|
-
import { InteractiveTooltip as
|
|
5
|
-
import { DIAL_KIT_CLASS as
|
|
6
|
-
import { DropdownTrigger as y, DropdownItemType as
|
|
7
|
-
import { MenuItemMark as
|
|
8
|
-
import { dropdownGap as w, dropdownDividerClassName as
|
|
9
|
-
import { CloseButton as
|
|
10
|
-
import { MenuItem as
|
|
11
|
-
import { useThemeScope as
|
|
2
|
+
import { useFloatingNodeId as ye, useFloating as we, autoUpdate as ve, offset as xe, autoPlacement as Ce, flip as ke, shift as be, size as Ie, useClick as Pe, useHover as Ee, safePolygon as Ne, useDismiss as Ae, useRole as De, useInteractions as Me, FloatingTree as Fe, FloatingNode as Oe, FloatingPortal as Te, FloatingFocusManager as Re } from "@floating-ui/react";
|
|
3
|
+
import { useState as j, useRef as Se, useCallback as m, useId as Le, useEffect as U, useMemo as _e, Fragment as $e } from "react";
|
|
4
|
+
import { InteractiveTooltip as Be } from "../InteractiveTooltip/InteractiveTooltip.js";
|
|
5
|
+
import { DIAL_KIT_CLASS as V } from "../../../constants/public-class-names.js";
|
|
6
|
+
import { DropdownTrigger as y, DropdownItemType as X } from "../../../types/dropdown.js";
|
|
7
|
+
import { MenuItemMark as Ye } from "../../../types/menu-item.js";
|
|
8
|
+
import { dropdownGap as w, dropdownDividerClassName as Ke, dropdownBaseClassName as We, dropdownListBaseClassName as je } from "./constants.js";
|
|
9
|
+
import { CloseButton as Ue } from "../CloseButton/CloseButton.js";
|
|
10
|
+
import { MenuItem as Ve } from "../MenuItem/MenuItem.js";
|
|
11
|
+
import { useThemeScope as Xe } from "../ThemeScope/ThemeScope.js";
|
|
12
12
|
import { mergeClasses as v } from "../../../utils/merge-classes.js";
|
|
13
|
-
import { DropdownSubMenuItem as
|
|
14
|
-
import { resolveItemMark as
|
|
15
|
-
const
|
|
13
|
+
import { DropdownSubMenuItem as qe } from "./DropdownSubMenuItem.js";
|
|
14
|
+
import { resolveItemMark as ze, getItemRole as Ge } from "./item-mark.js";
|
|
15
|
+
const He = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"], [role="option"]', Je = (l) => !l.hasAttribute("disabled") && l.getAttribute("aria-disabled") !== "true", Qe = ["ArrowDown", "ArrowUp", "Home", "End"], Ze = (l, d, u) => {
|
|
16
16
|
if (l === "Home") return 0;
|
|
17
17
|
if (l === "End") return u - 1;
|
|
18
18
|
const a = l === "ArrowDown" ? 1 : -1;
|
|
19
19
|
return d === -1 ? a === 1 ? 0 : u - 1 : (d + a + u) % u;
|
|
20
|
-
},
|
|
20
|
+
}, et = (l) => "clientWidth" in l ? l.clientWidth : l.getBoundingClientRect?.()?.width ?? 0, ht = ({
|
|
21
21
|
children: l,
|
|
22
22
|
items: d,
|
|
23
23
|
onItemClick: u,
|
|
@@ -28,46 +28,47 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
28
28
|
placement: D,
|
|
29
29
|
disabled: i = !1,
|
|
30
30
|
open: M,
|
|
31
|
-
defaultOpen:
|
|
31
|
+
defaultOpen: q = !1,
|
|
32
32
|
onOpenChange: F,
|
|
33
|
-
closable:
|
|
34
|
-
onClose:
|
|
35
|
-
className:
|
|
33
|
+
closable: z = !1,
|
|
34
|
+
onClose: G,
|
|
35
|
+
className: H,
|
|
36
36
|
overlayContentClassName: O,
|
|
37
37
|
separatorClassName: T,
|
|
38
|
-
listClassName:
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
38
|
+
listClassName: J,
|
|
39
|
+
listStyle: R,
|
|
40
|
+
outsidePressIgnoreRef: S,
|
|
41
|
+
outsideClosable: Q = !0,
|
|
42
|
+
allowedPlacements: Z,
|
|
42
43
|
anchorToMouse: x = !1,
|
|
43
44
|
matchReferenceWidth: P = !0,
|
|
44
|
-
maxDropdownHeight:
|
|
45
|
-
initialFocus:
|
|
45
|
+
maxDropdownHeight: L,
|
|
46
|
+
initialFocus: _
|
|
46
47
|
}) => {
|
|
47
|
-
const
|
|
48
|
+
const ee = Xe(), [te, ne] = j(q), E = M !== void 0, c = E ? !!M : te, C = Se(null), [oe, re] = j(!0), o = m(
|
|
48
49
|
(e, t, r) => {
|
|
49
|
-
e &&
|
|
50
|
+
e && re(r !== "hover" && r !== "safe-polygon"), E || ne(e), F?.(e);
|
|
50
51
|
},
|
|
51
52
|
[E, F]
|
|
52
|
-
),
|
|
53
|
-
nodeId:
|
|
53
|
+
), $ = Le(), se = D === void 0, B = ye(), { refs: p, floatingStyles: Y, context: g } = we({
|
|
54
|
+
nodeId: B,
|
|
54
55
|
placement: D,
|
|
55
56
|
open: c,
|
|
56
57
|
onOpenChange: o,
|
|
57
|
-
whileElementsMounted:
|
|
58
|
+
whileElementsMounted: ve,
|
|
58
59
|
middleware: [
|
|
59
|
-
|
|
60
|
-
|
|
60
|
+
xe({ mainAxis: w, crossAxis: 0 }),
|
|
61
|
+
se ? Ce({
|
|
61
62
|
alignment: "start",
|
|
62
63
|
crossAxis: !0,
|
|
63
64
|
padding: w,
|
|
64
|
-
allowedPlacements:
|
|
65
|
-
}) :
|
|
66
|
-
|
|
67
|
-
|
|
65
|
+
allowedPlacements: Z
|
|
66
|
+
}) : ke({ padding: w }),
|
|
67
|
+
be({ padding: w }),
|
|
68
|
+
Ie({
|
|
68
69
|
padding: w,
|
|
69
70
|
apply({ availableWidth: e, availableHeight: t, elements: r }) {
|
|
70
|
-
const s = r.floating, b =
|
|
71
|
+
const s = r.floating, b = et(r.reference);
|
|
71
72
|
s.style.setProperty(
|
|
72
73
|
"--fui-available-height",
|
|
73
74
|
`${Math.floor(t)}px`
|
|
@@ -75,32 +76,32 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
75
76
|
"--reference-width",
|
|
76
77
|
P ? `${Math.round(b)}px` : "0px"
|
|
77
78
|
), P ? s.style.minWidth = `${Math.round(b)}px` : s.style.removeProperty("min-width"), s.style.maxWidth = `${Math.floor(e)}px`;
|
|
78
|
-
const
|
|
79
|
-
s.style.maxHeight = `${
|
|
79
|
+
const W = Math.floor(t);
|
|
80
|
+
s.style.maxHeight = `${L ? Math.min(W, L) : W}px`;
|
|
80
81
|
}
|
|
81
82
|
})
|
|
82
83
|
]
|
|
83
|
-
}), se = Ie(g, {
|
|
84
|
-
enabled: f.includes(y.Click) && !i
|
|
85
84
|
}), le = Pe(g, {
|
|
85
|
+
enabled: f.includes(y.Click) && !i
|
|
86
|
+
}), ie = Ee(g, {
|
|
86
87
|
enabled: f.includes(y.Hover) && !i,
|
|
87
88
|
move: !1,
|
|
88
89
|
restMs: 40,
|
|
89
|
-
handleClose:
|
|
90
|
+
handleClose: Ne(),
|
|
90
91
|
delay: { open: 80, close: 80 }
|
|
91
|
-
}),
|
|
92
|
+
}), ce = Ae(g, {
|
|
92
93
|
bubbles: !0,
|
|
93
94
|
referencePress: !1,
|
|
94
95
|
outsidePress: (e) => {
|
|
95
|
-
if (!
|
|
96
|
+
if (!Q) return !1;
|
|
96
97
|
const t = e.target;
|
|
97
|
-
return !(
|
|
98
|
+
return !(S?.current && t instanceof Node && S.current.contains(t));
|
|
98
99
|
}
|
|
99
|
-
}),
|
|
100
|
-
se,
|
|
100
|
+
}), ae = De(g, { role: "menu" }), { getReferenceProps: de, getFloatingProps: ue } = Me([
|
|
101
101
|
le,
|
|
102
102
|
ie,
|
|
103
|
-
ce
|
|
103
|
+
ce,
|
|
104
|
+
ae
|
|
104
105
|
]), k = m(
|
|
105
106
|
(e, t) => {
|
|
106
107
|
p.setPositionReference({
|
|
@@ -117,7 +118,7 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
117
118
|
});
|
|
118
119
|
},
|
|
119
120
|
[p]
|
|
120
|
-
),
|
|
121
|
+
), fe = m(
|
|
121
122
|
(e) => {
|
|
122
123
|
!f.includes(y.ContextMenu) || i || (e.preventDefault(), x && (k(e.clientX, e.clientY), C.current = document.elementFromPoint(
|
|
123
124
|
e.clientX,
|
|
@@ -125,7 +126,7 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
125
126
|
)), o(!0));
|
|
126
127
|
},
|
|
127
128
|
[x, i, o, k, f]
|
|
128
|
-
),
|
|
129
|
+
), pe = m(
|
|
129
130
|
(e) => {
|
|
130
131
|
!x || i || (f.includes(y.ContextMenu) && c && o(!1), k(e.clientX, e.clientY), C.current = document.elementFromPoint(
|
|
131
132
|
e.clientX,
|
|
@@ -134,29 +135,29 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
134
135
|
},
|
|
135
136
|
[x, i, k, c, f, o]
|
|
136
137
|
);
|
|
137
|
-
|
|
138
|
+
U(() => {
|
|
138
139
|
i && c && o(!1);
|
|
139
140
|
}, [i, c, o]);
|
|
140
|
-
const
|
|
141
|
+
const me = m(
|
|
141
142
|
(e) => {
|
|
142
|
-
if (e.defaultPrevented || !
|
|
143
|
+
if (e.defaultPrevented || !Qe.includes(e.key)) return;
|
|
143
144
|
const t = Array.from(
|
|
144
145
|
e.currentTarget.querySelectorAll(
|
|
145
|
-
|
|
146
|
+
He
|
|
146
147
|
)
|
|
147
|
-
).filter(
|
|
148
|
+
).filter(Je);
|
|
148
149
|
if (t.length === 0) return;
|
|
149
150
|
e.preventDefault();
|
|
150
151
|
const r = e.currentTarget.ownerDocument.activeElement, s = t.findIndex((b) => b === r);
|
|
151
|
-
t[
|
|
152
|
+
t[Ze(e.key, s, t.length)]?.focus();
|
|
152
153
|
},
|
|
153
154
|
[]
|
|
154
|
-
),
|
|
155
|
+
), K = m(
|
|
155
156
|
(e) => (t) => {
|
|
156
157
|
e.disabled || (e.onClick?.({ key: e.key, domEvent: t }), u?.({ key: e.key, domEvent: t }), e.selectable || o(!1));
|
|
157
158
|
},
|
|
158
159
|
[u, o]
|
|
159
|
-
),
|
|
160
|
+
), he = _e(() => I ? I() : d ? /* @__PURE__ */ N(A, { children: [
|
|
160
161
|
a && /* @__PURE__ */ n(A, { children: typeof a == "function" ? a() : a }),
|
|
161
162
|
/* @__PURE__ */ n(
|
|
162
163
|
"div",
|
|
@@ -165,23 +166,23 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
165
166
|
className: v(
|
|
166
167
|
"py-1",
|
|
167
168
|
O,
|
|
168
|
-
|
|
169
|
+
V.dropdownList
|
|
169
170
|
),
|
|
170
171
|
"aria-label": "dropdown",
|
|
171
172
|
children: d.map((e) => {
|
|
172
|
-
if (e.type ===
|
|
173
|
+
if (e.type === X.Divider)
|
|
173
174
|
return /* @__PURE__ */ n(
|
|
174
175
|
"div",
|
|
175
176
|
{
|
|
176
177
|
role: "separator",
|
|
177
178
|
className: v(
|
|
178
|
-
|
|
179
|
+
Ke,
|
|
179
180
|
T
|
|
180
181
|
)
|
|
181
182
|
},
|
|
182
183
|
e.key
|
|
183
184
|
);
|
|
184
|
-
if (e.type ===
|
|
185
|
+
if (e.type === X.PlainText)
|
|
185
186
|
return /* @__PURE__ */ n(
|
|
186
187
|
"div",
|
|
187
188
|
{
|
|
@@ -195,19 +196,19 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
195
196
|
);
|
|
196
197
|
if (e.children?.length)
|
|
197
198
|
return /* @__PURE__ */ n(
|
|
198
|
-
|
|
199
|
+
qe,
|
|
199
200
|
{
|
|
200
201
|
item: e,
|
|
201
202
|
onRootClose: () => o(!1)
|
|
202
203
|
},
|
|
203
204
|
e.key
|
|
204
205
|
);
|
|
205
|
-
const t =
|
|
206
|
-
|
|
206
|
+
const t = ze(e), r = Ge(e), s = /* @__PURE__ */ n(
|
|
207
|
+
Ve,
|
|
207
208
|
{
|
|
208
209
|
role: r,
|
|
209
210
|
"aria-checked": r === "menuitem" ? void 0 : !!e.checked,
|
|
210
|
-
"aria-current": t ===
|
|
211
|
+
"aria-current": t === Ye.Highlight && e.checked ? !0 : void 0,
|
|
211
212
|
"aria-disabled": !!e.disabled,
|
|
212
213
|
disabled: e.disabled,
|
|
213
214
|
mark: t,
|
|
@@ -217,12 +218,12 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
217
218
|
label: e.label,
|
|
218
219
|
className: e.className,
|
|
219
220
|
rightControl: e.rightControl,
|
|
220
|
-
onClick:
|
|
221
|
+
onClick: K(e),
|
|
221
222
|
children: e.renderItem?.(e)
|
|
222
223
|
}
|
|
223
224
|
);
|
|
224
|
-
return /* @__PURE__ */ n(
|
|
225
|
-
|
|
225
|
+
return /* @__PURE__ */ n($e, { children: e.interactiveTooltip ? /* @__PURE__ */ n(
|
|
226
|
+
Be,
|
|
226
227
|
{
|
|
227
228
|
asChild: !0,
|
|
228
229
|
placement: e.interactiveTooltip.placement,
|
|
@@ -236,7 +237,7 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
236
237
|
),
|
|
237
238
|
h && /* @__PURE__ */ n(A, { children: typeof h == "function" ? h() : h })
|
|
238
239
|
] }) : null, [
|
|
239
|
-
|
|
240
|
+
K,
|
|
240
241
|
d,
|
|
241
242
|
h,
|
|
242
243
|
a,
|
|
@@ -244,11 +245,11 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
244
245
|
o,
|
|
245
246
|
O,
|
|
246
247
|
T
|
|
247
|
-
]),
|
|
248
|
-
onContextMenu:
|
|
249
|
-
onMouseDown:
|
|
248
|
+
]), ge = de({
|
|
249
|
+
onContextMenu: fe,
|
|
250
|
+
onMouseDown: pe
|
|
250
251
|
});
|
|
251
|
-
return
|
|
252
|
+
return U(() => {
|
|
252
253
|
if (!c) return;
|
|
253
254
|
const e = p.reference.current;
|
|
254
255
|
let t = null;
|
|
@@ -260,56 +261,56 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
260
261
|
{ root: null, threshold: 0 }
|
|
261
262
|
);
|
|
262
263
|
return r.observe(t), () => r.disconnect();
|
|
263
|
-
}, [c, p.reference, o]), /* @__PURE__ */ n(
|
|
264
|
+
}, [c, p.reference, o]), /* @__PURE__ */ n(Fe, { children: /* @__PURE__ */ N(Oe, { id: B, children: [
|
|
264
265
|
/* @__PURE__ */ n(
|
|
265
266
|
"span",
|
|
266
267
|
{
|
|
267
268
|
ref: p.setReference,
|
|
268
269
|
className: v(
|
|
269
|
-
|
|
270
|
+
We,
|
|
270
271
|
i && "!cursor-not-allowed opacity-75",
|
|
271
|
-
|
|
272
|
-
|
|
272
|
+
H,
|
|
273
|
+
V.dropdown
|
|
273
274
|
),
|
|
274
275
|
"aria-haspopup": "menu",
|
|
275
276
|
"aria-expanded": c,
|
|
276
|
-
"aria-controls":
|
|
277
|
-
...
|
|
277
|
+
"aria-controls": $,
|
|
278
|
+
...ge,
|
|
278
279
|
children: l
|
|
279
280
|
}
|
|
280
281
|
),
|
|
281
|
-
c && /* @__PURE__ */ n(
|
|
282
|
-
|
|
282
|
+
c && /* @__PURE__ */ n(Te, { children: /* @__PURE__ */ n(
|
|
283
|
+
Re,
|
|
283
284
|
{
|
|
284
285
|
context: g,
|
|
285
286
|
modal: !1,
|
|
286
|
-
initialFocus:
|
|
287
|
+
initialFocus: _ !== void 0 ? _ : oe ? 0 : -1,
|
|
287
288
|
returnFocus: !0,
|
|
288
289
|
children: /* @__PURE__ */ N(
|
|
289
290
|
"div",
|
|
290
291
|
{
|
|
291
|
-
id:
|
|
292
|
+
id: $,
|
|
292
293
|
ref: p.setFloating,
|
|
293
|
-
style:
|
|
294
|
+
style: R ? { ...R, ...Y } : Y,
|
|
294
295
|
className: v(
|
|
295
|
-
|
|
296
|
+
je,
|
|
296
297
|
!P && "w-max",
|
|
297
298
|
"overflow-auto",
|
|
298
|
-
|
|
299
|
-
|
|
299
|
+
ee,
|
|
300
|
+
J
|
|
300
301
|
),
|
|
301
|
-
...
|
|
302
|
+
...ue({ onKeyDown: me }),
|
|
302
303
|
children: [
|
|
303
|
-
|
|
304
|
-
|
|
304
|
+
z && /* @__PURE__ */ n("div", { className: "flex items-center justify-between px-2 pt-2", children: /* @__PURE__ */ n(
|
|
305
|
+
Ue,
|
|
305
306
|
{
|
|
306
307
|
ariaLabel: "Close dropdown",
|
|
307
308
|
onClose: (e) => {
|
|
308
|
-
|
|
309
|
+
G?.(e), o(!1);
|
|
309
310
|
}
|
|
310
311
|
}
|
|
311
312
|
) }),
|
|
312
|
-
|
|
313
|
+
he
|
|
313
314
|
]
|
|
314
315
|
}
|
|
315
316
|
)
|
|
@@ -318,5 +319,5 @@ const Ge = '[role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"]
|
|
|
318
319
|
] }) });
|
|
319
320
|
};
|
|
320
321
|
export {
|
|
321
|
-
|
|
322
|
+
ht as Dropdown
|
|
322
323
|
};
|
|
@@ -8,9 +8,9 @@ const C = o(
|
|
|
8
8
|
"flex items-center gap-2 align-middle",
|
|
9
9
|
"h-auto px-0 bg-transparent border-0"
|
|
10
10
|
), f = o(
|
|
11
|
-
"z-
|
|
11
|
+
"z-floating focus-visible:outline-none",
|
|
12
12
|
t
|
|
13
|
-
), b = a, I = "my-1 border-t border-tertiary", N = s,
|
|
13
|
+
), b = a, I = "my-1 border-t border-tertiary", N = s, g = /* @__PURE__ */ r(
|
|
14
14
|
e,
|
|
15
15
|
{
|
|
16
16
|
size: m.SM,
|
|
@@ -24,5 +24,5 @@ export {
|
|
|
24
24
|
N as dropdownGap,
|
|
25
25
|
f as dropdownListBaseClassName,
|
|
26
26
|
b as dropdownSubMenuClassName,
|
|
27
|
-
|
|
27
|
+
g as submenuCaretIcon
|
|
28
28
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
const t = 8, a = 400,
|
|
1
|
+
const t = 8, a = 400, e = "z-interactive-tooltip max-w-[320px] rounded-xl bg-layer-0 p-4 dial-small-text text-primary shadow-md";
|
|
2
2
|
export {
|
|
3
3
|
t as INTERACTIVE_TOOLTIP_GAP,
|
|
4
4
|
a as INTERACTIVE_TOOLTIP_HOVER_OPEN_DELAY,
|
|
5
|
-
|
|
5
|
+
e as interactiveTooltipClassName
|
|
6
6
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { PopupSize as e } from "../../../types/popup.js";
|
|
2
|
-
const a = "z-
|
|
2
|
+
const a = "z-popup flex items-center justify-center bg-backdrop md:p-4 gap-5 p-6", r = "relative flex w-full max-h-full flex-col rounded-xl bg-layer-raised md:h-auto", o = "flex flex-row items-center justify-between px-6 py-4", t = "flex-1 min-w-0 mr-3 truncate dial-h1-text text-primary", s = "border-b border-tertiary", l = "flex flex-row items-center gap-2 px-6 py-4", m = "border-t border-tertiary", x = "flex shrink-0 flex-row items-center gap-2", i = {
|
|
3
3
|
[e.Sm]: "max-w-full md:max-w-[400px]",
|
|
4
4
|
[e.Md]: "max-w-full md:max-w-[800px]",
|
|
5
5
|
[e.Lg]: "max-w-full md:max-w-[1200px]"
|
|
@@ -9,9 +9,9 @@ export {
|
|
|
9
9
|
r as popupBaseClassName,
|
|
10
10
|
l as popupFooterClassName,
|
|
11
11
|
m as popupFooterDividerClassName,
|
|
12
|
-
|
|
12
|
+
o as popupHeaderClassName,
|
|
13
13
|
s as popupHeaderDividerClassName,
|
|
14
14
|
a as popupOverlayBaseClassName,
|
|
15
15
|
i as popupSizeClassMap,
|
|
16
|
-
|
|
16
|
+
t as popupTitleClassName
|
|
17
17
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const t = 7, o = 2, e = 500, r = "fill-control-inverted", s = "z-
|
|
1
|
+
const t = 7, o = 2, e = 500, r = "fill-control-inverted", s = "z-tooltip max-w-[376px] whitespace-pre-wrap break-words rounded-lg bg-control-inverted px-3 py-2 dial-small-text text-control-inverted shadow-xs";
|
|
2
2
|
export {
|
|
3
3
|
o as ARROW_GAP,
|
|
4
4
|
t as ARROW_HEIGHT,
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { PopupSize as
|
|
2
|
-
const
|
|
3
|
-
[
|
|
4
|
-
[
|
|
5
|
-
[
|
|
1
|
+
import { PopupSize as p } from "../../types/popup.js";
|
|
2
|
+
const o = "z-popup flex items-center justify-center bg-blackout md:p-4", s = "divide-tertiary divide-y", i = "flex flex-row justify-between py-4 px-6 items-center", t = {
|
|
3
|
+
[p.Sm]: "dial-sm-popup",
|
|
4
|
+
[p.Md]: "dial-md-popup",
|
|
5
|
+
[p.Lg]: "dial-lg-popup"
|
|
6
6
|
};
|
|
7
7
|
export {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
o as overlayBaseClassName,
|
|
9
|
+
s as popupDividerClassName,
|
|
10
|
+
i as popupHeaderClassName,
|
|
11
11
|
t as popupSizeClassMap
|
|
12
12
|
};
|