@surflane/ui 0.4.0 → 0.6.0

package/dist/css/rules/toolbar.css

@@ -0,0 +1,62 @@
+/* Toolbar, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+
+@layer surflane.components {
+  .pui-toolbar-button[aria-pressed='true'] {
+    background: var(--selected);
+    border-color: var(--control-border);
+    color: var(--ink);
+  }
+  .pui-toolbar-button[data-disabled],
+  .pui-toolbar-input[data-disabled] {
+    opacity: var(--control-disabled-opacity);
+    cursor: not-allowed;
+  }
+  .pui-toolbar {
+    padding: var(--space-1);
+    border-radius: var(--radius-md);
+    background: var(--surface);
+    gap: var(--space-2);
+  }
+  .pui-toolbar-group {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--space-1);
+    min-width: 0;
+  }
+  .pui-toolbar-button,
+  .pui-toolbar-link {
+    background: transparent;
+    border: 0;
+    border-radius: max(0px, calc(var(--radius-md) - var(--space-1)));
+    text-decoration: none;
+  }
+  .pui-toolbar-input {
+    width: 160px;
+    max-width: 100%;
+    border: 0;
+    border-radius: max(0px, calc(var(--radius-md) - var(--space-1)));
+    background: var(--canvas);
+  }
+  .pui-toolbar-separator {
+    flex: none;
+    background: transparent;
+  }
+  .pui-toolbar-separator[data-orientation='vertical'] {
+    width: 1px;
+    height: 24px;
+    margin-inline: var(--space-1);
+  }
+  .pui-toolbar-separator[data-orientation='horizontal'] {
+    height: 1px;
+    width: 100%;
+    margin-block: var(--space-1);
+  }
+  .pui-toolbar[data-orientation='vertical'] .pui-toolbar-group {
+    flex-direction: column;
+    align-items: stretch;
+    width: 100%;
+  }
+}

package/dist/css/rules/tooltip.css

@@ -0,0 +1,38 @@
+/* Tooltip, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+
+@layer surflane.components {
+  .pui-tooltip-positioner {
+    z-index: var(--layer-tooltip);
+  }
+  .pui-tooltip {
+    border: 0;
+    background: var(--tooltip-background);
+    color: var(--tooltip-foreground);
+    padding: var(--space-2) var(--space-3);
+    max-width: 256px;
+    font-size: var(--type-caption-size);
+    letter-spacing: var(--type-caption-tracking);
+    line-height: var(--type-caption-leading);
+  }
+  /* The shortcut follows the label in the same face, a step quieter. */
+  .pui-tooltip-shortcut {
+    margin-inline-start: var(--space-2);
+    font: inherit;
+    font-variant-numeric: tabular-nums;
+    opacity: 0.72;
+  }
+  @media (forced-colors: active) {
+    .pui-tooltip {
+      background: CanvasText;
+      color: Canvas;
+      forced-color-adjust: none;
+    }
+  }
+}
+@layer surflane.sizes {
+  :where([data-ui-size], [data-ui-size] *).pui-tooltip {
+    padding: var(--ui-tooltip-padding-y) var(--ui-tooltip-padding-x);
+  }
+}

package/dist/css/rules/tree.css

@@ -0,0 +1,98 @@
+/* Tree view, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+
+@layer surflane.components {
+  .pui-tree-scroll {
+    min-inline-size: 0;
+  }
+  .pui-tree-viewport {
+    block-size: 100%;
+  }
+  .pui-tree {
+    position: relative;
+    min-inline-size: 0;
+  }
+  .pui-tree-item {
+    display: flex;
+    align-items: center;
+    gap: var(--space-1);
+    padding-inline-end: var(--space-2);
+    border-radius: var(--radius-md);
+    color: var(--ink);
+    cursor: default;
+    outline-offset: var(--focus-ring-inset);
+    transition: background-color var(--duration-fast) var(--ease-out);
+  }
+  .pui-tree-item:hover {
+    background: var(--interaction-hover-bg);
+  }
+  .pui-tree-item[aria-selected='true'] {
+    background: var(--selected);
+  }
+  .pui-tree-item:focus-visible {
+    outline: var(--focus-ring-width) solid var(--interaction-focus);
+  }
+  .pui-tree-item[aria-disabled='true'] {
+    color: var(--ink-muted);
+  }
+  .pui-tree-toggle,
+  .pui-tree-leaf {
+    inline-size: 32px;
+    block-size: 32px;
+    flex: 0 0 32px;
+  }
+  .pui-tree-toggle {
+    display: grid;
+    place-items: center;
+    padding: 0;
+    border: 0;
+    border-radius: var(--radius-full);
+    background: transparent;
+    color: inherit;
+  }
+  .pui-tree-toggle:hover:not(:disabled) {
+    background: var(--interaction-hover-bg);
+  }
+  .pui-tree-toggle:active:not(:disabled) {
+    background: var(--interaction-active-bg);
+  }
+  .pui-tree-toggle svg[data-expanded] {
+    rotate: 90deg;
+  }
+  .pui-tree:dir(rtl) .pui-tree-toggle svg[data-expanded] {
+    rotate: -90deg;
+  }
+  .pui-tree-label {
+    min-inline-size: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .pui-tree-empty {
+    padding: var(--space-4);
+    color: var(--ink-muted);
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .pui-tree-item {
+      transition: none;
+    }
+  }
+  @media (forced-colors: active) {
+    .pui-tree-item[aria-selected='true'] {
+      background: Highlight;
+      color: HighlightText;
+    }
+    .pui-tree-item[aria-disabled='true'] {
+      color: GrayText;
+    }
+    .pui-tree-item:focus-visible {
+      outline-color: Highlight;
+    }
+  }
+}
+@layer surflane.sizes {
+  :where([data-ui-size], [data-ui-size] *).pui-tree-item {
+    font-size: var(--ui-font);
+  }
+}

package/dist/css/rules/typography.css

@@ -0,0 +1,3 @@
+/* Heading, Text and Prose, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;

package/dist/css/scroll-area.css

@@ -0,0 +1,8 @@
+/* Scroll Area, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/scroll-area.css';

package/dist/css/select.css

@@ -0,0 +1,12 @@
+/* Select, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/field-control.css';
+@import './rules/sizing.css';
+@import './rules/popup.css';
+@import './rules/item.css';
+@import './rules/icon.css';
+@import './rules/select.css';

package/dist/css/separator.css

@@ -0,0 +1,9 @@
+/* Separator, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import '@surflane/design-tokens/presentation/separator.css';
+@import './rules/separator.css';

package/dist/css/sheet.css

@@ -0,0 +1,11 @@
+/* Sheet, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/icon.css';
+@import '@surflane/design-tokens/controls.css';
+@import './rules/panel.css';
+@import './rules/sheet.css';

package/dist/css/sizing.css

@@ -0,0 +1,7 @@
+/* SizeProvider and the size scheme, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';

package/dist/css/skeleton.css

@@ -0,0 +1,8 @@
+/* Skeleton, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/skeleton.css';

package/dist/css/slider.css

@@ -0,0 +1,8 @@
+/* Slider, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/slider.css';

package/dist/css/sparkline.css

@@ -0,0 +1,8 @@
+/* Sparkline, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/sparkline.css';

package/dist/css/spinner.css

@@ -0,0 +1,8 @@
+/* Spinner, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/spinner.css';

package/dist/css/stat.css

@@ -0,0 +1,9 @@
+/* Stat, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/icon.css';
+@import './rules/stat.css';

package/dist/css/styles.css

@@ -0,0 +1,100 @@
+/* Every component stylesheet, once each, in cascade order. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/field-control.css';
+@import './rules/sizing.css';
+@import './rules/input.css';
+@import './rules/popup.css';
+@import './rules/item.css';
+@import './rules/icon.css';
+@import './rules/select.css';
+@import './rules/tooltip.css';
+@import './rules/popover.css';
+@import './rules/button.css';
+@import './rules/menu.css';
+@import './rules/scroll-area.css';
+@import '@surflane/design-tokens/controls.css';
+@import './rules/dialog.css';
+@import './rules/panel.css';
+@import './rules/drawer.css';
+@import './rules/alert-dialog.css';
+@import './rules/form.css';
+@import './rules/field.css';
+@import './rules/fieldset.css';
+@import './rules/choice.css';
+@import './rules/textarea.css';
+@import '@surflane/design-tokens/presentation/table.css';
+@import './rules/table.css';
+@import './rules/checkbox.css';
+@import './rules/radio-group.css';
+@import './rules/switch.css';
+@import './rules/choice-label.css';
+@import './rules/tabs.css';
+@import './rules/disclosure.css';
+@import './rules/accordion.css';
+@import './rules/collapsible.css';
+@import './rules/gauge.css';
+@import './rules/progress.css';
+@import './rules/spinner.css';
+@import './rules/skeleton.css';
+@import './rules/input-group.css';
+@import './rules/combobox.css';
+@import './rules/number-field.css';
+@import './rules/slider.css';
+@import './rules/bar.css';
+@import './rules/toggle.css';
+@import './rules/toolbar.css';
+@import './rules/menubar.css';
+@import './rules/context-menu.css';
+@import '@surflane/design-tokens/presentation/link.css';
+@import './rules/link.css';
+@import './rules/preview-card.css';
+@import './rules/navigation-menu.css';
+@import './rules/otp-field.css';
+@import './rules/toast.css';
+@import '@surflane/design-tokens/presentation/badge.css';
+@import './rules/badge.css';
+@import './rules/file-upload.css';
+@import './rules/filter-bar.css';
+@import './rules/app-shell.css';
+@import './rules/tree.css';
+@import './rules/date-picker.css';
+@import './rules/chart.css';
+@import '@surflane/design-tokens/foundations/layout.css';
+@import './rules/layout.css';
+@import '@surflane/design-tokens/presentation/card.css';
+@import './rules/card.css';
+@import '@surflane/design-tokens/presentation/avatar.css';
+@import './rules/avatar.css';
+@import '@surflane/design-tokens/presentation/list.css';
+@import './rules/list.css';
+@import './rules/stat.css';
+@import './rules/sparkline.css';
+@import '@surflane/design-tokens/presentation/inline-message.css';
+@import './rules/inline-message.css';
+@import './rules/syntax-highlighter.css';
+@import '@surflane/design-tokens/presentation/code.css';
+@import './rules/code.css';
+@import '@surflane/design-tokens/presentation/empty-state.css';
+@import './rules/empty-state.css';
+@import '@surflane/design-tokens/presentation/breadcrumbs.css';
+@import './rules/breadcrumbs.css';
+@import '@surflane/design-tokens/foundations/typography.css';
+@import './rules/typography.css';
+@import './rules/markdown.css';
+@import '@surflane/design-tokens/presentation/separator.css';
+@import './rules/separator.css';
+@import '@surflane/design-tokens/presentation/pagination.css';
+@import './rules/pagination.css';
+@import './rules/bottom-navigation.css';
+@import '@surflane/design-tokens/foundations/page-header.css';
+@import './rules/page-header.css';
+@import './rules/native-select.css';
+@import './rules/autocomplete.css';
+@import './rules/checkbox-group.css';
+@import './rules/toggle-group.css';
+@import './rules/sheet.css';
+@import './rules/meter.css';

package/dist/css/switch.css

@@ -0,0 +1,9 @@
+/* Switch, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/choice.css';
+@import './rules/switch.css';

package/dist/css/syntax-highlighter.css

@@ -0,0 +1,9 @@
+/* Syntax highlighter, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/scroll-area.css';
+@import './rules/syntax-highlighter.css';

package/dist/css/table.css

@@ -0,0 +1,12 @@
+/* Table, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/icon.css';
+@import './rules/button.css';
+@import './rules/scroll-area.css';
+@import '@surflane/design-tokens/presentation/table.css';
+@import './rules/table.css';

package/dist/css/tabs.css

@@ -0,0 +1,8 @@
+/* Tabs, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/tabs.css';

package/dist/css/textarea.css

@@ -0,0 +1,10 @@
+/* Textarea, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/field-control.css';
+@import './rules/sizing.css';
+@import './rules/input.css';
+@import './rules/textarea.css';

package/dist/css/toast.css

@@ -0,0 +1,11 @@
+/* Toast, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/popup.css';
+@import './rules/icon.css';
+@import './rules/button.css';
+@import './rules/toast.css';

package/dist/css/toggle-group.css

@@ -0,0 +1,9 @@
+/* Toggle Group, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/bar.css';
+@import './rules/toggle-group.css';

package/dist/css/toggle.css

@@ -0,0 +1,10 @@
+/* Toggle, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/button.css';
+@import './rules/bar.css';
+@import './rules/toggle.css';

package/dist/css/toolbar.css

@@ -0,0 +1,12 @@
+/* Toolbar, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/field-control.css';
+@import './rules/sizing.css';
+@import './rules/input.css';
+@import './rules/button.css';
+@import './rules/bar.css';
+@import './rules/toolbar.css';

package/dist/css/tooltip.css

@@ -0,0 +1,9 @@
+/* Tooltip, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/popup.css';
+@import './rules/tooltip.css';

package/dist/css/tree.css

@@ -0,0 +1,10 @@
+/* Tree view, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import './rules/icon.css';
+@import './rules/scroll-area.css';
+@import './rules/tree.css';

package/dist/css/typography.css

@@ -0,0 +1,9 @@
+/* Heading, Text and Prose, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+@import '@surflane/design-tokens/tokens.css';
+@import '@surflane/design-tokens/presentation/base.css';
+@import './rules/base.css';
+@import './rules/sizing.css';
+@import '@surflane/design-tokens/foundations/typography.css';
+@import './rules/typography.css';

package/dist/date-picker.js

@@ -1,5 +1,6 @@
 'use client';
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from './icon.js';
 import { useComponentSize } from './sizing.js';
 import { DatePicker as AriaDatePicker, DateInput, DateSegment, Group, Label, Text, FieldError, Calendar, CalendarGrid, CalendarGridHeader, CalendarGridBody, CalendarHeaderCell, CalendarCell, Button, Popover, } from 'react-aria-components/DatePicker';
 import { DateRangePicker as AriaDateRangePicker, RangeCalendar, } from 'react-aria-components/DateRangePicker';
@@ -16,11 +17,11 @@ function FieldHelp({ description, errorMessage, }) {
     return (_jsxs(_Fragment, { children: [description && (_jsx(Text, { slot: 'description', className: 'pui-field-description', children: description })), _jsx(FieldError, { className: 'pui-field-error', children: errorMessage })] }));
 }
 function CalendarButton() {
-    return (_jsx(Button, { className: 'pui-date-trigger', children: _jsxs("svg", { width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.7', "aria-hidden": 'true', children: [_jsx("rect", { x: '3', y: '5', width: '18', height: '16', rx: '3' }), _jsx("path", { d: 'M7 3v4m10-4v4M3 11h18m-12 4h2' })] }) }));
+    return (_jsx(Button, { className: 'pui-date-trigger', children: _jsx(Icon, { name: 'calendar' }) }));
 }
 function CalendarContents() {
     const { locale } = useLocale();
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: 'pui-calendar-header', children: [_jsx(Button, { slot: 'previous', className: 'pui-calendar-nav', children: _jsx("svg", { width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.7', "aria-hidden": 'true', children: _jsx("path", { d: 'm15 6-6 6 6 6' }) }) }), _jsx(Heading, { className: 'pui-calendar-heading' }), _jsx(Button, { slot: 'next', className: 'pui-calendar-nav', children: _jsx("svg", { width: '16', height: '16', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '1.7', "aria-hidden": 'true', children: _jsx("path", { d: 'm9 6 6 6-6 6' }) }) })] }), _jsxs(CalendarGrid, { className: 'pui-calendar-grid', weekdayStyle: 'short', children: [_jsx(CalendarGridHeader, { children: (day) => (_jsx(CalendarHeaderCell, { className: 'pui-calendar-weekday', children: day })) }), _jsx(CalendarGridBody, { children: (date) => (_jsx(CalendarCell, { date: date, className: 'pui-calendar-day', children: ({ formattedDate }) => locale.startsWith('ko') ? `${formattedDate}일` : formattedDate })) })] })] }));
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: 'pui-calendar-header', children: [_jsx(Button, { slot: 'previous', className: 'pui-calendar-nav', children: _jsx(Icon, { name: 'chevron-back' }) }), _jsx(Heading, { className: 'pui-calendar-heading' }), _jsx(Button, { slot: 'next', className: 'pui-calendar-nav', children: _jsx(Icon, { name: 'chevron-forward' }) })] }), _jsxs(CalendarGrid, { className: 'pui-calendar-grid', weekdayStyle: 'short', children: [_jsx(CalendarGridHeader, { children: (day) => (_jsx(CalendarHeaderCell, { className: 'pui-calendar-weekday', children: day })) }), _jsx(CalendarGridBody, { children: (date) => (_jsx(CalendarCell, { date: date, className: 'pui-calendar-day', children: ({ formattedDate }) => locale.startsWith('ko') ? `${formattedDate}일` : formattedDate })) })] })] }));
 }
 function CalendarPopup({ label, range }) {
     const scheme = useComponentSize();

package/dist/dialog.d.ts

@@ -1,9 +1,11 @@
 import * as React from 'react';
+import { type ComponentSizeAlias } from './sizing.js';
 import { Dialog as BaseDialog } from '@base-ui/react/dialog';
-import { AlertDialog as BaseAlertDialog } from '@base-ui/react/alert-dialog';
 /** Visible icon close action; inherits Dialog focus and dismissal behavior. */
 declare const DialogCloseButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@base-ui/react/dialog").DialogCloseProps, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref">, "children"> & React.RefAttributes<HTMLButtonElement>>;
 declare const DialogContent: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/dialog").DialogPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    /** Width and density: small 420px, default 640px, large 840px. */
+    size?: ComponentSizeAlias;
     closeLabel?: string;
     closeDisabled?: boolean;
     focusBoundaryLabel?: string;
@@ -13,6 +15,8 @@ declare const DialogBody: React.ForwardRefExoticComponent<Omit<React.DetailedHTM
 declare function DialogFooter({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
 export declare const Dialog: {
     Content: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/dialog").DialogPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
+        /** Width and density: small 420px, default 640px, large 840px. */
+        size?: ComponentSizeAlias;
         closeLabel?: string;
         closeDisabled?: boolean;
         focusBoundaryLabel?: string;
@@ -33,27 +37,5 @@ export declare const Dialog: {
     createHandle: typeof BaseDialog.createHandle;
     Handle: typeof BaseDialog.Handle;
 };
-declare const AlertDialogContent: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/dialog").DialogPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
-    focusBoundaryLabel?: string;
-} & React.RefAttributes<HTMLDivElement>>;
-export declare const AlertDialog: {
-    Content: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/dialog").DialogPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
-        focusBoundaryLabel?: string;
-    } & React.RefAttributes<HTMLDivElement>>;
-    Header: typeof DialogHeader;
-    Footer: typeof DialogFooter;
-    Root: typeof BaseAlertDialog.Root;
-    Backdrop: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-    Close: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogCloseProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-    Description: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogDescriptionProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
-    Popup: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-    Portal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-    Title: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogTitleProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
-    Trigger: BaseAlertDialog.Trigger;
-    Viewport: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogViewportProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-    Handle: typeof BaseAlertDialog.Handle;
-    createHandle: typeof BaseAlertDialog.createHandle;
-};
-export { AlertDialogContent, DialogContent, DialogHeader, DialogBody, DialogFooter, DialogCloseButton, };
-export declare const AlertDialogBackdrop: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>, AlertDialogClose: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogCloseProps, "ref"> & React.RefAttributes<HTMLButtonElement>>, AlertDialogDescription: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogDescriptionProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>, AlertDialogHandle: typeof BaseAlertDialog.Handle, AlertDialogPopup: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>>, AlertDialogPortal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>, AlertDialogRoot: typeof BaseAlertDialog.Root, AlertDialogTitle: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogTitleProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>, AlertDialogTrigger: BaseAlertDialog.Trigger, AlertDialogViewport: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogViewportProps, "ref"> & React.RefAttributes<HTMLDivElement>>, AlertDialogHeader: typeof DialogHeader, AlertDialogFooter: typeof DialogFooter;
+export { DialogContent, DialogHeader, DialogBody, DialogFooter, DialogCloseButton, };
 export declare const DialogBackdrop: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogBackdropProps, "ref"> & React.RefAttributes<HTMLDivElement>>, DialogClose: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogCloseProps, "ref"> & React.RefAttributes<HTMLButtonElement>>, DialogDescription: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogDescriptionProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>, DialogHandle: typeof BaseDialog.Handle, DialogPopup: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>>, DialogPortal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>, DialogRoot: <Payload>(props: BaseDialog.Root.Props<Payload>) => React.JSX.Element, DialogTitle: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogTitleProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>, DialogTrigger: BaseDialog.Trigger, DialogViewport: React.ForwardRefExoticComponent<Omit<import("@base-ui/react/dialog").DialogViewportProps, "ref"> & React.RefAttributes<HTMLDivElement>>;