@surflane/ui 0.4.0 → 0.6.0

package/dist/css/avatar.css

@@ -0,0 +1,10 @@
+/* Avatar, 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/presentation/avatar.css';
+@import './rules/avatar.css';

package/dist/css/badge.css

@@ -0,0 +1,10 @@
+/* Badge / Status, 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/presentation/badge.css';
+@import './rules/badge.css';

package/dist/css/bottom-navigation.css

@@ -0,0 +1,8 @@
+/* Bottom navigation, 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/bottom-navigation.css';

package/dist/css/breadcrumbs.css

@@ -0,0 +1,12 @@
+/* Breadcrumbs, 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/presentation/link.css';
+@import './rules/link.css';
+@import '@surflane/design-tokens/presentation/breadcrumbs.css';
+@import './rules/breadcrumbs.css';

package/dist/css/button.css

@@ -0,0 +1,8 @@
+/* Button, 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';

package/dist/css/card.css

@@ -0,0 +1,11 @@
+/* Card / Surface, 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/layout.css';
+@import './rules/layout.css';
+@import '@surflane/design-tokens/presentation/card.css';
+@import './rules/card.css';

package/dist/css/chart.css

@@ -0,0 +1,13 @@
+/* Chart, 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';
+@import './rules/chart.css';

package/dist/css/checkbox-group.css

@@ -0,0 +1,9 @@
+/* Checkbox 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/choice.css';
+@import './rules/checkbox-group.css';

package/dist/css/checkbox.css

@@ -0,0 +1,9 @@
+/* Checkbox, 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/checkbox.css';

package/dist/css/choice-label.css

@@ -0,0 +1,9 @@
+/* ChoiceLabel, 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/choice-label.css';

package/dist/css/code.css

@@ -0,0 +1,13 @@
+/* Code block, 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 './rules/syntax-highlighter.css';
+@import '@surflane/design-tokens/presentation/code.css';
+@import './rules/code.css';

package/dist/css/collapsible.css

@@ -0,0 +1,11 @@
+/* Collapsible, 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/disclosure.css';
+@import './rules/collapsible.css';

package/dist/css/combobox.css

@@ -0,0 +1,14 @@
+/* Combobox, 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/popup.css';
+@import './rules/item.css';
+@import './rules/icon.css';
+@import './rules/input-group.css';
+@import './rules/combobox.css';

package/dist/css/context-menu.css

@@ -0,0 +1,15 @@
+/* Context Menu, 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/popup.css';
+@import './rules/item.css';
+@import './rules/icon.css';
+@import './rules/button.css';
+@import './rules/menu.css';
+@import './rules/context-menu.css';

package/dist/css/date-picker.css

@@ -0,0 +1,12 @@
+/* Date / time picker, 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/icon.css';
+@import './rules/field.css';
+@import './rules/date-picker.css';

package/dist/css/dialog.css

@@ -0,0 +1,10 @@
+/* Dialog, 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/dialog.css';

package/dist/css/drawer.css

@@ -0,0 +1,11 @@
+/* Drawer, 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/drawer.css';

package/dist/css/empty-state.css

@@ -0,0 +1,9 @@
+/* Empty state, 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/empty-state.css';
+@import './rules/empty-state.css';

package/dist/css/field.css

@@ -0,0 +1,10 @@
+/* Field, 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/field.css';

package/dist/css/fieldset.css

@@ -0,0 +1,8 @@
+/* Fieldset, 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/fieldset.css';

package/dist/css/file-upload.css

@@ -0,0 +1,17 @@
+/* File upload, 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/icon.css';
+@import './rules/button.css';
+@import './rules/field.css';
+@import './rules/gauge.css';
+@import './rules/progress.css';
+@import '@surflane/design-tokens/presentation/badge.css';
+@import './rules/badge.css';
+@import './rules/file-upload.css';

package/dist/css/filter-bar.css

@@ -0,0 +1,8 @@
+/* Search / filter bar, 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/filter-bar.css';

package/dist/css/form.css

@@ -0,0 +1,8 @@
+/* Form, 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/form.css';

package/dist/css/icon.css

@@ -0,0 +1,8 @@
+/* Icon, 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';

package/dist/css/inline-message.css

@@ -0,0 +1,10 @@
+/* Inline message, 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/presentation/inline-message.css';
+@import './rules/inline-message.css';

package/dist/css/input.css

@@ -0,0 +1,9 @@
+/* Input, 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';

package/dist/css/layout.css

@@ -0,0 +1,9 @@
+/* Container, Stack, Inline, Grid and Surface, 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/layout.css';
+@import './rules/layout.css';

package/dist/css/link.css

@@ -0,0 +1,9 @@
+/* Link, 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/link.css';
+@import './rules/link.css';

package/dist/css/list.css

@@ -0,0 +1,9 @@
+/* List, 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/list.css';
+@import './rules/list.css';

package/dist/css/markdown.css

@@ -0,0 +1,18 @@
+/* Markdown, 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';
+@import './rules/syntax-highlighter.css';
+@import '@surflane/design-tokens/presentation/code.css';
+@import './rules/code.css';
+@import '@surflane/design-tokens/foundations/typography.css';
+@import './rules/typography.css';
+@import './rules/markdown.css';

package/dist/css/menu.css

@@ -0,0 +1,14 @@
+/* Menu, 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/popup.css';
+@import './rules/item.css';
+@import './rules/icon.css';
+@import './rules/button.css';
+@import './rules/menu.css';

package/dist/css/menubar.css

@@ -0,0 +1,9 @@
+/* Menubar, 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/menubar.css';

package/dist/css/meter.css

@@ -0,0 +1,9 @@
+/* Meter, 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/gauge.css';
+@import './rules/meter.css';

package/dist/css/native-select.css

@@ -0,0 +1,13 @@
+/* NativeSelect adapter, 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';
+@import './rules/native-select.css';

package/dist/css/navigation-menu.css

@@ -0,0 +1,11 @@
+/* Navigation Menu, 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/navigation-menu.css';

package/dist/css/number-field.css

@@ -0,0 +1,11 @@
+/* Number Field, 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/icon.css';
+@import './rules/input-group.css';
+@import './rules/number-field.css';

package/dist/css/otp-field.css

@@ -0,0 +1,10 @@
+/* OTP Field, 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/otp-field.css';

package/dist/css/page-header.css

@@ -0,0 +1,11 @@
+/* Page header, 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';
+@import '@surflane/design-tokens/foundations/page-header.css';
+@import './rules/page-header.css';

package/dist/css/pagination.css

@@ -0,0 +1,11 @@
+/* Pagination, 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 '@surflane/design-tokens/presentation/pagination.css';
+@import './rules/pagination.css';

package/dist/css/popover.css

@@ -0,0 +1,9 @@
+/* Popover, 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/popover.css';

package/dist/css/preview-card.css

@@ -0,0 +1,11 @@
+/* Preview Card, 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 '@surflane/design-tokens/presentation/link.css';
+@import './rules/link.css';
+@import './rules/preview-card.css';

package/dist/css/progress.css

@@ -0,0 +1,9 @@
+/* Progress, 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/gauge.css';
+@import './rules/progress.css';

package/dist/css/radio-group.css

@@ -0,0 +1,9 @@
+/* Radio 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/choice.css';
+@import './rules/radio-group.css';

package/dist/css/rules/accordion.css

@@ -0,0 +1,21 @@
+/* Accordion, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+
+@layer surflane.components {
+  .pui-accordion {
+    display: grid;
+    gap: var(--space-2);
+    min-width: 0;
+  }
+  .pui-accordion-header {
+    margin: 0;
+    font: inherit;
+  }
+  .pui-accordion-panel {
+    height: var(--accordion-panel-height);
+  }
+  .pui-accordion-panel[data-ending-style] {
+    pointer-events: none;
+  }
+}

package/dist/css/rules/alert-dialog.css

@@ -0,0 +1,23 @@
+/* Alert Dialog, with the styles of what it renders. */
+@layer surflane.tokens, surflane.themes, surflane.base, surflane.components,
+  surflane.sizes;
+
+@layer surflane.components {
+  .pui-confirm-content {
+    --dialog-width: var(--size-dialog-small);
+  }
+  .pui-confirm-content .pui-dialog-footer {
+    border-top: 0;
+    padding-top: var(--space-2);
+  }
+}
+@layer surflane.sizes {
+  .pui-confirm-content .pui-dialog-header {
+    padding-inline-end: var(--space-6);
+    border-bottom: 0;
+  }
+  :where([data-ui-size], [data-ui-size] *).pui-confirm-content
+    .pui-dialog-header {
+    padding-inline-end: var(--ui-card-padding);
+  }
+}