@epam/ai-dial-ui-kit 0.14.0-dev.3 → 0.14.0-dev.5

package/README.md

@@ -207,8 +207,9 @@ not AAA:
 | `ButtonAppearance.Link` | content | Exempt under the 2.5.5 *Inline* exception; expanding it would overlap surrounding copy |
 | `DialCloseButton` | icon-sized | Renders `h-auto w-auto`, so its target follows the caller's icon size |
 | `DialInfoButton`, `InfoButton` | 24×24 | Fixed small affordance, same overlap constraint as small variants |
-| Standard 2.0 fields (`Input`, `Select`) | 40px tall | The pointer target spans the full field width but stays 4px short of 44 vertically; the height is a shared form design token, not a per-control choice |
+| Standard 2.0 fields (`Input`, `Select`, `RadioGroupPopupField`) | 40px tall | The pointer target spans the full field width but stays 4px short of 44 vertically; the height is a shared form design token, not a per-control choice. `.dial-kit-input` clips its overflow, so the pseudo-element cannot grow the target either |
 | `Tag` remove button | 16×16 rendered | Reaches 24×24 through `dial-kit-minimum-target`; a 44px target would overhang 14px per side and swallow the neighbouring tags of a `TagInput` row |
+| Clickable `Tag` | 24px / 20px tall | A 44px target would overhang 10px per side and swallow the neighbouring chips of a filter row. The 24px tag already clears 24×24; the 20px one reaches it through `dial-kit-minimum-target` |
 | `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 |
 | `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 |
 | `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 |

package/dist/CHANGELOG.md

@@ -15,8 +15,12 @@ Versions match the git tags on the `development` branch.
   See [migration guide](migration-guides/0.14.0/control-color-token-rename.md).
 - **Border token `hover-alpha` removed** — it held the same value as `accent-alpha` (`#2764D933`, blue-500 alpha-20) behind a second variable, so the accent border tint had two names and a theme had to set both to stay consistent. The three hover borders that used it (`Input`, `Tag`, `Calendar`) now use `border-accent-alpha`. Replace `border-hover-alpha` with `border-accent-alpha`; if your theme sets `--stroke-hover-alpha`, move that value to `--stroke-accent-alpha`.
   See [migration guide](migration-guides/0.14.0/control-color-token-rename.md).
+- **`Select` — a multi-select option is one control, not an option wrapping a checkbox** — the row was a `role="option"` wrapper around a real `<input type="checkbox">`, so one choice announced two states (`aria-selected` and `aria-checked`), most of the 40px row was inert, and the overlay's arrow keys could not reach it. It is now a single `option` carrying `aria-selected`, with the box drawn as a decorative element: the whole row selects, Enter and Space toggle it, and the arrow keys walk it as they already walked single-select options. No props change; code that addressed an option through `getByRole('checkbox')` has to ask for the `option` instead. Select All is still a real checkbox.
+  See [migration guide](migration-guides/0.14.0/select-multiselect-option-row.md).
 - **Border tokens `focus-black` → `focus`, `focus-blue` → `accent-focus`** — 0.13.0 renamed `focus` to `focus-black` to name the token after its value; the focus tokens are now named after their role instead, matching `accent` / `accent-alpha` elsewhere in the border scale. `border-focus` / `outline-focus` / `divide-focus` / `stroke-focus` are back to the names they had in 0.12.x, and `focus-blue` becomes `accent-focus`. Both keep their variables (`--stroke-focus-black`, with `--stroke-focus` still in the fallback chain, and `--stroke-focus-blue`) and their colours.
   See [migration guide](migration-guides/0.14.0/focus-border-token-role-naming.md).
+- **`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.
+  See [migration guide](migration-guides/0.14.0/button-tooltip-2-0.md).
 
 ### Changed
 
@@ -26,6 +30,10 @@ Versions match the git tags on the `development` branch.
 - **`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.
   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.
 
+- **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.
+- **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.
+- **`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.
+
 ### Fixed
 
 - **`--stroke-primary` and `--stroke-info` light defaults matched their comments, not their tokens** — `--stroke-primary` fell back to `#6B7280`, Tailwind's own `gray-500`, while every other grey-800 token in the kit is `#57647A`; `--stroke-info` fell back to `#124ACE` where blue-500 is `#1D4ED8`. Both now match the palette. Hosts that define the variables are unaffected.
@@ -41,7 +49,13 @@ Versions match the git tags on the `development` branch.
 - **`Checkbox` (2.0)** — a checkbox on a native input, with the mixed and error states the design defines. `isIndeterminate` takes visual precedence over `isSelected`, announces the control as `mixed`, and sets the native `indeterminate` DOM property that no React prop covers; `invalid` paints the box with `control-error` and sets `aria-invalid` so the failure is announced rather than only shown. Filled states carry the fill alone (`border-transparent`) and lighten to `control-accent-hover` on hover, while the unselected box tints to `control-accent-alpha-hover` behind a `border-accent` rim.
 - **`ToggleIconButton` (2.0)** — an icon button that stays pressed, for a setting the icon itself represents (bookmark, pin, favourite). State rides on `aria-pressed` rather than a swapped accessible name, so it is announced as a toggle and keeps one stable label. It composes the primary ghost `IconButton`, which already supplies the unselected column — secondary-grey icon turning accent on hover, accent-alpha tint on hover and active, grey when disabled — and adds the accent icon at rest plus a `selectedIcon` swap for the filled glyph. Unlike every other 2.0 button it is a rounded square, not a pill, and it wraps the 2.0 `Tooltip` with `asChild` so `aria-describedby` lands on the button rather than a wrapper `<span>`. Defaults to `ElementSize.Small`.
 - **`SegmentedControl` (2.0)** — the generation 2.0 counterpart of `DialSegmentedControl`: pill segments on a sunken track, where the selected one lifts onto the raised surface with `shadow-xs` and an accent icon, and both states tint with accent-alpha on hover and press. It is a `radiogroup` of `radio` segments rather than 1.0's `tablist`/`tab`, which is the accurate role for a control that selects a value instead of revealing a panel; the group is a single tab stop and the arrow keys, `Home` and `End` move the selection, skipping disabled segments. `items` replaces `options` and takes a per-segment `aria-label` so an icon-only segment can still be named, and the group is named with `aria-label` rather than 1.0's `ariaLabel`.
+- **`RadioGroup` (2.0)** — the generation 2.0 counterpart of `DialRadioGroup`: a `radiogroup` of 2.0 `Radio` options under one `Label`, with the group's own `caption` / `error` below them and an item's `content` revealed while that item is selected. `items` replaces `radioButtons` and takes `value` / `label` / `caption` / `content` / `disabled` per option (1.0's `id` / `name`), `value` replaces `activeRadioButton`, and the ten pass-through class props collapse to `optionsClassName`, `radioClassName` and `contentClassName`. The group is named through `aria-labelledby` pointing at the label element itself rather than 1.0's duplicated `aria-label`, so a `Label` caption's info button text stays out of the group's name, and selected content is mounted only while its option is selected instead of rendered and hidden.
+- **`RadioGroupPopupField` (2.0)** — the generation 2.0 counterpart of `DialRadioGroupPopupField`, built from the 2.0 `Popup`, `RadioGroup` and buttons. The collapsed field is a real `<button>` carrying `dial-kit-input`, not 1.0's read-only input inside a button, so the button role, `Enter` / `Space` and the disabled treatment come from the element; it announces its label followed by its current value ("Status, Draft") instead of the fixed `open-popup` label 1.0 gave it. The in-popup selection is now a draft the component holds by default — seeded from `value` on every open, discarded on Cancel, and reported once through `onApply(value)` — so a consumer no longer has to thread `selectedRadioValue` and `onChangeRadioField` through their own state; pass `selectedValue` with `onSelectionChange` when `isValid` has to depend on the live selection.
+- **`Dropdown` (2.0) — multiselect items** — a `DropdownItem` marked `selectable` renders as a multiselect row: a checkbox box before the label, the accent tint while `checked`, `role="menuitemcheckbox"` with the state on `aria-checked`, and a click that leaves the menu open so several rows can be toggled in one visit. Plain items in the same menu still close it on click, so a menu can mix filters with an action. The arrow keys walk the checkbox rows alongside the plain ones. `checked` stays in the caller's state, updated from the item's `onClick` or the menu's `onItemClick`.
+- **`CheckboxBox` (2.0)** — the 20px box a checkbox draws, extracted from `Checkbox` so the two things that need it cannot drift apart. With `htmlFor` it is the `<label for>` that toggles an input, which is how `Checkbox` uses it; without it the box is a decorative `<span>` hidden from assistive technology, which is how a `menuitemcheckbox` row and a multi-select `Select` option use it. `Checkbox` also gains `boxClassName` for the box itself.
+- **`Label` (2.0) — `containerClassName`** — the wrapper holding the `<label>` and its info button was unstylable, so a label used as a flex item could not be allowed to shrink and its text pushed the row wider instead of truncating. `Select`'s multi-select options need exactly that; the new prop applies classes to the wrapper, leaving `className` on the `<label>` as before.
 - **`Radio` and `Checkbox` reach the 24×24 pointer target** — both controls render at 20px, so they take `dial-kit-minimum-target` for WCAG 2.5.8 (AA) and are listed in the README target-size exception table: a 44px enhanced target would overhang 12px per side and swallow the adjacent label.
+- **`Tag` (2.0) — `TagAppearance.Selectable`** — the selectable tag of the design: no rim and no fill until it is selected, then the faint `control-accent-alpha` step, with one `control-accent-alpha-hover` tint shared by the selected and unselected states, so a selected chip cannot read as hovered at rest. It is a toggle rather than a plain button — the state rides on `aria-pressed`, where the outlined tag leaves the accent tint as its only carrier — and a clickable 20px chip takes `dial-kit-minimum-target` to reach the WCAG 2.5.8 minimum, which the 24px one already clears. The borderless chip keeps a transparent border box so both appearances stand the same height in a mixed row. `appearance` defaults to `TagAppearance.Outlined`, so every existing tag, `TagInput` and `MultiSelectTags` included, is unchanged.
 
 ---
 

package/dist/{JsonEditor-0ZT9yNXj.js → JsonEditor-DrC6i27F.js}

@@ -1,4 +1,4 @@
-import { E as o, j as l } from "./index-BVZGIW7V.js";
+import { E as o, j as l } from "./index-jMP1W9V6.js";
 import { Editor as u } from "@monaco-editor/react";
 const c = {
   [o.dark]: {

package/dist/{JsonEditor-EOISr6OE.cjs → JsonEditor-dP4yDdgN.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./index-Ho1ZjGNx.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;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./index-DmEajFx0.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;

package/dist/{MarkdownEditor-Csbic0gz.js → MarkdownEditor-BeNDQecT.js}

@@ -1,4 +1,4 @@
-import { j as e, D as z, E as g, m as u } from "./index-BVZGIW7V.js";
+import { j as e, D as z, E as g, m as u } from "./index-jMP1W9V6.js";
 import { useMemo as r } from "react";
 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";
 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";

package/dist/{MarkdownEditor-D8p7zjZ1.js → MarkdownEditor-CO-k9xZo.js}

@@ -1,4 +1,4 @@
-import { j as e, E as m, m as c } from "./index-BVZGIW7V.js";
+import { j as e, E as m, m as c } from "./index-jMP1W9V6.js";
 import x from "@uiw/react-md-editor";
 const j = ({
   value: o,

package/dist/{MarkdownEditor-vV5rCB3Y.cjs → MarkdownEditor-CSgVi6EZ.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("./index-Ho1ZjGNx.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;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("./index-DmEajFx0.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;

package/dist/{MarkdownEditor-BfeV6-XV.cjs → MarkdownEditor-fskBDR5e.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-Ho1ZjGNx.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;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-DmEajFx0.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;