@bolio-ui/core 3.0.0-alpha.0 → 3.0.0-alpha.1

package/esm/css/TagsInput.css

@@ -0,0 +1,101 @@
+@layer TagsInput {
+.TagsInput-module_withLabel__-n8Kq {
+  display: inline-block;
+  box-sizing: border-box;
+}
+
+.TagsInput-module_field__ieR7N {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.375em;
+  box-sizing: border-box;
+  min-height: var(--input-height);
+  padding: 0.25em 0.625em;
+  border: 1px solid var(--input-border);
+  border-radius: var(--input-radius);
+  background-color: var(--input-bg);
+  cursor: text;
+  transition: border 0.2s ease;
+  background-clip: padding-box;
+}
+
+.TagsInput-module_field__ieR7N:hover {
+  border-color: var(--input-hover-border);
+  background-color: var(--input-hover-bg);
+}
+
+.TagsInput-module_field__ieR7N:focus-within {
+  border-color: var(--input-focus-border);
+}
+
+.TagsInput-module_field__ieR7N.TagsInput-module_disabled__cCN-w {
+  cursor: not-allowed;
+}
+
+.TagsInput-module_tag__dhER4 {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25em;
+  box-sizing: border-box;
+  max-width: 100%;
+  padding: 0.125em 0.25em 0.125em 0.625em;
+  line-height: 1.5;
+  color: var(--tag-color);
+  background-color: var(--tag-bg);
+  border-radius: calc(var(--input-radius) - 2px);
+  overflow-wrap: anywhere;
+}
+
+.TagsInput-module_remove__oullb {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  margin: 0;
+  padding: 0.125em;
+  font: inherit;
+  color: var(--tag-remove-color);
+  background-color: none;
+  border: 0;
+  border-radius: 50%;
+  appearance: none;
+  -webkit-appearance: none;
+  cursor: pointer;
+  background-clip: padding-box;
+}
+
+.TagsInput-module_remove__oullb:hover:not(:disabled) {
+  color: var(--tag-remove-hover-color);
+}
+
+.TagsInput-module_remove__oullb:focus-visible {
+  outline: 2px solid var(--input-focus-border);
+}
+
+.TagsInput-module_remove__oullb:disabled {
+  cursor: not-allowed;
+  opacity: 0.5;
+}
+
+.TagsInput-module_input__RFYNn {
+  flex: 1;
+  min-width: 6em;
+  margin: 0;
+  padding: 0;
+  font: inherit;
+  color: var(--input-color);
+  background-color: transparent;
+  border: none;
+  outline: none;
+}
+
+.TagsInput-module_input__RFYNn::placeholder {
+  color: var(--input-placeholder-color);
+}
+
+.TagsInput-module_input__RFYNn:disabled {
+  cursor: not-allowed;
+}
+
+}

package/esm/css/Textarea.css

@@ -13,6 +13,7 @@
     color 0.2s ease 0s;
   min-width: 12.5rem;
   max-width: 95vw;
+  background-clip: padding-box;
 }
 
 .Textarea-module_wrapper__AgIvs:hover {

package/esm/css/Toggle.css

@@ -36,6 +36,7 @@
   border: 1px solid transparent;
   background-color: var(--toggle-bg);
   padding: 0;
+  background-clip: padding-box;
 }
 
 .Toggle-module_inner__aQgyY {

package/esm/css/Tree.css

@@ -0,0 +1,88 @@
+@layer Tree {
+.Tree-module_tree__2jgbS {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  color: var(--tree-color);
+}
+
+.Tree-module_group__H2325 {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.Tree-module_item__wk8rO {
+  margin: 0;
+  padding: 0;
+  outline: none;
+}
+
+.Tree-module_row__lm4LA {
+  display: flex;
+  align-items: center;
+  gap: 0.375em;
+  box-sizing: border-box;
+  padding: 0.375em 0.5em 0.375em calc(0.5em + var(--tree-level) * 1.25em);
+  cursor: pointer;
+  user-select: none;
+  border-radius: var(--tree-radius);
+  transition:
+    background-color 0.15s ease,
+    color 0.15s ease;
+}
+
+.Tree-module_row__lm4LA:hover {
+  background: var(--tree-hover-bg);
+}
+
+.Tree-module_selected__DwSTb,
+.Tree-module_selected__DwSTb:hover {
+  color: var(--tree-selected-color);
+  background: var(--tree-selected-bg);
+}
+
+.Tree-module_item__wk8rO:focus-visible > .Tree-module_row__lm4LA {
+  outline: 2px solid var(--tree-focus);
+  outline-offset: -2px;
+}
+
+.Tree-module_disabled__9ghlS,
+.Tree-module_disabled__9ghlS:hover {
+  color: var(--tree-disabled-color);
+  cursor: not-allowed;
+  background: transparent;
+}
+
+.Tree-module_chevron__V-147 {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  width: 1em;
+  height: 1em;
+}
+
+.Tree-module_chevronIcon__YhP38 {
+  transition: transform 0.15s ease;
+}
+
+.Tree-module_open__kBS5H {
+  transform: rotate(90deg);
+}
+
+.Tree-module_icon__wiWbw {
+  display: inline-flex;
+  flex-shrink: 0;
+  color: var(--tree-icon-color);
+}
+
+.Tree-module_label__EoRFb {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+}

package/esm/css/use-toasts-toast-item.css

@@ -12,6 +12,7 @@
   box-shadow: var(--toast-item-shadow);
   transition: all 350ms cubic-bezier(0.1, 0.2, 0.1, 1);
   overflow: hidden;
+  background-clip: padding-box;
 }
 
 .toast-item-module_message__qzTg9 {

package/esm/index.d.ts

@@ -18,6 +18,8 @@ export { default as Capacity } from './Capacity';
 export type { CapacityProps } from './Capacity';
 export { default as Card } from './Card';
 export type { CardProps, CardContentProps, CardFooterProps } from './Card';
+export { default as Carousel } from './Carousel';
+export type { CarouselProps } from './Carousel';
 export { default as Checkbox } from './Checkbox';
 export type { CheckboxProps, CheckboxGroupProps } from './Checkbox';
 export { default as Code } from './Code';
@@ -26,12 +28,18 @@ export { default as Col } from './Col';
 export type { ColProps } from './Col';
 export { default as Collapse } from './Collapse';
 export type { CollapseProps, CollapseGroupProps } from './Collapse';
+export { default as ColorInput } from './ColorInput';
+export type { ColorInputProps } from './ColorInput';
+export { default as ColorPicker } from './ColorPicker';
+export type { ColorPickerProps } from './ColorPicker';
 export { default as Combobox } from './Combobox';
 export type { ComboboxProps, ComboboxOption } from './Combobox';
 export { default as Container } from './Container';
 export type { ContainerProps } from './Container';
 export { default as DatePicker } from './DatePicker';
 export type { DatePickerProps } from './DatePicker';
+export { default as DateRangePicker } from './DateRangePicker';
+export type { DateRangePickerProps } from './DateRangePicker';
 export { default as Description } from './Description';
 export type { DescriptionProps } from './Description';
 export { default as Display } from './Display';
@@ -44,6 +52,8 @@ export { default as EmptyState } from './EmptyState';
 export type { EmptyStateProps } from './EmptyState';
 export { default as Drawer } from './Drawer';
 export type { DrawerProps } from './Drawer';
+export { default as Dropzone } from './Dropzone';
+export type { DropzoneProps, FileRejection, FileRejectionReason } from './Dropzone';
 export { default as Fieldset } from './Fieldset';
 export type { FieldsetProps, FieldsetTitleProps, FieldsetSubtitleProps, FieldsetGroupProps, FieldsetFooterProps, FieldsetContentProps } from './Fieldset';
 export { default as Grid } from './Grid';
@@ -70,6 +80,8 @@ export { default as Page } from './Page';
 export type { PageProps, PageHeaderProps, PageContentProps, PageFooterProps } from './Page';
 export { default as Pagination } from './Pagination';
 export type { PaginationProps, PaginationNextProps, PaginationPreviousProps } from './Pagination';
+export { default as PinInput } from './PinInput';
+export type { PinInputProps } from './PinInput';
 export { default as Popover } from './Popover';
 export type { PopoverProps, PopoverItemProps } from './Popover';
 export { default as Progress } from './Progress';
@@ -82,6 +94,8 @@ export { default as Row } from './Row';
 export type { RowProps } from './Row';
 export { default as Section } from './Section';
 export type { SectionProps } from './Section';
+export { default as SegmentedControl } from './SegmentedControl';
+export type { SegmentedControlProps, SegmentedControlItemProps, SegmentedControlValue } from './SegmentedControl';
 export { default as Select } from './Select';
 export type { SelectProps, SelectOptionProps } from './Select';
 export { default as Skeleton } from './Skeleton';
@@ -102,12 +116,16 @@ export { default as Tabs } from './Tabs';
 export type { TabsProps } from './Tabs';
 export { default as Tag } from './Tag';
 export type { TagProps } from './Tag';
+export { default as TagsInput } from './TagsInput';
+export type { TagsInputProps } from './TagsInput';
 export { default as Text } from './Text';
 export type { TextProps } from './Text';
 export { default as Textarea } from './Textarea';
 export type { TextareaProps } from './Textarea';
 export { default as Themes } from './Themes';
 export type { BolioUIThemes, BolioUIUserTheme } from './Themes';
+export { default as Tree } from './Tree';
+export type { TreeProps, TreeNodeData } from './Tree';
 export { default as Toggle } from './Toggle';
 export type { ToggleProps } from './Toggle';
 export { default as Tooltip } from './Tooltip';
@@ -129,6 +147,8 @@ export { default as useModal } from './use-modal';
 export { default as useTabs } from './use-tabs';
 export { default as useClickAway } from './use-click-away';
 export { default as useCurrentState } from './use-current-state';
+export { default as ContextMenu } from './ContextMenu';
+export type { ContextMenuProps } from './ContextMenu';
 export { default as CssBaseline } from './CssBaseline';
 export { default as useTheme } from './use-theme';
 export { default as useClasses } from './use-classes';

package/esm/index.js

@@ -1,4 +1,7 @@
 'use client';
+import {
+  use_input_default
+} from "./chunk-J4K4LRBI.js";
 import {
   use_media_query_default
 } from "./chunk-6VDRKYLW.js";
@@ -8,12 +11,12 @@ import {
 import {
   use_tabs_default
 } from "./chunk-I6WWABJN.js";
+import {
+  Tree_default
+} from "./chunk-K6UULETP.js";
 import {
   use_all_themes_default
 } from "./chunk-QILHI3LO.js";
-import {
-  use_input_default
-} from "./chunk-J4K4LRBI.js";
 import {
   Tabs_default,
   highlight_default
@@ -21,6 +24,9 @@ import {
 import {
   Tag_default
 } from "./chunk-XC33TGGT.js";
+import {
+  TagsInput_default
+} from "./chunk-G4KB56RO.js";
 import {
   Text_default
 } from "./chunk-A6N5PIXN.js";
@@ -35,7 +41,7 @@ import {
 } from "./chunk-67WAS5AY.js";
 import {
   Slider_default
-} from "./chunk-FLK7EAOE.js";
+} from "./chunk-IUZV5Y27.js";
 import {
   Snippet_default
 } from "./chunk-CGEUUDJ4.js";
@@ -60,9 +66,6 @@ import {
 import {
   Table_default
 } from "./chunk-TKICX5R6.js";
-import {
-  Pagination_default
-} from "./chunk-E5EDUOQT.js";
 import {
   Popover_default
 } from "./chunk-GGCVPMXO.js";
@@ -85,20 +88,11 @@ import {
   Section_default
 } from "./chunk-BJRUC4XL.js";
 import {
-  Select_default
-} from "./chunk-YHZFOVVI.js";
+  SegmentedControl_default
+} from "./chunk-2A4BSQ66.js";
 import {
-  Marquee_default
-} from "./chunk-TJUNBMNF.js";
-import {
-  Menu_default
-} from "./chunk-6BCLZSSK.js";
-import "./chunk-UVVBMWR4.js";
-import {
-  useRect
-} from "./chunk-DSX6YDJM.js";
-import "./chunk-V57PNXMD.js";
-import "./chunk-JJFOGZ6V.js";
+  Select_default
+} from "./chunk-DIMJQLWY.js";
 import {
   Note_default
 } from "./chunk-AFBCMW2I.js";
@@ -109,11 +103,11 @@ import {
   Page_default
 } from "./chunk-LA46RLOT.js";
 import {
-  Drawer_default
-} from "./chunk-PGQYW6YF.js";
+  Pagination_default
+} from "./chunk-E5EDUOQT.js";
 import {
-  EmptyState_default
-} from "./chunk-DAZ2GHNP.js";
+  PinInput_default
+} from "./chunk-X4TPC7HS.js";
 import {
   Fieldset_default
 } from "./chunk-WXW7BYE7.js";
@@ -123,52 +117,89 @@ import {
 import {
   Keyboard_default
 } from "./chunk-RRFCNZ2T.js";
+import {
+  Marquee_default
+} from "./chunk-TJUNBMNF.js";
+import {
+  DateRangePicker_default
+} from "./chunk-GYFW5NLU.js";
+import {
+  Description_default
+} from "./chunk-SDC2VF5K.js";
+import {
+  Display_default
+} from "./chunk-T5BYQGC3.js";
+import {
+  Divider_default
+} from "./chunk-D7CNDAYB.js";
+import {
+  Dot_default
+} from "./chunk-7N7PEBRB.js";
+import {
+  Drawer_default
+} from "./chunk-PGQYW6YF.js";
+import {
+  Dropzone_default
+} from "./chunk-4X4ELIMQ.js";
+import {
+  EmptyState_default
+} from "./chunk-DAZ2GHNP.js";
+import {
+  ColorInput_default
+} from "./chunk-IJGIEX5J.js";
+import {
+  ColorPicker_default
+} from "./chunk-OKZRHSSG.js";
+import {
+  Combobox_default
+} from "./chunk-MGHMAZRL.js";
 import {
   Command_default
 } from "./chunk-4QA7Z7VP.js";
 import {
   Modal_default
 } from "./chunk-6ZBFUZSL.js";
-import "./chunk-TKIUVNKP.js";
 import {
-  use_body_scroll_default
-} from "./chunk-O3RTRCY5.js";
+  Input_default
+} from "./chunk-NEG5UNM6.js";
+import {
+  Textarea_default
+} from "./chunk-ISLUC2SD.js";
+import "./chunk-TKIUVNKP.js";
 import {
   KeyCode,
   KeyMod,
   use_keyboard_default
 } from "./chunk-F3AL4TQZ.js";
 import {
-  Input_default
-} from "./chunk-NEG5UNM6.js";
-import {
-  Textarea_default
-} from "./chunk-ISLUC2SD.js";
+  use_body_scroll_default
+} from "./chunk-O3RTRCY5.js";
 import "./chunk-UOGCO6CV.js";
 import {
   Container_default
 } from "./chunk-GJ77XHZ3.js";
 import {
-  CssBaseline_default
-} from "./chunk-6KMHJRCY.js";
+  ContextMenu_default
+} from "./chunk-AVO2SK2I.js";
 import {
-  DatePicker_default
-} from "./chunk-HIFS4JIO.js";
-import {
-  Description_default
-} from "./chunk-SDC2VF5K.js";
+  Menu_default
+} from "./chunk-XLPOECCE.js";
+import "./chunk-AG2NWQYL.js";
 import {
-  Display_default
-} from "./chunk-T5BYQGC3.js";
+  useRect
+} from "./chunk-DSX6YDJM.js";
+import "./chunk-V57PNXMD.js";
+import "./chunk-JJFOGZ6V.js";
 import {
-  Divider_default
-} from "./chunk-D7CNDAYB.js";
+  CssBaseline_default
+} from "./chunk-TDJGMSGT.js";
 import {
-  Dot_default
-} from "./chunk-7N7PEBRB.js";
+  DatePicker_default
+} from "./chunk-2EYJZXS4.js";
+import "./chunk-KBZEYKCZ.js";
 import {
   Calendar_default
-} from "./chunk-IBC5BABS.js";
+} from "./chunk-P245HSVB.js";
 import {
   Capacity_default
 } from "./chunk-HK6XCH2C.js";
@@ -179,6 +210,9 @@ import {
 import {
   Image_default
 } from "./chunk-TWIOSRRP.js";
+import {
+  Carousel_default
+} from "./chunk-MDSRXACM.js";
 import {
   Checkbox_default
 } from "./chunk-EAHIBHMI.js";
@@ -190,13 +224,9 @@ import {
 } from "./chunk-RZSTPJ76.js";
 import {
   Collapse_default
-} from "./chunk-FQU5SKDF.js";
+} from "./chunk-WFGUAR7K.js";
 import "./chunk-HKOESPKZ.js";
 import "./chunk-AXYDJGTN.js";
-import {
-  Combobox_default
-} from "./chunk-MGHMAZRL.js";
-import "./chunk-KBZEYKCZ.js";
 import {
   Avatar_default
 } from "./chunk-LQYCPFUA.js";
@@ -205,16 +235,16 @@ import {
 } from "./chunk-RD4CEB5S.js";
 import {
   BolioUIProvider_default
-} from "./chunk-2PRUFY2Q.js";
+} from "./chunk-4ZGR7UMX.js";
 import "./chunk-5HRVN7L7.js";
 import "./chunk-A3BIV2QM.js";
 import "./chunk-LDTDMDE6.js";
 import "./chunk-BXDUHMWS.js";
-import "./chunk-ZRORQ2WH.js";
 import "./chunk-33BUV2RX.js";
 import {
   use_current_state_default
 } from "./chunk-GGD4BGH2.js";
+import "./chunk-ZRORQ2WH.js";
 import {
   Breadcrumbs_default
 } from "./chunk-EEZG4FGY.js";
@@ -270,20 +300,26 @@ export {
   Calendar_default as Calendar,
   Capacity_default as Capacity,
   Card_default as Card,
+  Carousel_default as Carousel,
   Checkbox_default as Checkbox,
   Code_default as Code,
   Col_default as Col,
   Collapse_default as Collapse,
+  ColorInput_default as ColorInput,
+  ColorPicker_default as ColorPicker,
   Combobox_default as Combobox,
   Command_default as Command,
   Container_default as Container,
+  ContextMenu_default as ContextMenu,
   CssBaseline_default as CssBaseline,
   DatePicker_default as DatePicker,
+  DateRangePicker_default as DateRangePicker,
   Description_default as Description,
   Display_default as Display,
   Divider_default as Divider,
   Dot_default as Dot,
   Drawer_default as Drawer,
+  Dropzone_default as Dropzone,
   EmptyState_default as EmptyState,
   Fieldset_default as Fieldset,
   Grid_default as Grid,
@@ -302,6 +338,7 @@ export {
   NumberInput_default as NumberInput,
   Page_default as Page,
   Pagination_default as Pagination,
+  PinInput_default as PinInput,
   Popover_default as Popover,
   Progress_default as Progress,
   Radio_default as Radio,
@@ -310,6 +347,7 @@ export {
   ScaleContext,
   ScalePropKeys,
   Section_default as Section,
+  SegmentedControl_default as SegmentedControl,
   Select_default as Select,
   Skeleton_default as Skeleton,
   Slider_default as Slider,
@@ -321,12 +359,14 @@ export {
   Table_default as Table,
   Tabs_default as Tabs,
   Tag_default as Tag,
+  TagsInput_default as TagsInput,
   Text_default as Text,
   Textarea_default as Textarea,
   Themes_default as Themes,
   Timeline_default as Timeline,
   Toggle_default as Toggle,
   Tooltip_default as Tooltip,
+  Tree_default as Tree,
   use_all_themes_default as useAllThemes,
   use_body_scroll_default as useBodyScroll,
   use_classes_default as useClasses,