@epam/ai-dial-ui-kit 0.14.0-dev.6 → 0.14.0-dev.9
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 +1 -0
- package/dist/CHANGELOG.md +3 -3
- package/dist/{JsonEditor-CQmVvyc3.js → JsonEditor-CwnP07GH.js} +1 -1
- package/dist/{JsonEditor-DpV8EJsP.cjs → JsonEditor-D3v6vYDX.cjs} +1 -1
- package/dist/{MarkdownEditor-ByqdCRg9.js → MarkdownEditor-CfaHfp2e.js} +1 -1
- package/dist/{MarkdownEditor-Dk2ErWQK.cjs → MarkdownEditor-D9M8LvKZ.cjs} +1 -1
- package/dist/{MarkdownEditor-CIH1ew3u.cjs → MarkdownEditor-HO5rwRn7.cjs} +1 -1
- package/dist/{MarkdownEditor-CCsi7d4R.js → MarkdownEditor-K1ldlz5M.js} +1 -1
- package/dist/components-manifest.json +111 -4
- package/dist/dial-ui-kit.cjs.js +1 -1
- package/dist/dial-ui-kit.es.js +40 -39
- package/dist/{index-DQfKTiXa.cjs → index-DD0A-MXM.cjs} +14 -14
- package/dist/{index-CdkIstBB.js → index-Dg0iEirR.js} +3097 -2996
- package/dist/index.css +2 -2
- package/dist/migration-guides/0.14.0/shadow-token-per-step-rename.md +104 -0
- package/dist/migration-guides/README.md +1 -0
- package/dist/src/components/New/Slider/Slider.d.ts +70 -0
- package/dist/src/index.d.ts +2 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -212,6 +212,7 @@ not AAA:
|
|
|
212
212
|
| Clickable `Tag` | 32px tall | A 44px target would overhang 6px per side and swallow the neighbouring chips of a filter row; the tag is already wider than 24px on both axes |
|
|
213
213
|
| `Radio` circle | 20×20 rendered | Reaches 24×24 through `dial-kit-minimum-target`; a 44px target would overhang 12px per side and swallow the adjacent label. Clicking the label selects the radio, so the practical target is wider |
|
|
214
214
|
| `Checkbox` box | 20×20 rendered | Reaches 24×24 through `dial-kit-minimum-target`; a 44px target would overhang 12px per side and swallow the adjacent label. Clicking the label toggles the checkbox, so the practical target is wider |
|
|
215
|
+
| `Slider` track row | 24px tall | The pointer target spans the full track width but is only 24px tall; a 44px row would add 20px of dead space to every form the slider sits in, and the thumb is dragged rather than tapped |
|
|
215
216
|
| `SegmentedControl` segment | 32px tall | Sits 4px from its neighbours inside a 40px track, so a 44px target would overhang 6px per side and swallow the adjacent segments; the segment is already wider than 24px on both axes |
|
|
216
217
|
|
|
217
218
|
Give small-variant controls at least 20px of surrounding space if you need to reach
|
package/dist/CHANGELOG.md
CHANGED
|
@@ -24,14 +24,14 @@ Versions match the git tags on the `development` branch.
|
|
|
24
24
|
- **`Button` and `IconButton` (2.0) — `tooltipProps` is the 2.0 `Tooltip`'s props** — both were still wrapping the 1.0 `DialTooltip`, so a 2.0 button revealed its tooltip in the 1.0 bubble. They now wrap the 2.0 `Tooltip` with `asChild`, which also moves the tooltip's `aria-describedby` from a wrapper `<span>` onto the button itself. `placement` takes the four-sided `TooltipPlacement` enum instead of the full floating-ui `Placement`, so an aligned value such as `'top-start'` no longer compiles, and the trigger `<span>` is gone: a `triggerClassName` now lands on the button, where the classes that used to centre or truncate the wrapper are redundant.
|
|
25
25
|
See [migration guide](migration-guides/0.14.0/button-tooltip-2-0.md).
|
|
26
26
|
|
|
27
|
+
- **Shadow variables renamed per step, and `shadow-md` / `shadow-lg` are one blue layer** — the scale was themed through `--shadow-blue-500` and `--shadow-grey-1000`, so one value carried the blue of all four steps and a theme could not darken `lg` without darkening `xs` by the same amount. Each step now reads its own variable, named after the step instead of the hue: `--shadow-xs-sm-1` / `--shadow-xs-sm-2` for the two layers `xs` and `sm` share, and `--shadow-md` / `--shadow-lg` for the single layer those steps now draw. The old names are **not** in the fallback chain, since one variable cannot map onto four without re-flattening the ramp. `shadow-md` is `0 8px 24px` at blue-500 alpha-4 and `shadow-lg` is `0 8px 44px` at blue-500 alpha-8, both without the grey layer, so `Card`, `Calendar`, `Input`, overlays, tooltips, the collapsible sidebar, `Notification` and card hover all sit lower and softer; in `xs` and `sm` the blue is now the wide layer and the grey the tight one, the reverse of 0.13.0. The `shadow-*` class names are unchanged, and the variable names match `tailwind.config.js` in `ai-dial-chat`.
|
|
28
|
+
See [migration guide](migration-guides/0.14.0/shadow-token-per-step-rename.md).
|
|
29
|
+
|
|
27
30
|
### Changed
|
|
28
31
|
|
|
29
32
|
- **The accent gradient is themed through `--bg-gradient-*` / `--stroke-gradient-*`** — the gradient stops were addressed by their position in one specific gradient (`--bg-control-accent-gradient-hover-from`), so the same colour had a different variable name in every gradient that used it. Each stop is now a numbered token (`--bg-gradient-1`, `--bg-gradient-2-hover`, `--stroke-gradient-1`, …). The `--bg-control-accent-gradient-*` names stay in the fallback chain; the `--stroke-control-accent-gradient-*` names behind the selected tab's underline do **not**, so a theme that sets those must rename them (see the migration guide).
|
|
30
33
|
- **Renamed control variables keep their old names as fallbacks** — every token renamed in this release resolves through its 0.13.0 variable before reaching the light default (e.g. `var(--text-control-disable-primary, var(--text-control-disable-alpha, #848E9C))`). Only the Tailwind class names are breaking; a host themed by the DIAL themes service needs no theme change to keep its colours.
|
|
31
34
|
|
|
32
|
-
- **`shadow-md` and `shadow-lg` are a single blue layer, and the blue in every shadow is alpha-20/4/8** — the scale was carrying a grey layer under the blue one at every size and one `--shadow-blue-500` value (alpha-14) at all four, which the design has since split per size. `shadow-md` is now `0 8px 24px` at blue-500 alpha-4 and `shadow-lg` is `0 8px 44px` at blue-500 alpha-8, both without the grey layer; `shadow-xs` and `shadow-sm` keep their geometry and their grey layer but move to blue-500 alpha-20. Anything using `shadow-md` (`Card`, `Calendar`, `Input`, overlays, tooltips, the collapsible sidebar) or `shadow-lg` (`Notification`, card hover) drops lower and softer than before.
|
|
33
|
-
Each blue layer now reads its own `--shadow-blue-500-alpha-20` / `-4` / `-8` variable so one theme value cannot flatten the ramp, falling back to `--shadow-blue-500` and then to the light default. `shadow` (the `DEFAULT`) and `--shadow-grey-1000` are unchanged.
|
|
34
|
-
|
|
35
35
|
- **2.0 components compose 2.0 tooltips** — `Popup`'s clipped title, `Input`'s disabled-field readout, `Highlight`, and the option labels of `Select` and its submenus were still built on `DialTooltip` / `DialEllipsisTooltip`, so a 2.0 surface revealed its text in the 1.0 bubble. They now use the 2.0 `Tooltip` / `EllipsisTooltip`: the inverted `bg-control-inverted` bubble with an arrow, and no element rendered at all when there is nothing to show. The popup title passes `triggerClassName="truncate"` because the 2.0 trigger no longer forces it. No props change.
|
|
36
36
|
- **Overlay rows follow the multiselect-list-item spec** — a selected row and a hovered row shared one tint (`control-accent-alpha-hover`), so a selected row lit up identically whether or not the pointer was on it, and a disabled row lit up too, since the hover rule applied to every row. Selected now takes the faint `control-accent-alpha` step at rest, hover keeps `control-accent-alpha-hover` for selected and unselected alike, and a disabled row drops both tints and moves from `text-secondary` to `text-control-disable-primary`. `Dropdown` and `Select` both read these from `constants/overlay`, so the whole 2.0 overlay family moves together.
|
|
37
37
|
- **`Select` composes the 2.0 `Checkbox` and `Tag`** — the multi-select options and the Select All row were 1.0 `DialCheckbox` (an 18px box on `before:` pseudo-borders) and the field's selection was rendered with 1.0 `DialTag`. Both are now their 2.0 counterparts, so an option gets the 20px box with the accent fill and the real `indeterminate` DOM property that Select All's mixed state needs to be drawn as mixed, and each tag is the 24px 2.0 pill whose remove button is named after the tag it removes ("Remove Option 1") instead of being reachable only by position. No props change.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./index-DD0A-MXM.cjs"),l=require("@monaco-editor/react"),u={[r.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"}},[r.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"}}},c=({value:n,onChange:t,onValidateJSON:i,options:s,currentTheme:e,themesConfig:d=u})=>{function a(o){o?.editor?.defineTheme(e,d[e]),o.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}}]})}return r.jsxRuntimeExports.jsx(l.Editor,{beforeMount:a,height:"100%",defaultLanguage:"json",value:n,onChange:t,theme:e,onValidate:i,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},...s??{}}})};exports.DialJsonEditor=c;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { j as e, D as z, E as g, m as u } from "./index-
|
|
1
|
+
import { j as e, D as z, E as g, m as u } from "./index-Dg0iEirR.js";
|
|
2
2
|
import { useMemo as r } from "react";
|
|
3
3
|
import h, { divider as i, group as p, heading1 as C, heading2 as E, heading3 as k, bold as L, italic as M, strikethrough as w, unorderedListCommand as b, orderedListCommand as N, quote as T, link as f, code as v, table as O, codeEdit as S, codeLive as _, codePreview as y, fullscreen as D } from "@uiw/react-md-editor";
|
|
4
4
|
import { IconTextSize as P, IconBold as A, IconItalic as R, IconStrikethrough as B, IconList as Z, IconListNumbers as q, IconQuote as F, IconLink as K, IconCode as Q, IconTable as W, IconPencil as G, IconLayoutColumns as H, IconEye as J, IconMaximize as U } from "@tabler/icons-react";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("./index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("./index-DD0A-MXM.cjs"),x=require("react"),e=require("@uiw/react-md-editor"),t=require("@tabler/icons-react"),o=s.DIAL_ICON_SIZE.SM,i=(n,r)=>({...n,icon:r}),p=()=>[i(e.bold,s.jsxRuntimeExports.jsx(t.IconBold,{size:o})),i(e.italic,s.jsxRuntimeExports.jsx(t.IconItalic,{size:o})),i(e.strikethrough,s.jsxRuntimeExports.jsx(t.IconStrikethrough,{size:o})),e.divider,e.group([e.heading1,e.heading2,e.heading3],{name:"heading",groupName:"heading",icon:s.jsxRuntimeExports.jsx(t.IconTextSize,{size:o}),buttonProps:{"aria-label":"Text style",title:"Text style"}}),e.divider,i(e.unorderedListCommand,s.jsxRuntimeExports.jsx(t.IconList,{size:o})),i(e.orderedListCommand,s.jsxRuntimeExports.jsx(t.IconListNumbers,{size:o})),e.divider,i(e.quote,s.jsxRuntimeExports.jsx(t.IconQuote,{size:o})),i(e.link,s.jsxRuntimeExports.jsx(t.IconLink,{size:o})),i(e.code,s.jsxRuntimeExports.jsx(t.IconCode,{size:o})),e.divider,i(e.table,s.jsxRuntimeExports.jsx(t.IconTable,{size:o}))],I=()=>[i(e.codeEdit,s.jsxRuntimeExports.jsx(t.IconPencil,{size:o})),i(e.codeLive,s.jsxRuntimeExports.jsx(t.IconLayoutColumns,{size:o})),i(e.codePreview,s.jsxRuntimeExports.jsx(t.IconEye,{size:o})),e.divider,i(e.fullscreen,s.jsxRuntimeExports.jsx(t.IconMaximize,{size:o}))],R=({value:n,onChange:r,height:d=300,theme:c=s.EditorThemes.light,className:a,placeholder:m,defaultPreview:u="edit"})=>{const j=x.useMemo(()=>p(),[]),l=x.useMemo(()=>I(),[]);return s.jsxRuntimeExports.jsx("div",{"data-color-mode":c,className:s.mergeClasses("dial-kit-markdown-editor",a),children:s.jsxRuntimeExports.jsx(e,{value:n,onChange:E=>r?.(E||""),height:d,preview:u,commands:j,extraCommands:l,textareaProps:{placeholder:m}})})};exports.MarkdownEditor=R;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-DD0A-MXM.cjs"),c=require("@uiw/react-md-editor"),x=({value:t,onChange:s,height:r=300,preview:i="edit",theme:n=e.EditorThemes.dark,className:a,placeholder:o})=>{const d=o!==void 0&&!t;return e.jsxRuntimeExports.jsxs("div",{"data-color-mode":n,className:e.mergeClasses("relative",a),children:[e.jsxRuntimeExports.jsx(c,{value:t,onChange:l=>s?.(l||""),height:r,preview:i}),d&&e.jsxRuntimeExports.jsx("div",{className:"pointer-events-none absolute left-0 top-8 px-2 dial-small-text text-secondary opacity-40",children:o})]})};exports.DialMarkdownEditor=x;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "0.14.0-dev.
|
|
3
|
-
"generatedAt": "2026-08-
|
|
2
|
+
"version": "0.14.0-dev.9",
|
|
3
|
+
"generatedAt": "2026-08-26T17:04:12.916Z",
|
|
4
4
|
"kit": {
|
|
5
5
|
"name": "@epam/ai-dial-ui-kit",
|
|
6
6
|
"description": "A modern UI kit for building AI DIAL interfaces with React",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"setupNotes": "## Next.js Integration\n1. Install the package and peer dependencies that are not currently in your project\n``` bash\nnpm install @epam/ai-dial-ui-kit\nnpm install react react-dom @tabler/icons-react classnames\nnpm install @floating-ui/react monaco-editor @monaco-editor/react\n```\n\n2. Import style in the root layout of the project:\n\n```tsx\n// app/layout.tsx\nimport \"@epam/ai-dial-ui-kit/styles.css\";\n```\n\n3. Usage example\n\n```tsx\n// app/page.tsx\n\"use client\";\nimport { DialPrimaryButton } from \"@epam/ai-dial-ui-kit\";\n\nexport default function Home() {\n return (\n <div className=\"w-full h-full flex flex-col gap-3 items-center justify-center\">\n <h1>Test library</h1>\n <DialPrimaryButton onClick={() => alert('Hello AI DIAL!')} />\n </div>\n );\n}\n```\nSee \"🎨 Theming & Customization\" section in README."
|
|
22
22
|
},
|
|
23
23
|
"styles": "# Typography CSS Utility Classes\n\n## Design-system-compliant classes (`dial-*-text`)\n\nUse these by default. They follow the design system type scale.\n\n| Class | Design name | Weight | Size / Line-height |\n| --------------------------------- | --------------------------- | -------- | ----------------------------------- |\n| `.dial-display1-text` | Display 1 | semibold | 32px / 48px |\n| `.dial-display2-text` | Display 2 | semibold | 28px / 40px |\n| `.dial-display3-text` | Display 3 | semibold | 22px / 32px |\n| `.dial-h1-text` | Heading 1 | semibold | 20px / 28px |\n| `.dial-h2-text` | Heading 2 | semibold | 18px / 26px |\n| `.dial-h3-text` | Heading 3 | semibold | 16px / 24px |\n| `.dial-body-text` | Body Text | normal | 16px / 24px |\n| `.dial-body-semi-text` | Body Text (Semi Bold) | semibold | 16px / 24px |\n| `.dial-body-paragraph-text` | Body Paragraph | normal | 16px / 26px |\n| `.dial-body-paragraph-semi-text` | Body Paragraph (Semi Bold) | semibold | 16px / 26px |\n| `.dial-small-text` | Small Text | normal | 14px / 20px |\n| `.dial-small-semi-text` | Small Text (Semi Bold) | semibold | 14px / 20px |\n| `.dial-small-paragraph-text` | Small Paragraph | normal | 14px / 24px |\n| `.dial-small-paragraph-semi-text` | Small Paragraph (Semi Bold) | semibold | 14px / 24px |\n| `.dial-tiny-text` | Tiny Text | normal | 12px / 16px |\n| `.dial-tiny-lead-text` | Tiny Text Lead | normal | 12px / 16px (+0.03em, uppercase) |\n| `.dial-tiny-semi-text` | Tiny Text (Semi Bold) | semibold | 12px / 16px |\n| `.dial-tiny-lead-semi-text` | Tiny Text Lead (Semi Bold) | semibold | 12px / 16px (+0.03em, uppercase) |\n| `.dial-caption-text` | Caption | normal | 10px / 12px |\n| `.dial-caption-lead-semi-text` | Caption Lead (Semi Bold) | semibold | 10px / 12px (+0.06em, uppercase) |\n| `.dial-code-text` | Code | normal | 14px / 20px (Fira Code / monospace) |\n\nThe three `*-lead-*` classes apply `text-transform: uppercase` themselves — pass them the sentence-case string, not a pre-uppercased one, so the accessible name stays readable.\n\n`.dial-code-text` resolves its family through `var(--theme-font-mono, var(--font-fira-code, 'Fira Code'))` before falling back to the system monospace stack. The kit ships no font file; the host provides the face.\n\n## Legacy classes (avoid in new code)\n\nClasses like `dial-h1`, `dial-h2`, `dial-body`, `dial-small*`, `dial-tiny*`, `dial-caption` are legacy. They can be used in legacy projects if user explicidly specify they need legacy typography.\n\n## Raw SCSS source\n",
|
|
24
|
-
"theming": "# Theming & CSS Variable Tokens\n\nAI DIAL UI Kit uses CSS custom properties (variables) for theming.\nDark and light themes are switched by setting different values for these variables on `:root` or a theme wrapper element.\n\n## Usage in Tailwind\n\nThe Tailwind config maps CSS variables to utility classes.\nUse these classes in your components:\n\n```tsx\n// Backgrounds\n<div className=\"bg-layer-0\" /> // darkest background\n<div className=\"bg-layer-1\" /> // main content area\n<div className=\"bg-layer-2\" /> // elevated panels\n\n// Text\n<span className=\"text-primary\" /> // main text color\n<span className=\"text-secondary\" /> // muted text\n<span className=\"text-error\" /> // error state\n\n// Borders\n<div className=\"border border-primary\" /> // standard border\n<div className=\"border border-error\" /> // error border\n```\n\n## Override CSS Variables\n\n```css\n:root {\n --bg-layer-0: #000000;\n --bg-layer-1: #0c101d;\n --bg-layer-2: #161b2d;\n --bg-layer-3: #1d2439;\n --text-primary: #eef1f7;\n --text-secondary: #9fa6bd;\n --text-error: #f76464;\n --stroke-primary: #696e7c;\n --controls-bg-accent-primary: #3664e2;\n /* ... see tailwind.config.js for full list */\n}\n```\n\n## Token Reference\n\n\n### backgroundsColors\n| Tailwind class suffix | CSS variable | Default value |\n|---|---|---|\n| `layer-sunken` | `var(--bg-layer-sunken)` | `#EEF1F7` |\n| `layer-base` | `var(--bg-layer-base)` | `#F5F7FA` |\n| `layer-raised` | `var(--bg-layer-raised)` | `#FCFCFC` |\n| `gradient-1` | `var(--bg-gradient-1)` | `#1D4ED8` |\n| `gradient-1-hover` | `var(--bg-gradient-1-hover)` | `#6785FB` |\n| `gradient-1-active` | `var(--bg-gradient-1-active)` | `#1D4ED8` |\n| `gradient-2` | `var(--bg-gradient-2)` | `#885DF2` |\n| `gradient-2-hover` | `var(--bg-gradient-2-hover)` | `#885DF2` |\n| `gradient-2-active` | `var(--bg-gradient-2-active)` | `#7C3AED` |\n| `control-accent-alpha` | `var(--bg-control-accent-alpha)` | `#2764D90F` |\n| `control-accent-alpha-hover` | `var(--bg-control-accent-alpha-hover)` | `#2764D924` |\n| `control-accent-alpha-active` | `var(--bg-control-accent-alpha-active)` | `#2764D933` |\n| `control-accent` | `var(--bg-control-accent)` | `#1D4ED8` |\n| `control-accent-hover` | `var(--bg-control-accent-hover)` | `#5976E9` |\n| `control-neutral` | `var(--bg-control-neutral)` | `#FCFCFC` |\n| `control-neutral-hover-strong` | `var(--bg-control-neutral-hover-strong)` | `#848E9C` |\n| `control-neutral-active` | `var(--bg-control-neutral-active)` | `#D1DBEA` |\n| `control-neutral-default` | `var(--bg-control-neutral-default)` | `#ACB3C3` |\n| `control-inverted` | `var(--bg-control-inverted)` | `#57647A` |\n| `control-error` | `var(--bg-control-error)` | `#AE2F2F` |\n| `control-error-hover` | `var(--bg-control-error-hover)` | `#BF3939` |\n| `control-error-active` | `var(--bg-control-error-active)` | `#CC4545` |\n| `control-error-alpha-hover` | `var(--bg-control-error-alpha-hover)` | `#F764641A` |\n| `control-error-alpha-active` | `var(--bg-control-error-alpha-active)` | `#F7646433` |\n| `control-disable-secondary` | `var(--bg-control-disable-secondary)` | `#ACB3C3` |\n| `green-1` | `var(--bg-visual-green-1)` | `#CDE8E5` |\n| `green-2` | `var(--bg-visual-green-2)` | `#D1F0DC` |\n| `violet-1` | `var(--bg-visual-violet-1)` | `#DDE3F9` |\n| `violet-2` | `var(--bg-visual-violet-2)` | `#F1E9FF` |\n\n### borderColors\n| Tailwind class suffix | CSS variable | Default value |\n|---|---|---|\n| `accent-alpha` | `var(--stroke-accent-alpha)` | `#2764D933` |\n| `gradient-1` | `var(--stroke-gradient-1)` | `#5976E9` |\n| `gradient-2` | `var(--stroke-gradient-2)` | `#885DF2` |\n| `accent-focus` | `var(--stroke-focus
|
|
24
|
+
"theming": "# Theming & CSS Variable Tokens\n\nAI DIAL UI Kit uses CSS custom properties (variables) for theming.\nDark and light themes are switched by setting different values for these variables on `:root` or a theme wrapper element.\n\n## Usage in Tailwind\n\nThe Tailwind config maps CSS variables to utility classes.\nUse these classes in your components:\n\n```tsx\n// Backgrounds\n<div className=\"bg-layer-0\" /> // darkest background\n<div className=\"bg-layer-1\" /> // main content area\n<div className=\"bg-layer-2\" /> // elevated panels\n\n// Text\n<span className=\"text-primary\" /> // main text color\n<span className=\"text-secondary\" /> // muted text\n<span className=\"text-error\" /> // error state\n\n// Borders\n<div className=\"border border-primary\" /> // standard border\n<div className=\"border border-error\" /> // error border\n```\n\n## Override CSS Variables\n\n```css\n:root {\n --bg-layer-0: #000000;\n --bg-layer-1: #0c101d;\n --bg-layer-2: #161b2d;\n --bg-layer-3: #1d2439;\n --text-primary: #eef1f7;\n --text-secondary: #9fa6bd;\n --text-error: #f76464;\n --stroke-primary: #696e7c;\n --controls-bg-accent-primary: #3664e2;\n /* ... see tailwind.config.js for full list */\n}\n```\n\n## Token Reference\n\n\n### backgroundsColors\n| Tailwind class suffix | CSS variable | Default value |\n|---|---|---|\n| `layer-sunken` | `var(--bg-layer-sunken)` | `#EEF1F7` |\n| `layer-base` | `var(--bg-layer-base)` | `#F5F7FA` |\n| `layer-raised` | `var(--bg-layer-raised)` | `#FCFCFC` |\n| `gradient-1` | `var(--bg-gradient-1)` | `#1D4ED8` |\n| `gradient-1-hover` | `var(--bg-gradient-1-hover)` | `#6785FB` |\n| `gradient-1-active` | `var(--bg-gradient-1-active)` | `#1D4ED8` |\n| `gradient-2` | `var(--bg-gradient-2)` | `#885DF2` |\n| `gradient-2-hover` | `var(--bg-gradient-2-hover)` | `#885DF2` |\n| `gradient-2-active` | `var(--bg-gradient-2-active)` | `#7C3AED` |\n| `control-accent-alpha` | `var(--bg-control-accent-alpha)` | `#2764D90F` |\n| `control-accent-alpha-hover` | `var(--bg-control-accent-alpha-hover)` | `#2764D924` |\n| `control-accent-alpha-active` | `var(--bg-control-accent-alpha-active)` | `#2764D933` |\n| `control-accent` | `var(--bg-control-accent)` | `#1D4ED8` |\n| `control-accent-hover` | `var(--bg-control-accent-hover)` | `#5976E9` |\n| `control-neutral` | `var(--bg-control-neutral)` | `#FCFCFC` |\n| `control-neutral-hover-strong` | `var(--bg-control-neutral-hover-strong)` | `#848E9C` |\n| `control-neutral-active` | `var(--bg-control-neutral-active)` | `#D1DBEA` |\n| `control-neutral-default` | `var(--bg-control-neutral-default)` | `#ACB3C3` |\n| `control-inverted` | `var(--bg-control-inverted)` | `#57647A` |\n| `control-error` | `var(--bg-control-error)` | `#AE2F2F` |\n| `control-error-hover` | `var(--bg-control-error-hover)` | `#BF3939` |\n| `control-error-active` | `var(--bg-control-error-active)` | `#CC4545` |\n| `control-error-alpha-hover` | `var(--bg-control-error-alpha-hover)` | `#F764641A` |\n| `control-error-alpha-active` | `var(--bg-control-error-alpha-active)` | `#F7646433` |\n| `control-disable-secondary` | `var(--bg-control-disable-secondary)` | `#ACB3C3` |\n| `green-1` | `var(--bg-visual-green-1)` | `#CDE8E5` |\n| `green-2` | `var(--bg-visual-green-2)` | `#D1F0DC` |\n| `violet-1` | `var(--bg-visual-violet-1)` | `#DDE3F9` |\n| `violet-2` | `var(--bg-visual-violet-2)` | `#F1E9FF` |\n\n### shadowColors\n| Tailwind class suffix | CSS variable | Default value |\n|---|---|---|\n| `xs-sm-1` | `var(--shadow-xs-sm-1)` | `#2764D933` |\n| `xs-sm-2` | `var(--shadow-xs-sm-2)` | `#161B2D08` |\n\n### borderColors\n| Tailwind class suffix | CSS variable | Default value |\n|---|---|---|\n| `accent-alpha` | `var(--stroke-accent-alpha)` | `#2764D933` |\n| `gradient-1` | `var(--stroke-gradient-1)` | `#5976E9` |\n| `gradient-2` | `var(--stroke-gradient-2)` | `#885DF2` |\n| `accent-focus` | `var(--stroke-accent-focus)` | `#6785FB` |\n| `error-alpha` | `var(--stroke-error-alpha)` | `#AE2F2F73` |\n\n### textColors\n| Tailwind class suffix | CSS variable | Default value |\n|---|---|---|\n| `warning-icon` | `var(--text-warning-icon)` | `#EEC840` |\n| `green-1` | `var(--text-visual-green-1)` | `#059669` |\n| `green-2` | `var(--text-visual-green-2)` | `#0D6E72` |\n| `green-3` | `var(--text-visual-green-3)` | `#065F46` |\n| `brown-1` | `var(--text-visual-brown-1)` | `#D36817` |\n| `brown-2` | `var(--text-visual-brown-2)` | `#B45309` |\n| `violet-1` | `var(--text-visual-violet-1)` | `#7C3AED` |\n| `violet-2` | `var(--text-visual-violet-2)` | `#3730B7` |\n| `control-permanent` | `var(--text-control-permanent)` | `#FCFCFC` |\n| `control-inverted` | `var(--text-control-inverted)` | `#FCFCFC` |\n\n### backgroundsColorsToRemove\n| Tailwind class suffix | CSS variable | Default value |\n|---|---|---|\n| `layer-0` | `var(--bg-layer-0)` | `#FCFCFC` |\n| `layer-1` | `var(--bg-layer-1)` | `#E0E6F0` |\n| `layer-2` | `var(--bg-layer-2)` | `#EEF1F7` |\n| `layer-3` | `var(--bg-layer-3)` | `#FCFCFC` |\n| `layer-4` | `var(--bg-layer-4)` | `#D1DBEA` |\n| `accent-primary-alpha` | `var(--bg-accent-primary-alpha)` | `#7DA4FF26` |\n| `accent-secondary-alpha` | `var(--bg-accent-secondary-alpha)` | `#37BABC2E` |\n| `accent-tertiary-alpha` | `var(--bg-accent-tertiary-alpha)` | `#A972FF2E` |\n| `accent-primary` | `var(--bg-accent-primary)` | `#5C8DEA` |\n| `accent-secondary` | `var(--bg-accent-secondary)` | `#37BABC` |\n| `red-400` | `var(--bg-red-400)` | `#F76464` |\n| `controls-accent-primary` | `var(--controls-bg-accent-primary)` | `#124ACE` |\n| `controls-accent-primary-hover` | `var(--controls-bg-accent-primary-hover)` | `#2656D9` |\n| `controls-accent-primary-active` | `var(--controls-bg-accent-primary-active)` | `#3664E2` |\n| `controls-accent-primary-alpha-active` | `var(--controls-bg-accent-primary-alpha-active)` | `#7DA4FF5C` |\n| `controls-accent-secondary-alpha-active` | `var(--controls-bg-accent-secondary-alpha-active)` | `#37BABC5C` |\n| `controls-accent-tertiary-alpha-active` | `var(--controls-bg-accent-tertiary-alpha-active)` | `#A972FF5C` |\n| `controls-error` | `var(--controls-bg-error)` | `#AE2F2F` |\n| `controls-error-hover` | `var(--controls-bg-error-hover)` | `#BF3939` |\n| `controls-error-active` | `var(--controls-bg-error-active)` | `#CC4545` |\n| `controls-error-alpha-active` | `var(--controls-bg-error-alpha-active)` | `#F764645C` |\n| `controls-disable-accent` | `var(--controls-bg-disable-accent)` | `#7C8293` |\n| `controls-disable` | `var(--controls-bg-disable)` | `#D1DBEA` |\n| `controls-neutral-hover` | `var(--controls-bg-neutral-hover)` | `#D1DBEA` |\n| `controls-neutral-active` | `var(--controls-bg-neutral-active)` | `#9FA6BD` |\n| `controls-accent-success-alpha-hover` | `var(--controls-bg-accent-success-alpha-hover)` | `#37BABC2E` |\n| `controls-accent-success-alpha-active` | `var(--controls-bg-accent-success-alpha-active)` | `#37BABC5C` |\n| `controls-enable-primary` | `var(--controls-enable-primary)` | `#FCFCFC` |\n\n### borderColorsToRemove\n| Tailwind class suffix | CSS variable | Default value |\n|---|---|---|\n| `accent-primary` | `var(--stroke-accent-primary)` | `#124ACE` |\n| `accent-secondary` | `var(--stroke-accent-secondary)` | `#007274` |\n| `controls-accent` | `var(--controls-bg-accent)` | `#5C8DEA` |\n| `red-900` | `var(--red-900)` | `#402027` |\n\n### textColorsToRemove\n| Tailwind class suffix | CSS variable | Default value |\n|---|---|---|\n| `accent-primary` | `var(--text-accent-primary)` | `#7DA4FF` |\n| `accent-secondary` | `var(--text-accent-secondary)` | `#37BABC` |\n| `accent-tertiary` | `var(--text-accent-tertiary)` | `#A972FF` |\n| `controls-permanent` | `var(--controls-text-permanent)` | `#FCFCFC` |\n| `controls-accent-disable` | `var(--controls-text-accent-disable)` | `#D1DBEA` |\n| `controls-primary-disable` | `var(--controls-text-primary-disable)` | `#696E7C` |\n| `controls-secondary-disable` | `var(--controls-text-secondary-disable)` | `#9FA6BD` |\n| `controls-neutral` | `var(--controls-text-neutral)` | `#161B2D` |\n| `controls-accent-primary-hover` | `var(--controls-text-accent-primary-hover)` | `#3664E2` |\n| `controls-accent-primary-active` | `var(--controls-text-accent-primary-active)` | `#7DA4FF` |",
|
|
25
25
|
"components": [
|
|
26
26
|
{
|
|
27
27
|
"name": "Spinner",
|
|
@@ -3060,6 +3060,112 @@
|
|
|
3060
3060
|
],
|
|
3061
3061
|
"sourceFile": "components/New/Search/Search.tsx"
|
|
3062
3062
|
},
|
|
3063
|
+
{
|
|
3064
|
+
"name": "Slider",
|
|
3065
|
+
"category": "Components_2_0",
|
|
3066
|
+
"generation": "2.0",
|
|
3067
|
+
"description": "A range slider from the 2.0 design system.\naliases: RangeInput|TemperatureSlider|RangeSlider\nDesign system 2.0",
|
|
3068
|
+
"props": [
|
|
3069
|
+
{
|
|
3070
|
+
"name": "value",
|
|
3071
|
+
"type": "number",
|
|
3072
|
+
"required": true,
|
|
3073
|
+
"description": "Current slider value"
|
|
3074
|
+
},
|
|
3075
|
+
{
|
|
3076
|
+
"name": "min",
|
|
3077
|
+
"type": "number",
|
|
3078
|
+
"required": false,
|
|
3079
|
+
"defaultValue": "0",
|
|
3080
|
+
"description": "Minimum value"
|
|
3081
|
+
},
|
|
3082
|
+
{
|
|
3083
|
+
"name": "max",
|
|
3084
|
+
"type": "number",
|
|
3085
|
+
"required": false,
|
|
3086
|
+
"defaultValue": "1",
|
|
3087
|
+
"description": "Maximum value"
|
|
3088
|
+
},
|
|
3089
|
+
{
|
|
3090
|
+
"name": "step",
|
|
3091
|
+
"type": "number",
|
|
3092
|
+
"required": false,
|
|
3093
|
+
"defaultValue": "0.1",
|
|
3094
|
+
"description": "Step increment"
|
|
3095
|
+
},
|
|
3096
|
+
{
|
|
3097
|
+
"name": "disabled",
|
|
3098
|
+
"type": "boolean",
|
|
3099
|
+
"required": false,
|
|
3100
|
+
"description": "Whether the slider is disabled"
|
|
3101
|
+
},
|
|
3102
|
+
{
|
|
3103
|
+
"name": "labelProps",
|
|
3104
|
+
"type": "LabelProps",
|
|
3105
|
+
"required": false,
|
|
3106
|
+
"description": "Props of the rendered above the track"
|
|
3107
|
+
},
|
|
3108
|
+
{
|
|
3109
|
+
"name": "labels",
|
|
3110
|
+
"type": "[string, string] | [string, string, string]",
|
|
3111
|
+
"required": false,
|
|
3112
|
+
"description": "2 or 3 strings rendered below the track (start, [middle,] end)"
|
|
3113
|
+
},
|
|
3114
|
+
{
|
|
3115
|
+
"name": "formatValue",
|
|
3116
|
+
"type": "(value: number) => string",
|
|
3117
|
+
"required": false,
|
|
3118
|
+
"description": "Custom formatter for the displayed value; also becomes the announced `aria-valuetext`"
|
|
3119
|
+
},
|
|
3120
|
+
{
|
|
3121
|
+
"name": "showValue",
|
|
3122
|
+
"type": "boolean",
|
|
3123
|
+
"required": false,
|
|
3124
|
+
"defaultValue": "false",
|
|
3125
|
+
"description": "Renders the current value at the end of the label row"
|
|
3126
|
+
},
|
|
3127
|
+
{
|
|
3128
|
+
"name": "caption",
|
|
3129
|
+
"type": "string",
|
|
3130
|
+
"required": false,
|
|
3131
|
+
"description": "Helper text rendered below the track, and described by the slider"
|
|
3132
|
+
},
|
|
3133
|
+
{
|
|
3134
|
+
"name": "error",
|
|
3135
|
+
"type": "string",
|
|
3136
|
+
"required": false,
|
|
3137
|
+
"description": "Error message rendered below the track; replaces the caption"
|
|
3138
|
+
},
|
|
3139
|
+
{
|
|
3140
|
+
"name": "onChange",
|
|
3141
|
+
"type": "(value: number) => void",
|
|
3142
|
+
"required": false,
|
|
3143
|
+
"description": "Callback fired with the new value"
|
|
3144
|
+
},
|
|
3145
|
+
{
|
|
3146
|
+
"name": "containerClassName",
|
|
3147
|
+
"type": "string",
|
|
3148
|
+
"required": false,
|
|
3149
|
+
"description": "Additional classes for the outer container"
|
|
3150
|
+
},
|
|
3151
|
+
{
|
|
3152
|
+
"name": "trackClassName",
|
|
3153
|
+
"type": "string",
|
|
3154
|
+
"required": false,
|
|
3155
|
+
"description": "Additional classes for the unfilled track"
|
|
3156
|
+
},
|
|
3157
|
+
{
|
|
3158
|
+
"name": "fillClassName",
|
|
3159
|
+
"type": "string",
|
|
3160
|
+
"required": false,
|
|
3161
|
+
"description": "Additional classes for the filled portion of the track"
|
|
3162
|
+
}
|
|
3163
|
+
],
|
|
3164
|
+
"examples": [
|
|
3165
|
+
"<Slider\n id=\"temperature\"\n labelProps={{ label: 'Temperature' }}\n value={temperature}\n labels={['Precise', 'Neutral', 'Creative']}\n onChange={setTemperature}\n/>"
|
|
3166
|
+
],
|
|
3167
|
+
"sourceFile": "components/New/Slider/Slider.tsx"
|
|
3168
|
+
},
|
|
3063
3169
|
{
|
|
3064
3170
|
"name": "Tooltip",
|
|
3065
3171
|
"category": "Components_2_0",
|
|
@@ -4298,7 +4404,8 @@
|
|
|
4298
4404
|
"examples": [
|
|
4299
4405
|
"<DialSlider\n value={0.5}\n min={0}\n max={1}\n step={0.1}\n labels={['Precise', 'Neutral', 'Creative']}\n aria-label=\"Temperature\"\n onChange={(v) => console.log(v)}\n/>"
|
|
4300
4406
|
],
|
|
4301
|
-
"sourceFile": "components/Slider/Slider.tsx"
|
|
4407
|
+
"sourceFile": "components/Slider/Slider.tsx",
|
|
4408
|
+
"supersededBy": "Slider"
|
|
4302
4409
|
},
|
|
4303
4410
|
{
|
|
4304
4411
|
"name": "DialNoDataContent",
|
package/dist/dial-ui-kit.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./index-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./index-DD0A-MXM.cjs");exports.Accordion=a.Accordion;exports.AnalyticsCardVariant=a.AnalyticsCardVariant;exports.BASE_ICON_PROPS=a.BASE_ICON_PROPS;exports.BASE_ICON_SIZE=a.BASE_ICON_SIZE;exports.Button=a.Button;exports.ButtonAppearance=a.ButtonAppearance;exports.ButtonDropdown=a.ButtonDropdown;exports.ButtonVariant=a.ButtonVariant;exports.Calendar=a.Calendar;exports.CalendarMode=a.CalendarMode;exports.CaptionText=a.CaptionText;exports.CardShell=a.CardShell;exports.Checkbox=a.Checkbox;exports.CheckboxBox=a.CheckboxBox;exports.CloseButton=a.CloseButton;exports.ConfirmationPopup=a.ConfirmationPopup;exports.ConfirmationPopupVariant=a.ConfirmationPopupVariant;exports.DEFAULT_ANALYTICS_BAR_COLOR_MAP=a.DEFAULT_ANALYTICS_BAR_COLOR_MAP;exports.DEFAULT_GRID_DATE_FORMAT_OPTIONS=a.DEFAULT_DATE_FORMAT_OPTIONS;exports.DEFAULT_GRID_DATE_LOCALE=a.DEFAULT_LOCALE;exports.DIAL_ICON_SIZE=a.DIAL_ICON_SIZE;exports.DangerButton=a.DangerButton;exports.DangerIconButton=a.DangerIconButton;exports.DialAccordion=a.DialAccordion;exports.DialAnalyticsBar=a.DialAnalyticsBar;exports.DialAnalyticsBarGroup=a.DialAnalyticsBarGroup;exports.DialAnalyticsCard=a.DialAnalyticsCard;exports.DialAnalyticsErrorTag=a.DialAnalyticsErrorTag;exports.DialAnalyticsHistogram=a.DialAnalyticsHistogram;exports.DialAutocompleteInputValue=a.DialAutocompleteInputValue;exports.DialBreadcrumb=a.DialBreadcrumb;exports.DialBreadcrumbItem=a.DialBreadcrumbItem;exports.DialButton=a.DialButton;exports.DialButtonDropdown=a.DialButtonDropdown;exports.DialCaptionText=a.DialCaptionText;exports.DialCheckbox=a.DialCheckbox;exports.DialCloseButton=a.DialCloseButton;exports.DialCollapsibleSidebar=a.DialCollapsibleSidebar;exports.DialConditionalResizableContainer=a.DialConditionalResizableContainer;exports.DialConfirmationPopup=a.DialConfirmationPopup;exports.DialDangerButton=a.DialDangerButton;exports.DialDangerIconButton=a.DialDangerIconButton;exports.DialDateCellRenderer=a.DialDateCellRenderer;exports.DialDestinationFolderPopup=a.DialDestinationFolderPopup;exports.DialDraggableItem=a.DialDraggableItem;exports.DialDropdown=a.DialDropdown;exports.DialDropdownIcon=a.DialDropdownIcon;exports.DialEllipsisTooltip=a.DialEllipsisTooltip;exports.DialErrorText=a.DialErrorText;exports.DialFileIcon=a.DialFileIcon;exports.DialFileManager=a.DialFileManager;exports.DialFileManagerActions=a.DialFileManagerActions;exports.DialFileManagerTabs=a.DialFileManagerTabs;exports.DialFileName=a.DialFileName;exports.DialFileNodeType=a.DialFileNodeType;exports.DialFilePermission=a.DialFilePermission;exports.DialFileResourceType=a.DialFileResourceType;exports.DialFolderName=a.DialFolderName;exports.DialFoldersTree=a.DialFoldersTree;exports.DialFormItem=a.DialFormItem;exports.DialFormPopup=a.DialFormPopup;exports.DialGhostButton=a.DialGhostButton;exports.DialGhostIconButton=a.DialGhostIconButton;exports.DialGrid=a.DialGrid;exports.DialIcon=a.DialIcon;exports.DialIconButton=a.DialIconButton;exports.DialInput=a.DialInput;exports.DialInputPopup=a.DialInputPopup;exports.DialItemType=a.DialItemType;exports.DialLabel=a.DialLabel;exports.DialLabelledText=a.DialLabelledText;exports.DialLinkButton=a.DialLinkButton;exports.DialLoadFileArea=a.DialLoadFileArea;exports.DialLoadFileAreaField=a.DialLoadFileAreaField;exports.DialLoader=a.DialLoader;exports.DialNeutralButton=a.DialNeutralButton;exports.DialNeutralIconButton=a.DialNeutralIconButton;exports.DialNoDataContent=a.DialNoDataContent;exports.DialNotification=a.DialNotification;exports.DialNumberInput=a.DialNumberInput;exports.DialPagination=a.DialPagination;exports.DialPasswordInput=a.DialPasswordInput;exports.DialPopup=a.DialPopup;exports.DialPrimaryButton=a.DialPrimaryButton;exports.DialPrimaryIconButton=a.DialPrimaryIconButton;exports.DialRadioButton=a.DialRadioButton;exports.DialRadioGroup=a.DialRadioGroup;exports.DialRadioGroupPopupField=a.DialRadioGroupPopupField;exports.DialRemoveButton=a.DialRemoveButton;exports.DialResizableContainer=a.DialResizableContainer;exports.DialSchemaRenderer=a.DialSchemaRenderer;exports.DialSearch=a.DialSearch;exports.DialSecondaryIconButton=a.DialSecondaryIconButton;exports.DialSegmentedControl=a.DialSegmentedControl;exports.DialSelect=a.DialSelect;exports.DialSelectField=a.DialSelectField;exports.DialSharedEntityIndicator=a.DialSharedEntityIndicator;exports.DialSlider=a.DialSlider;exports.DialSteps=a.DialSteps;exports.DialSuccessIconButton=a.DialSuccessIconButton;exports.DialSwitch=a.DialSwitch;exports.DialTabs=a.DialTabs;exports.DialTag=a.DialTag;exports.DialTagInput=a.DialTagInput;exports.DialTertiaryIconButton=a.DialTertiaryIconButton;exports.DialTextarea=a.DialTextarea;exports.DialTooltip=a.DialTooltip;exports.DialTooltipContainer=a.DialTooltipContainer;exports.DialTooltipContent=a.DialTooltipContent;exports.DialTooltipTrigger=a.DialTooltipTrigger;exports.Dropdown=a.Dropdown;exports.DropdownItemType=a.DropdownItemType;exports.DropdownTrigger=a.DropdownTrigger;exports.DropdownType=a.DropdownType;exports.EDITABLE_CONTAINER_ATTRIBUTE=a.EDITABLE_CONTAINER_ATTRIBUTE;exports.EditorThemes=a.EditorThemes;exports.ElementSize=a.ElementSize;exports.EllipsisTooltip=a.EllipsisTooltip;exports.ErrorMessageNotification=a.ErrorMessageNotification;exports.ErrorText=a.ErrorText;exports.ErrorToastNotification=a.ErrorToastNotification;exports.FabButton=a.FabButton;exports.FileDropzone=a.FileDropzone;exports.FileManagerColumnKey=a.FileManagerColumnKey;exports.FileManagerProvider=a.FileManagerProvider;exports.FlexibleActionsDirection=a.FlexibleActionsDirection;exports.FolderPath=a.FolderPath;exports.FormItemOrientation=a.FormItemOrientation;exports.GeneralMessageNotification=a.GeneralMessageNotification;exports.GeneralToastNotification=a.GeneralToastNotification;exports.GhostButton=a.GhostButton;exports.GhostIconButton=a.GhostIconButton;exports.GridSelectionMode=a.GridSelectionMode;exports.Highlight=a.Highlight;exports.IconButton=a.IconButton;exports.InfoButton=a.InfoButton;exports.InfoMessageNotification=a.InfoMessageNotification;exports.InfoToastNotification=a.InfoToastNotification;exports.InlineSelect=a.InlineSelect;exports.InlineSelectTrigger=a.InlineSelectTrigger;exports.Input=a.Input;exports.JsonSchemaType=a.JsonSchemaType;exports.Label=a.Label;exports.LazyDialJsonEditor=a.LazyDialJsonEditor;exports.LazyDialMarkdownEditor=a.LazyDialMarkdownEditor;exports.LazyMarkdownEditor=a.LazyMarkdownEditor;exports.LinkButton=a.LinkButton;exports.LoadingMessageNotification=a.LoadingMessageNotification;exports.LoadingToastNotification=a.LoadingToastNotification;exports.MultiSelectTags=a.MultiSelectTags;exports.NAME_COLUMN=a.NAME_COLUMN;exports.NOT_ALLOWED_SPACES=a.NOT_ALLOWED_SPACES;exports.NOT_ALLOWED_SPACES_REGEXP=a.NOT_ALLOWED_SPACES_REGEXP;exports.NOT_ALLOWED_SYMBOLS=a.NOT_ALLOWED_SYMBOLS;exports.NOT_ALLOWED_SYMBOLS_REGEXP=a.NOT_ALLOWED_SYMBOLS_REGEXP;exports.NeutralButton=a.NeutralButton;exports.NeutralIconButton=a.NeutralIconButton;exports.Notification=a.Notification;exports.NotificationType=a.NotificationType;exports.NotificationVariant=a.NotificationVariant;exports.NumberInput=a.NumberInput;exports.OutlinedButton=a.OutlinedButton;exports.PasswordInput=a.PasswordInput;exports.Popup=a.Popup;exports.PopupSize=a.PopupSize;exports.PrimaryButton=a.PrimaryButton;exports.PrimaryIconButton=a.PrimaryIconButton;exports.ProgressBar=a.ProgressBar;exports.Radio=a.Radio;exports.RadioGroup=a.RadioGroup;exports.RadioGroupOrientation=a.RadioGroupOrientation;exports.RadioGroupPopupField=a.RadioGroupPopupField;exports.ResizableContainerSide=a.ResizableContainerSide;exports.SIZE_COLUMN=a.SIZE_COLUMN;exports.SchemaDisplayMode=a.SchemaDisplayMode;exports.SchemaOrientation=a.SchemaOrientation;exports.SchemaRendererVariant=a.SchemaRendererVariant;exports.ScreenResolution=a.ScreenResolution;exports.Search=a.Search;exports.SegmentedControl=a.SegmentedControl;exports.Select=a.Select;exports.SelectSize=a.SelectSize;exports.SelectVariant=a.SelectVariant;exports.Skeleton=a.Skeleton;exports.SkeletonAvatarShape=a.SkeletonAvatarShape;exports.SkeletonAvatarSize=a.SkeletonAvatarSize;exports.SkeletonVariant=a.SkeletonVariant;exports.Slider=a.Slider;exports.Spinner=a.Spinner;exports.StaticIconButton=a.StaticIconButton;exports.StepStatus=a.StepStatus;exports.SuccessMessageNotification=a.SuccessMessageNotification;exports.SuccessToastNotification=a.SuccessToastNotification;exports.Switch=a.Switch;exports.TabOrientation=a.TabOrientation;exports.TabView=a.TabView;exports.Tabs=a.Tabs;exports.Tag=a.Tag;exports.TagAppearance=a.TagAppearance;exports.TagInput=a.TagInput;exports.Textarea=a.Textarea;exports.ToggleIconButton=a.ToggleIconButton;exports.Tooltip=a.Tooltip;exports.TooltipContainer=a.TooltipContainer;exports.TooltipContent=a.TooltipContent;exports.TooltipPlacement=a.TooltipPlacement;exports.TooltipTrigger=a.TooltipTrigger;exports.UPDATED_AT_COLUMN=a.UPDATED_AT_COLUMN;exports.WarningMessageNotification=a.WarningMessageNotification;exports.WarningToastNotification=a.WarningToastNotification;exports.convertGridDateToDate=a.convertToDate;exports.editableContainerProps=a.editableContainerProps;exports.matchesAccept=a.matchesAccept;exports.mergeClasses=a.mergeClasses;exports.useDialFileManagerTabs=a.useDialFileManagerTabs;exports.useEditableItem=a.useEditableItem;exports.useFileManagerContext=a.useFileManagerContext;exports.wrapInRootFolder=a.wrapInRootFolder;
|
package/dist/dial-ui-kit.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { A as i, a as o, B as t, b as e, c as n, d as l, e as r, f as c, C as D, g as b, h as u, i as p, k as
|
|
1
|
+
import { A as i, a as o, B as t, b as e, c as n, d as l, e as r, f as c, C as D, g as b, h as u, i as p, k as d, l as T, n as S, o as I, p as B, q as g, r as A, s as C, D as m, t as E, u as N, v as L, w as F, x as P, y as _, z as O, F as M, G as R, H as y, I as h, J as f, K as G, L as w, M as x, N as k, O as z, P as V, Q as U, R as v, S as W, T as Y, U as Z, V as H, W as J, X, Y as q, Z as K, _ as j, $ as Q, a0 as $, a1 as aa, a2 as sa, a3 as ia, a4 as oa, a5 as ta, a6 as ea, a7 as na, a8 as la, a9 as ra, aa as ca, ab as Da, ac as ba, ad as ua, ae as pa, af as da, ag as Ta, ah as Sa, ai as Ia, aj as Ba, ak as ga, al as Aa, am as Ca, an as ma, ao as Ea, ap as Na, aq as La, ar as Fa, as as Pa, at as _a, au as Oa, av as Ma, aw as Ra, ax as ya, ay as ha, az as fa, aA as Ga, aB as wa, aC as xa, aD as ka, aE as za, aF as Va, aG as Ua, aH as va, aI as Wa, aJ as Ya, aK as Za, aL as Ha, aM as Ja, aN as Xa, aO as qa, aP as Ka, aQ as ja, aR as Qa, aS as $a, aT as as, aU as ss, aV as is, aW as os, aX as ts, aY as es, aZ as ns, a_ as ls, a$ as rs, E as cs, b0 as Ds, b1 as bs, b2 as us, b3 as ps, b4 as ds, b5 as Ts, b6 as Ss, b7 as Is, b8 as Bs, b9 as gs, ba as As, bb as Cs, bc as ms, bd as Es, be as Ns, bf as Ls, bg as Fs, bh as Ps, bi as _s, bj as Os, bk as Ms, bl as Rs, bm as ys, bn as hs, bo as fs, bp as Gs, bq as ws, br as xs, bs as ks, bt as zs, bu as Vs, bv as Us, bw as vs, bx as Ws, by as Ys, bz as Zs, bA as Hs, bB as Js, bC as Xs, bD as qs, bE as Ks, bF as js, bG as Qs, bH as $s, bI as ai, bJ as si, bK as ii, bL as oi, bM as ti, bN as ei, bO as ni, bP as li, bQ as ri, bR as ci, bS as Di, bT as bi, bU as ui, bV as pi, bW as di, bX as Ti, bY as Si, bZ as Ii, b_ as Bi, b$ as gi, c0 as Ai, c1 as Ci, c2 as mi, c3 as Ei, c4 as Ni, c5 as Li, c6 as Fi, c7 as Pi, c8 as _i, c9 as Oi, ca as Mi, cb as Ri, cc as yi, cd as hi, ce as fi, cf as Gi, cg as wi, ch as xi, ci as ki, cj as zi, ck as Vi, cl as Ui, cm as vi, cn as Wi, co as Yi, cp as Zi, cq as Hi, cr as Ji, cs as Xi, ct as qi, cu as Ki, cv as ji, cw as Qi, m as $i, cx as ao, cy as so, cz as io, cA as oo } from "./index-Dg0iEirR.js";
|
|
2
2
|
export {
|
|
3
3
|
i as Accordion,
|
|
4
4
|
o as AnalyticsCardVariant,
|
|
@@ -12,8 +12,8 @@ export {
|
|
|
12
12
|
b as CalendarMode,
|
|
13
13
|
u as CaptionText,
|
|
14
14
|
p as CardShell,
|
|
15
|
-
|
|
16
|
-
|
|
15
|
+
d as Checkbox,
|
|
16
|
+
T as CheckboxBox,
|
|
17
17
|
S as CloseButton,
|
|
18
18
|
I as ConfirmationPopup,
|
|
19
19
|
B as ConfirmationPopupVariant,
|
|
@@ -66,8 +66,8 @@ export {
|
|
|
66
66
|
ba as DialGrid,
|
|
67
67
|
ua as DialIcon,
|
|
68
68
|
pa as DialIconButton,
|
|
69
|
-
|
|
70
|
-
|
|
69
|
+
da as DialInput,
|
|
70
|
+
Ta as DialInputPopup,
|
|
71
71
|
Sa as DialItemType,
|
|
72
72
|
Ia as DialLabel,
|
|
73
73
|
Ba as DialLabelledText,
|
|
@@ -120,8 +120,8 @@ export {
|
|
|
120
120
|
bs as EllipsisTooltip,
|
|
121
121
|
us as ErrorMessageNotification,
|
|
122
122
|
ps as ErrorText,
|
|
123
|
-
|
|
124
|
-
|
|
123
|
+
ds as ErrorToastNotification,
|
|
124
|
+
Ts as FabButton,
|
|
125
125
|
Ss as FileDropzone,
|
|
126
126
|
Is as FileManagerColumnKey,
|
|
127
127
|
Bs as FileManagerProvider,
|
|
@@ -174,8 +174,8 @@ export {
|
|
|
174
174
|
bi as RadioGroupPopupField,
|
|
175
175
|
ui as ResizableContainerSide,
|
|
176
176
|
pi as SIZE_COLUMN,
|
|
177
|
-
|
|
178
|
-
|
|
177
|
+
di as SchemaDisplayMode,
|
|
178
|
+
Ti as SchemaOrientation,
|
|
179
179
|
Si as SchemaRendererVariant,
|
|
180
180
|
Ii as ScreenResolution,
|
|
181
181
|
Bi as Search,
|
|
@@ -187,34 +187,35 @@ export {
|
|
|
187
187
|
Ni as SkeletonAvatarShape,
|
|
188
188
|
Li as SkeletonAvatarSize,
|
|
189
189
|
Fi as SkeletonVariant,
|
|
190
|
-
Pi as
|
|
191
|
-
_i as
|
|
192
|
-
Oi as
|
|
193
|
-
Mi as
|
|
194
|
-
Ri as
|
|
195
|
-
yi as
|
|
196
|
-
hi as
|
|
197
|
-
fi as
|
|
198
|
-
Gi as
|
|
199
|
-
wi as
|
|
200
|
-
xi as
|
|
201
|
-
ki as
|
|
202
|
-
zi as
|
|
203
|
-
Vi as
|
|
204
|
-
Ui as
|
|
205
|
-
vi as
|
|
206
|
-
Wi as
|
|
207
|
-
Yi as
|
|
208
|
-
Zi as
|
|
209
|
-
Hi as
|
|
210
|
-
Ji as
|
|
211
|
-
Xi as
|
|
212
|
-
qi as
|
|
213
|
-
Ki as
|
|
214
|
-
ji as
|
|
215
|
-
Qi as
|
|
216
|
-
$i as
|
|
217
|
-
ao as
|
|
218
|
-
so as
|
|
219
|
-
io as
|
|
190
|
+
Pi as Slider,
|
|
191
|
+
_i as Spinner,
|
|
192
|
+
Oi as StaticIconButton,
|
|
193
|
+
Mi as StepStatus,
|
|
194
|
+
Ri as SuccessMessageNotification,
|
|
195
|
+
yi as SuccessToastNotification,
|
|
196
|
+
hi as Switch,
|
|
197
|
+
fi as TabOrientation,
|
|
198
|
+
Gi as TabView,
|
|
199
|
+
wi as Tabs,
|
|
200
|
+
xi as Tag,
|
|
201
|
+
ki as TagAppearance,
|
|
202
|
+
zi as TagInput,
|
|
203
|
+
Vi as Textarea,
|
|
204
|
+
Ui as ToggleIconButton,
|
|
205
|
+
vi as Tooltip,
|
|
206
|
+
Wi as TooltipContainer,
|
|
207
|
+
Yi as TooltipContent,
|
|
208
|
+
Zi as TooltipPlacement,
|
|
209
|
+
Hi as TooltipTrigger,
|
|
210
|
+
Ji as UPDATED_AT_COLUMN,
|
|
211
|
+
Xi as WarningMessageNotification,
|
|
212
|
+
qi as WarningToastNotification,
|
|
213
|
+
Ki as convertGridDateToDate,
|
|
214
|
+
ji as editableContainerProps,
|
|
215
|
+
Qi as matchesAccept,
|
|
216
|
+
$i as mergeClasses,
|
|
217
|
+
ao as useDialFileManagerTabs,
|
|
218
|
+
so as useEditableItem,
|
|
219
|
+
io as useFileManagerContext,
|
|
220
|
+
oo as wrapInRootFolder
|
|
220
221
|
};
|