UNPKG

@plone/components

Version:

ReactJS components for Plone

1,292 lines (1,232 loc) 41.7 kB
"use client" import { AlignWidget, Select, SelectItem, SelectListBox, SelectSection, SelectSectionHeader, SizeWidget, WidthWidget, getMenuTriggerChildren } from "./chunk-YWREOUAG.js"; import { AddIcon, CheckboxIcon, CloseIcon, DashIcon, DraggableIcon, HomeIcon, Icon, InfoIcon } from "./chunk-V3F5PCGN.js"; // src/components/BlockToolbar/BlockToolbar.tsx import "react"; import { Toolbar as RACToolbar } from "react-aria-components"; import { jsx } from "react/jsx-runtime"; function BlockToolbar(props) { return /* @__PURE__ */ jsx(RACToolbar, { ...props, className: "blocks-toolbar" }); } // src/components/Breadcrumbs/Breadcrumbs.tsx import "react"; import { Breadcrumbs as RACBreadcrumbs, Breadcrumb as RACBreadcrumb } from "react-aria-components"; // src/components/Link/Link.tsx import { Link } from "react-aria-components"; // src/components/Breadcrumbs/Breadcrumbs.tsx import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime"; function Breadcrumb(props) { return /* @__PURE__ */ jsx2(RACBreadcrumb, { ...props, children: ({ isCurrent }) => /* @__PURE__ */ jsxs(Fragment, { children: [ props.value?.icon && props.value?.icon, /* @__PURE__ */ jsx2(Link, { ...props }), !isCurrent && props.separator && props.separator ] }) }); } function Breadcrumbs(props) { const { root, items } = props; let itemsWithRoot; if (root && items) { const rootItem = { "@id": root["@id"] || "/", title: "Home", icon: root.icon || /* @__PURE__ */ jsx2(HomeIcon, { size: "sm" }) }; itemsWithRoot = [rootItem, ...items]; } return /* @__PURE__ */ jsx2(RACBreadcrumbs, { ...props, items: itemsWithRoot || items }); } // src/components/Button/Button.tsx import { forwardRef } from "react"; import { Button as RACButton } from "react-aria-components"; import { jsx as jsx3 } from "react/jsx-runtime"; var Button = forwardRef(function _Button(props, ref) { return /* @__PURE__ */ jsx3(RACButton, { ref, ...props }); }); // src/components/Calendar/Calendar.tsx import "react"; import { Button as Button2, Calendar as RACCalendar, CalendarCell, CalendarGrid, Heading, Text } from "react-aria-components"; import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime"; function Calendar({ errorMessage, ...props }) { return /* @__PURE__ */ jsxs2(RACCalendar, { ...props, children: [ /* @__PURE__ */ jsxs2("header", { children: [ /* @__PURE__ */ jsx4(Button2, { slot: "previous", children: "\u25C0" }), /* @__PURE__ */ jsx4(Heading, {}), /* @__PURE__ */ jsx4(Button2, { slot: "next", children: "\u25B6" }) ] }), /* @__PURE__ */ jsx4(CalendarGrid, { children: (date) => /* @__PURE__ */ jsx4(CalendarCell, { date }) }), errorMessage && /* @__PURE__ */ jsx4(Text, { slot: "errorMessage", children: errorMessage }) ] }); } // src/components/ColorArea/ColorArea.tsx import "react"; import { ColorArea as RACColorArea, ColorThumb } from "react-aria-components"; import { jsx as jsx5 } from "react/jsx-runtime"; function ColorArea(props) { return /* @__PURE__ */ jsx5(RACColorArea, { ...props, children: /* @__PURE__ */ jsx5(ColorThumb, {}) }); } // src/components/ColorField/ColorField.tsx import "react"; import { ColorField as RACColorField, FieldError, Input, Label, Text as Text2 } from "react-aria-components"; import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime"; function ColorField({ label, description, errorMessage, ...props }) { return /* @__PURE__ */ jsxs3(RACColorField, { ...props, children: [ label && /* @__PURE__ */ jsx6(Label, { children: label }), /* @__PURE__ */ jsx6(Input, {}), description && /* @__PURE__ */ jsx6(Text2, { slot: "description", children: description }), /* @__PURE__ */ jsx6(FieldError, { children: errorMessage }) ] }); } // src/components/ColorPicker/ColorPicker.tsx import "react"; import { Button as Button3, ColorPicker as RACColorPicker, Dialog, DialogTrigger, Popover } from "react-aria-components"; // src/components/ColorSwatch/ColorSwatch.tsx import "react"; import { ColorSwatch as RACColorSwatch } from "react-aria-components"; import { jsx as jsx7 } from "react/jsx-runtime"; function ColorSwatch(props) { return /* @__PURE__ */ jsx7( RACColorSwatch, { ...props, style: ({ color }) => ({ background: `linear-gradient(${color}, ${color}), repeating-conic-gradient(#CCC 0% 25%, white 0% 50%) 50% / 16px 16px` }) } ); } // src/components/ColorSlider/ColorSlider.tsx import "react"; import { ColorSlider as RACColorSlider, ColorThumb as ColorThumb2, Label as Label2, SliderOutput, SliderTrack } from "react-aria-components"; import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime"; function ColorSlider({ label, ...props }) { return /* @__PURE__ */ jsxs4(RACColorSlider, { ...props, children: [ /* @__PURE__ */ jsx8(Label2, { children: label }), /* @__PURE__ */ jsx8(SliderOutput, {}), /* @__PURE__ */ jsx8( SliderTrack, { style: ({ defaultStyle }) => ({ background: `${defaultStyle.background}, repeating-conic-gradient(#CCC 0% 25%, white 0% 50%) 50% / 16px 16px` }), children: /* @__PURE__ */ jsx8(ColorThumb2, {}) } ) ] }); } // src/components/ColorPicker/ColorPicker.tsx import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime"; function ColorPicker({ label, children, ...props }) { return /* @__PURE__ */ jsx9(RACColorPicker, { ...props, children: /* @__PURE__ */ jsxs5(DialogTrigger, { children: [ /* @__PURE__ */ jsxs5(Button3, { className: "color-picker", children: [ /* @__PURE__ */ jsx9(ColorSwatch, {}), /* @__PURE__ */ jsx9("span", { children: label }) ] }), /* @__PURE__ */ jsx9(Popover, { placement: "bottom start", children: /* @__PURE__ */ jsx9(Dialog, { className: "color-picker-dialog", children: children || /* @__PURE__ */ jsxs5(Fragment2, { children: [ /* @__PURE__ */ jsx9( ColorArea, { colorSpace: "hsb", xChannel: "saturation", yChannel: "brightness" } ), /* @__PURE__ */ jsx9(ColorSlider, { colorSpace: "hsb", channel: "hue" }), /* @__PURE__ */ jsx9( ColorField, { label: "Hex", onKeyDown: (e) => { if (e.key === "Enter") { e.currentTarget.blur(); } } } ) ] }) }) }) ] }) }); } // src/components/ColorSwatchPicker/ColorSwatchPicker.tsx import "react"; import { ColorSwatchPicker as AriaColorSwatchPicker, ColorSwatchPickerItem as AriaColorSwatchPickerItem } from "react-aria-components"; import { jsx as jsx10 } from "react/jsx-runtime"; function ColorSwatchPicker({ children, ...props }) { return /* @__PURE__ */ jsx10(AriaColorSwatchPicker, { ...props, children }); } // src/components/ColorWheel/ColorWheel.tsx import "react"; import { ColorThumb as ColorThumb3, ColorWheel as AriaColorWheel, ColorWheelTrack } from "react-aria-components"; import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime"; function ColorWheel(props) { return /* @__PURE__ */ jsxs6(AriaColorWheel, { ...props, outerRadius: 100, innerRadius: 74, children: [ /* @__PURE__ */ jsx11(ColorWheelTrack, {}), /* @__PURE__ */ jsx11(ColorThumb3, {}) ] }); } // src/components/Checkbox/Checkbox.tsx import "react"; import { Checkbox as RACCheckbox } from "react-aria-components"; import { Fragment as Fragment3, jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime"; function Checkbox({ children, ...props }) { return /* @__PURE__ */ jsx12(RACCheckbox, { ...props, children: ({ isIndeterminate }) => /* @__PURE__ */ jsxs7(Fragment3, { children: [ /* @__PURE__ */ jsx12("div", { className: "checkbox", children: /* @__PURE__ */ jsx12("svg", { viewBox: "0 0 18 18", "aria-hidden": "true", children: isIndeterminate ? /* @__PURE__ */ jsx12("rect", { x: 1, y: 7.5, width: 15, height: 3 }) : /* @__PURE__ */ jsx12("polyline", { points: "1 9 7 14 15 4" }) }) }), props.label || children ] }) }); } // src/components/CheckboxField/CheckboxField.tsx import "react"; import { Text as Text3 } from "react-aria-components"; import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime"; function CheckboxField({ children, errorMessage, description, ...props }) { return /* @__PURE__ */ jsxs8("div", { className: "react-aria-CheckboxField", children: [ /* @__PURE__ */ jsx13(Checkbox, { ...props }), description && /* @__PURE__ */ jsx13(Text3, { slot: "description", children: description }), props.isInvalid && /* @__PURE__ */ jsx13(Text3, { slot: "errorMessage", children: errorMessage }) ] }); } // src/components/CheckboxGroup/CheckboxGroup.tsx import "react"; import { CheckboxGroup as RACCheckboxGroup, FieldError as FieldError2, Text as Text4 } from "react-aria-components"; import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime"; function CheckboxGroup({ label, description, errorMessage, children, ...props }) { return /* @__PURE__ */ jsxs9(RACCheckboxGroup, { ...props, children: [ label, children, description && /* @__PURE__ */ jsx14(Text4, { slot: "description", children: description }), /* @__PURE__ */ jsx14(FieldError2, { children: errorMessage }) ] }); } // src/components/ComboBox/ComboBox.tsx import "react"; import { Button as Button4, ComboBox as RACComboBox, FieldError as FieldError3, Input as Input2, Label as Label3, ListBox, ListBoxItem, Popover as Popover2, Text as Text5 } from "react-aria-components"; import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime"; function ComboBox({ label, description, errorMessage, children, ...props }) { return /* @__PURE__ */ jsxs10(RACComboBox, { ...props, children: [ /* @__PURE__ */ jsx15(Label3, { children: label }), /* @__PURE__ */ jsxs10("div", { className: "my-combobox-container", children: [ /* @__PURE__ */ jsx15(Input2, {}), /* @__PURE__ */ jsx15(Button4, { children: "\u25BC" }) ] }), description && /* @__PURE__ */ jsx15(Text5, { slot: "description", children: description }), /* @__PURE__ */ jsx15(FieldError3, { children: errorMessage }), /* @__PURE__ */ jsx15(Popover2, { children: /* @__PURE__ */ jsx15(ListBox, { children }) }) ] }); } function ComboBoxItem(props) { return /* @__PURE__ */ jsx15(ListBoxItem, { ...props }); } // src/components/Container/Container.tsx import "react"; import cx from "clsx"; import { jsx as jsx16 } from "react/jsx-runtime"; var Container = (props) => { const { as: Component = "div", children, className, width, layout, narrow, ...rest } = props; const classes = cx("q", "container", className, { layout, narrow, [width || ""]: true }); return /* @__PURE__ */ jsx16(Component, { ...rest, className: classes, children }); }; // src/components/DateField/DateField.tsx import "react"; import { DateField as RACDateField, DateInput, DateSegment, FieldError as FieldError4, Label as Label4, Text as Text6 } from "react-aria-components"; import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime"; function DateField({ label, description, errorMessage, ...props }) { return /* @__PURE__ */ jsxs11(RACDateField, { ...props, children: [ /* @__PURE__ */ jsx17(Label4, { children: label }), /* @__PURE__ */ jsx17(DateInput, { children: (segment) => /* @__PURE__ */ jsx17(DateSegment, { segment }) }), description && /* @__PURE__ */ jsx17(Text6, { slot: "description", children: description }), /* @__PURE__ */ jsx17(FieldError4, { children: errorMessage }) ] }); } // src/components/DatePicker/DatePicker.tsx import "react"; import { Button as Button5, Calendar as Calendar2, CalendarCell as CalendarCell2, CalendarGrid as CalendarGrid2, DateInput as DateInput2, DatePicker as RACDatePicker, DateSegment as DateSegment2, Dialog as Dialog2, FieldError as FieldError5, Group, Heading as Heading2, Label as Label5, Popover as Popover3, Text as Text7 } from "react-aria-components"; import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime"; function DatePicker({ label, description, errorMessage, ...props }) { return /* @__PURE__ */ jsxs12(RACDatePicker, { ...props, children: [ /* @__PURE__ */ jsx18(Label5, { children: label }), /* @__PURE__ */ jsxs12(Group, { children: [ /* @__PURE__ */ jsx18(DateInput2, { children: (segment) => /* @__PURE__ */ jsx18(DateSegment2, { segment }) }), /* @__PURE__ */ jsx18(Button5, { children: "\u25BC" }) ] }), description && /* @__PURE__ */ jsx18(Text7, { slot: "description", children: description }), /* @__PURE__ */ jsx18(FieldError5, { children: errorMessage }), /* @__PURE__ */ jsx18(Popover3, { children: /* @__PURE__ */ jsx18(Dialog2, { children: /* @__PURE__ */ jsxs12(Calendar2, { children: [ /* @__PURE__ */ jsxs12("header", { children: [ /* @__PURE__ */ jsx18(Button5, { slot: "previous", children: "\u25C0" }), /* @__PURE__ */ jsx18(Heading2, {}), /* @__PURE__ */ jsx18(Button5, { slot: "next", children: "\u25B6" }) ] }), /* @__PURE__ */ jsx18(CalendarGrid2, { children: (date) => /* @__PURE__ */ jsx18(CalendarCell2, { date }) }) ] }) }) }) ] }); } // src/components/DateRangePicker/DateRangePicker.tsx import "react"; import { Button as Button6, CalendarCell as CalendarCell3, CalendarGrid as CalendarGrid3, DateInput as DateInput3, DateRangePicker as RACDateRangePicker, DateSegment as DateSegment3, Dialog as Dialog3, FieldError as FieldError6, Group as Group2, Heading as Heading3, Label as Label6, Popover as Popover4, RangeCalendar, Text as Text8 } from "react-aria-components"; import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime"; function DateRangePicker({ label, description, errorMessage, ...props }) { return /* @__PURE__ */ jsxs13(RACDateRangePicker, { ...props, children: [ /* @__PURE__ */ jsx19(Label6, { children: label }), /* @__PURE__ */ jsxs13(Group2, { children: [ /* @__PURE__ */ jsx19(DateInput3, { slot: "start", children: (segment) => /* @__PURE__ */ jsx19(DateSegment3, { segment }) }), /* @__PURE__ */ jsx19("span", { "aria-hidden": "true", children: "\u2013" }), /* @__PURE__ */ jsx19(DateInput3, { slot: "end", children: (segment) => /* @__PURE__ */ jsx19(DateSegment3, { segment }) }), /* @__PURE__ */ jsx19(Button6, { children: "\u25BC" }) ] }), description && /* @__PURE__ */ jsx19(Text8, { slot: "description", children: description }), /* @__PURE__ */ jsx19(FieldError6, { children: errorMessage }), /* @__PURE__ */ jsx19(Popover4, { children: /* @__PURE__ */ jsx19(Dialog3, { children: /* @__PURE__ */ jsxs13(RangeCalendar, { children: [ /* @__PURE__ */ jsxs13("header", { children: [ /* @__PURE__ */ jsx19(Button6, { slot: "previous", children: "\u25C0" }), /* @__PURE__ */ jsx19(Heading3, {}), /* @__PURE__ */ jsx19(Button6, { slot: "next", children: "\u25B6" }) ] }), /* @__PURE__ */ jsx19(CalendarGrid3, { children: (date) => /* @__PURE__ */ jsx19(CalendarCell3, { date }) }) ] }) }) }) ] }); } // src/components/Dialog/Dialog.tsx import "react"; import { Dialog as RACDialog } from "react-aria-components"; import { DialogTrigger as DialogTrigger2 } from "react-aria-components"; import { jsx as jsx20 } from "react/jsx-runtime"; function Dialog4(props) { return /* @__PURE__ */ jsx20(RACDialog, { ...props }); } // src/components/Disclosure/Disclosure.tsx import "react"; import { Disclosure as RACDisclosure } from "react-aria-components"; import { jsx as jsx21 } from "react/jsx-runtime"; function Disclosure(props) { return /* @__PURE__ */ jsx21(RACDisclosure, { ...props }); } // src/components/DisclosureGroup/DisclosureGroup.tsx import "react"; import { DisclosureGroup as RACDisclosureGroup } from "react-aria-components"; import { jsx as jsx22 } from "react/jsx-runtime"; function DisclosureGroup(props) { return /* @__PURE__ */ jsx22(RACDisclosureGroup, { ...props }); } // src/components/Form/Form.tsx import "react"; import { Form as RACForm } from "react-aria-components"; import { jsx as jsx23 } from "react/jsx-runtime"; function Form(props) { return /* @__PURE__ */ jsx23(RACForm, { ...props }); } // src/components/GridList/GridList.tsx import "react"; import { Button as Button7, GridList as RACGridList, GridListItem as RACGridListItem } from "react-aria-components"; import { Fragment as Fragment4, jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime"; function GridList({ children, ...props }) { return /* @__PURE__ */ jsx24(RACGridList, { ...props, children }); } function GridListItem({ children, ...props }) { const textValue = typeof children === "string" ? children : void 0; return /* @__PURE__ */ jsx24(RACGridListItem, { textValue, ...props, children: ({ selectionMode, selectionBehavior, allowsDragging }) => /* @__PURE__ */ jsxs14(Fragment4, { children: [ allowsDragging && /* @__PURE__ */ jsx24(Button7, { slot: "drag", children: "\u2261" }), selectionMode === "multiple" && selectionBehavior === "toggle" && /* @__PURE__ */ jsx24(Checkbox, { slot: "selection" }), children ] }) }); } // src/components/ListBox/ListBox.tsx import "react"; import { ListBox as RACListBox, ListBoxItem as RACListBoxItem } from "react-aria-components"; import { jsx as jsx25 } from "react/jsx-runtime"; function ListBox2({ children, ...props }) { return /* @__PURE__ */ jsx25(RACListBox, { ...props, children }); } function ListBoxItem2(props) { return /* @__PURE__ */ jsx25(RACListBoxItem, { ...props }); } // src/components/Menu/Menu.tsx import "react"; import { Header, Menu as RACMenu, MenuItem as RACMenuItem, MenuSection as RACMenuSection, MenuTrigger as RACMenuTrigger, Popover as Popover5, Separator as RACSeparator, SubmenuTrigger as RACSubmenuTrigger } from "react-aria-components"; import { jsx as jsx26, jsxs as jsxs15 } from "react/jsx-runtime"; function Menu(props) { return /* @__PURE__ */ jsx26(RACMenu, { ...props }); } function MenuItem(props) { return /* @__PURE__ */ jsx26(RACMenuItem, { ...props }); } function MenuSeparator(props) { return /* @__PURE__ */ jsx26(RACSeparator, { ...props }); } function MenuSection(props) { return /* @__PURE__ */ jsx26(RACMenuSection, { ...props }); } function MenuSectionHeader(props) { return /* @__PURE__ */ jsx26(Header, { ...props }); } function MenuTrigger(props) { const [trigger, menu] = getMenuTriggerChildren(props.children, "MenuTrigger"); return /* @__PURE__ */ jsxs15(RACMenuTrigger, { ...props, children: [ trigger, /* @__PURE__ */ jsx26(Popover5, { placement: props.placement || "bottom start", children: menu }) ] }); } function SubmenuTrigger(props) { const [trigger, menu] = getMenuTriggerChildren( props.children, "SubmenuTrigger" ); return /* @__PURE__ */ jsxs15(RACSubmenuTrigger, { ...props, children: [ trigger, /* @__PURE__ */ jsx26(Popover5, { placement: "end", children: menu }) ] }); } // src/components/Meter/Meter.tsx import "react"; import { Label as Label7, Meter as RACMeter } from "react-aria-components"; import { Fragment as Fragment5, jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime"; function Meter({ label, ...props }) { return /* @__PURE__ */ jsx27(RACMeter, { ...props, children: ({ percentage, valueText }) => /* @__PURE__ */ jsxs16(Fragment5, { children: [ /* @__PURE__ */ jsx27(Label7, { children: label }), /* @__PURE__ */ jsx27("span", { className: "value", children: valueText }), /* @__PURE__ */ jsx27("div", { className: "bar", children: /* @__PURE__ */ jsx27("div", { className: "fill", style: { width: percentage + "%" } }) }) ] }) }); } // src/components/Modal/Modal.tsx import "react"; import { Modal as RACModal } from "react-aria-components"; import { jsx as jsx28 } from "react/jsx-runtime"; function Modal(props) { return /* @__PURE__ */ jsx28(RACModal, { ...props }); } // src/components/NumberField/NumberField.tsx import "react"; import { FieldError as FieldError7, Group as Group3, Input as Input3, Label as Label8, NumberField as RACNumberField, Text as Text9 } from "react-aria-components"; import { jsx as jsx29, jsxs as jsxs17 } from "react/jsx-runtime"; function NumberField({ label, description, errorMessage, ...props }) { return /* @__PURE__ */ jsxs17(RACNumberField, { ...props, children: [ /* @__PURE__ */ jsx29(Label8, { children: label }), /* @__PURE__ */ jsxs17(Group3, { children: [ /* @__PURE__ */ jsx29(Button, { slot: "decrement", children: /* @__PURE__ */ jsx29(DashIcon, { size: "sm" }) }), /* @__PURE__ */ jsx29(Input3, {}), /* @__PURE__ */ jsx29(Button, { slot: "increment", children: /* @__PURE__ */ jsx29(AddIcon, { size: "sm" }) }) ] }), description && /* @__PURE__ */ jsx29(Text9, { slot: "description", children: description }), /* @__PURE__ */ jsx29(FieldError7, { children: errorMessage }) ] }); } // src/components/Popover/Popover.tsx import "react"; import { OverlayArrow, Popover as RACPopover } from "react-aria-components"; import { jsx as jsx30, jsxs as jsxs18 } from "react/jsx-runtime"; function Popover6({ children, dialogAriaLabel, dialogAriaLabelledby, showArrow, ...props }) { return /* @__PURE__ */ jsxs18(RACPopover, { ...props, children: [ showArrow && /* @__PURE__ */ jsx30(OverlayArrow, { children: /* @__PURE__ */ jsx30("svg", { width: 12, height: 12, viewBox: "0 0 12 12", children: /* @__PURE__ */ jsx30("path", { d: "M0 0 L6 6 L12 0" }) }) }), /* @__PURE__ */ jsx30( Dialog4, { "aria-label": dialogAriaLabel, "aria-labelledby": dialogAriaLabelledby, children } ) ] }); } // src/components/ProgressBar/ProgressBar.tsx import "react"; import { Label as Label9, ProgressBar as RACProgressBar } from "react-aria-components"; import { Fragment as Fragment6, jsx as jsx31, jsxs as jsxs19 } from "react/jsx-runtime"; function ProgressBar({ label, ...props }) { return /* @__PURE__ */ jsx31(RACProgressBar, { ...props, children: ({ percentage, valueText }) => /* @__PURE__ */ jsxs19(Fragment6, { children: [ /* @__PURE__ */ jsx31(Label9, { children: label }), /* @__PURE__ */ jsx31("span", { className: "value", children: valueText }), /* @__PURE__ */ jsx31("div", { className: "bar", children: /* @__PURE__ */ jsx31("div", { className: "fill", style: { width: percentage + "%" } }) }) ] }) }); } // src/components/RadioGroup/RadioGroup.tsx import "react"; import { FieldError as FieldError8, Label as Label10, RadioGroup as RACRadioGroup, Radio, Text as Text10 } from "react-aria-components"; import { jsx as jsx32, jsxs as jsxs20 } from "react/jsx-runtime"; function RadioGroup({ label, description, errorMessage, children, ...props }) { return /* @__PURE__ */ jsxs20(RACRadioGroup, { ...props, children: [ /* @__PURE__ */ jsx32(Label10, { children: label }), children, description && /* @__PURE__ */ jsx32(Text10, { slot: "description", children: description }), /* @__PURE__ */ jsx32(FieldError8, { children: errorMessage }) ] }); } // src/components/RangeCalendar/RangeCalendar.tsx import "react"; import { Button as Button8, CalendarCell as CalendarCell4, CalendarGrid as CalendarGrid4, Heading as Heading4, RangeCalendar as RACRangeCalendar, Text as Text11 } from "react-aria-components"; import { jsx as jsx33, jsxs as jsxs21 } from "react/jsx-runtime"; function RangeCalendar2({ errorMessage, ...props }) { return /* @__PURE__ */ jsxs21(RACRangeCalendar, { ...props, children: [ /* @__PURE__ */ jsxs21("header", { children: [ /* @__PURE__ */ jsx33(Button8, { slot: "previous", children: "\u25C0" }), /* @__PURE__ */ jsx33(Heading4, {}), /* @__PURE__ */ jsx33(Button8, { slot: "next", children: "\u25B6" }) ] }), /* @__PURE__ */ jsx33(CalendarGrid4, { children: (date) => /* @__PURE__ */ jsx33(CalendarCell4, { date }) }), errorMessage && /* @__PURE__ */ jsx33(Text11, { slot: "errorMessage", children: errorMessage }) ] }); } // src/components/SearchField/SearchField.tsx import "react"; import { Button as Button9, FieldError as FieldError9, Input as Input4, Label as Label11, SearchField as RACSearchField, Text as Text12 } from "react-aria-components"; import { jsx as jsx34, jsxs as jsxs22 } from "react/jsx-runtime"; function SearchField({ label, description, placeholder = "", errorMessage, ...props }) { return /* @__PURE__ */ jsxs22(RACSearchField, { ...props, children: [ /* @__PURE__ */ jsx34(Label11, { children: label }), /* @__PURE__ */ jsx34(Input4, { placeholder }), /* @__PURE__ */ jsx34(Button9, { children: "\u2715" }), description && /* @__PURE__ */ jsx34(Text12, { slot: "description", children: description }), /* @__PURE__ */ jsx34(FieldError9, { children: errorMessage }) ] }); } // src/components/Spinner/Spinner.tsx import "react"; import clsx from "clsx"; import { jsx as jsx35, jsxs as jsxs23 } from "react/jsx-runtime"; function toSpinnerSize(size) { if (size === void 0) return { dataSize: "sm" }; if (size === "xs" || size === "sm" || size === "lg") { return { dataSize: size }; } if (typeof size === "number") return { customSize: `${size}px` }; return { customSize: size }; } function Spinner({ size = "sm", label = null, isDecorative = false, className, style, "aria-label": ariaLabelProp, ...props }) { const sizeProps = toSpinnerSize(size); const hasLabel = !isDecorative && typeof label === "string" && label.length > 0; const ariaLabel = isDecorative ? void 0 : ariaLabelProp ?? (typeof label === "string" && label.length > 0 ? label : "Loading"); const mergedStyle = { ...style, ...sizeProps.customSize ? { "--spinner-size": sizeProps.customSize } : {} }; return /* @__PURE__ */ jsxs23( "div", { ...props, className: clsx("react-aria-Spinner", className), style: mergedStyle, "data-size": sizeProps.dataSize, "aria-label": ariaLabel, ...isDecorative ? { "aria-hidden": true } : { role: "status", "aria-live": "polite" }, children: [ /* @__PURE__ */ jsxs23( "svg", { className: "spinner-svg", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: [ /* @__PURE__ */ jsx35("circle", { className: "spinner-track", cx: "12", cy: "12", r: "9" }), /* @__PURE__ */ jsx35("circle", { className: "spinner-indicator", cx: "12", cy: "12", r: "9" }) ] } ), hasLabel && /* @__PURE__ */ jsx35("span", { className: "spinner-label", children: label }) ] } ); } // src/components/Slider/Slider.tsx import "react"; import { Label as Label12, Slider as RACSlider, SliderOutput as SliderOutput2, SliderThumb, SliderTrack as SliderTrack2 } from "react-aria-components"; import { jsx as jsx36, jsxs as jsxs24 } from "react/jsx-runtime"; function Slider({ label, thumbLabels, ...props }) { return /* @__PURE__ */ jsxs24(RACSlider, { ...props, children: [ /* @__PURE__ */ jsx36(Label12, { children: label }), /* @__PURE__ */ jsx36(SliderOutput2, { children: ({ state }) => state.values.map((_, i) => state.getThumbValueLabel(i)).join(" \u2013 ") }), /* @__PURE__ */ jsx36(SliderTrack2, { children: ({ state }) => state.values.map((_, i) => /* @__PURE__ */ jsx36(SliderThumb, { index: i, "aria-label": thumbLabels?.[i] }, i)) }) ] }); } // src/components/Switch/Switch.tsx import "react"; import { Switch as RACSwitch } from "react-aria-components"; import { jsx as jsx37, jsxs as jsxs25 } from "react/jsx-runtime"; function Switch({ children, ...props }) { return /* @__PURE__ */ jsxs25(RACSwitch, { ...props, children: [ /* @__PURE__ */ jsx37("div", { className: "indicator" }), children ] }); } // src/components/Table/Table.tsx import "react"; import { ResizableTableContainer, ColumnResizer, Table as RACTable, TableBody, Cell as Cell2 } from "react-aria-components"; // src/components/Table/TableHeader.tsx import "react"; import { TableHeader as RACTableHeader, useTableOptions, Collection } from "react-aria-components"; // src/components/Table/Column.tsx import "react"; import { Column as RACColumn } from "react-aria-components"; import { Fragment as Fragment7, jsx as jsx38, jsxs as jsxs26 } from "react/jsx-runtime"; function Column(props) { return /* @__PURE__ */ jsx38(RACColumn, { ...props, children: ({ allowsSorting, sortDirection }) => /* @__PURE__ */ jsxs26(Fragment7, { children: [ props.children, allowsSorting && /* @__PURE__ */ jsx38("span", { "aria-hidden": "true", className: "sort-indicator", children: sortDirection === "ascending" ? "\u25B2" : "\u25BC" }) ] }) }); } // src/components/Table/TableHeader.tsx import { jsx as jsx39, jsxs as jsxs27 } from "react/jsx-runtime"; function TableHeader({ columns, children, dragColumnHeader }) { const { selectionBehavior, selectionMode, allowsDragging } = useTableOptions(); return /* @__PURE__ */ jsxs27(RACTableHeader, { children: [ allowsDragging && /* @__PURE__ */ jsx39(Column, { className: "react-aria-Column drag-column-header", children: dragColumnHeader }), selectionBehavior === "toggle" && /* @__PURE__ */ jsx39(Column, { children: selectionMode === "multiple" && /* @__PURE__ */ jsx39(Checkbox, { slot: "selection" }) }), /* @__PURE__ */ jsx39(Collection, { items: columns, children }) ] }); } // src/components/Table/Row.tsx import "react"; import { Row as RACRow, Cell, Collection as Collection2, useTableOptions as useTableOptions2, Button as Button10 } from "react-aria-components"; import { jsx as jsx40, jsxs as jsxs28 } from "react/jsx-runtime"; function Row({ id, columns, children, ...otherProps }) { const { selectionBehavior, allowsDragging } = useTableOptions2(); return /* @__PURE__ */ jsxs28(RACRow, { id, ...otherProps, children: [ allowsDragging && /* @__PURE__ */ jsx40(Cell, { className: "react-aria-Cell drag-cell", children: /* @__PURE__ */ jsx40(Button10, { slot: "drag", children: /* @__PURE__ */ jsx40(DraggableIcon, {}) }) }), selectionBehavior === "toggle" && /* @__PURE__ */ jsx40(Cell, { children: /* @__PURE__ */ jsx40(Checkbox, { slot: "selection" }) }), /* @__PURE__ */ jsx40(Collection2, { items: columns, children }) ] }); } // src/components/Table/Table.tsx import { jsx as jsx41, jsxs as jsxs29 } from "react/jsx-runtime"; function Table({ columns, rows, resizableColumns, dragColumnHeader, ...otherProps }) { let table = null; if (Array.isArray(columns) && Array.isArray(rows)) { table = /* @__PURE__ */ jsxs29(RACTable, { ...otherProps, children: [ /* @__PURE__ */ jsx41(TableHeader, { columns, dragColumnHeader, children: (column) => /* @__PURE__ */ jsxs29(Column, { isRowHeader: column.isRowHeader, children: [ resizableColumns && /* @__PURE__ */ jsxs29("div", { className: "flex-wrapper", children: [ /* @__PURE__ */ jsx41("span", { tabIndex: -1, className: "column-name", children: column.name }), /* @__PURE__ */ jsx41(ColumnResizer, {}) ] }), !resizableColumns && column.name ] }) }), /* @__PURE__ */ jsx41(TableBody, { items: rows, children: (item) => /* @__PURE__ */ jsx41(Row, { columns, textValue: item.textValue, children: (column) => /* @__PURE__ */ jsx41(Cell2, { children: item[column.id] }) }) }) ] }); } else { table = /* @__PURE__ */ jsx41(RACTable, { ...otherProps }); if (Array.isArray(columns)) { console.warn("The Table component was given columns but no rows"); } else if (Array.isArray(rows)) { console.warn("The Table component was given rows but no columns"); } } if (resizableColumns) { return /* @__PURE__ */ jsx41(ResizableTableContainer, { children: table }); } else { return table; } } // src/components/Tabs/Tabs.tsx import "react"; import { Tabs as RACTabs } from "react-aria-components"; import { jsx as jsx42 } from "react/jsx-runtime"; function Tabs(props) { return /* @__PURE__ */ jsx42(RACTabs, { ...props }); } // src/components/TagGroup/TagGroup.tsx import "react"; import { Button as Button11, Label as Label13, Tag as RACTag, TagGroup as RACTagGroup, TagList, Text as Text13 } from "react-aria-components"; import { Fragment as Fragment8, jsx as jsx43, jsxs as jsxs30 } from "react/jsx-runtime"; function TagGroup({ label, description, errorMessage, items, children, renderEmptyState, ...props }) { return /* @__PURE__ */ jsxs30(RACTagGroup, { ...props, children: [ /* @__PURE__ */ jsx43(Label13, { children: label }), /* @__PURE__ */ jsx43(TagList, { items, renderEmptyState, children }), description && /* @__PURE__ */ jsx43(Text13, { slot: "description", children: description }), errorMessage && /* @__PURE__ */ jsx43(Text13, { slot: "errorMessage", children: errorMessage }) ] }); } function Tag({ children, ...props }) { const textValue = typeof children === "string" ? children : void 0; return /* @__PURE__ */ jsx43(RACTag, { textValue, ...props, children: ({ allowsRemoving }) => /* @__PURE__ */ jsxs30(Fragment8, { children: [ children, allowsRemoving && /* @__PURE__ */ jsx43(Button11, { slot: "remove", children: "\u24E7" }) ] }) }); } // src/components/TextAreaField/TextAreaField.tsx import "react"; import { FieldError as FieldError10, TextArea, Label as Label14, Text as Text14, TextField as RACTextField } from "react-aria-components"; import { jsx as jsx44, jsxs as jsxs31 } from "react/jsx-runtime"; function TextAreaField({ label, description, errorMessage, ...props }) { return /* @__PURE__ */ jsxs31(RACTextField, { ...props, children: [ /* @__PURE__ */ jsx44(Label14, { children: label }), /* @__PURE__ */ jsx44(TextArea, {}), description && /* @__PURE__ */ jsx44(Text14, { slot: "description", children: description }), /* @__PURE__ */ jsx44(FieldError10, { children: errorMessage }) ] }); } // src/components/TextField/TextField.tsx import "react"; import { FieldError as FieldError11, Input as Input5, Label as Label15, Text as Text15, TextField as RACTextField2 } from "react-aria-components"; import { jsx as jsx45, jsxs as jsxs32 } from "react/jsx-runtime"; function TextField({ label, description, errorMessage, ...props }) { return /* @__PURE__ */ jsxs32(RACTextField2, { ...props, children: [ /* @__PURE__ */ jsx45(Label15, { children: label }), /* @__PURE__ */ jsx45(Input5, {}), description && /* @__PURE__ */ jsx45(Text15, { slot: "description", children: description }), /* @__PURE__ */ jsx45(FieldError11, { children: errorMessage }) ] }); } // src/components/TimeField/TimeField.tsx import "react"; import { DateInput as DateInput4, DateSegment as DateSegment4, FieldError as FieldError12, Label as Label16, Text as Text16, TimeField as RACTimeField } from "react-aria-components"; import { jsx as jsx46, jsxs as jsxs33 } from "react/jsx-runtime"; function TimeField({ label, description, errorMessage, ...props }) { return /* @__PURE__ */ jsxs33(RACTimeField, { ...props, children: [ /* @__PURE__ */ jsx46(Label16, { children: label }), /* @__PURE__ */ jsx46(DateInput4, { children: (segment) => /* @__PURE__ */ jsx46(DateSegment4, { segment }) }), description && /* @__PURE__ */ jsx46(Text16, { slot: "description", children: description }), /* @__PURE__ */ jsx46(FieldError12, { children: errorMessage }) ] }); } // src/components/Toast/Toast.tsx import "react"; import { Fragment as Fragment9, jsx as jsx47, jsxs as jsxs34 } from "react/jsx-runtime"; function Toast(props) { function getIcon(props2) { if (props2.info) { return InfoIcon; } else if (props2.success) { return CheckboxIcon; } else if (props2.error) { return CloseIcon; } else if (props2.warning) { return CloseIcon; } else { return CheckboxIcon; } } const { title, content } = props; const Icon2 = getIcon(props); return /* @__PURE__ */ jsxs34(Fragment9, { children: [ /* @__PURE__ */ jsx47(Icon2, { size: "sm" }), /* @__PURE__ */ jsxs34("div", { className: "toast-inner-content", children: [ title && /* @__PURE__ */ jsx47("h4", { children: title }), /* @__PURE__ */ jsx47("p", { children: content }) ] }) ] }); } // src/components/ToggleButton/ToggleButton.tsx import "react"; import { ToggleButton as RACToggleButton } from "react-aria-components"; import { jsx as jsx48 } from "react/jsx-runtime"; function ToggleButton(props) { return /* @__PURE__ */ jsx48(RACToggleButton, { ...props }); } // src/components/Toolbar/Toolbar.tsx import "react"; import { Toolbar as RACToolbar2 } from "react-aria-components"; import { jsx as jsx49 } from "react/jsx-runtime"; function Toolbar(props) { return /* @__PURE__ */ jsx49(RACToolbar2, { ...props }); } // src/components/Tooltip/Tooltip.tsx import "react"; import { OverlayArrow as OverlayArrow2, Tooltip as RACTooltip } from "react-aria-components"; import { jsx as jsx50, jsxs as jsxs35 } from "react/jsx-runtime"; function Tooltip({ children, ...props }) { return /* @__PURE__ */ jsxs35(RACTooltip, { ...props, children: [ /* @__PURE__ */ jsx50(OverlayArrow2, { children: /* @__PURE__ */ jsx50("svg", { width: 8, height: 8, viewBox: "0 0 8 8", children: /* @__PURE__ */ jsx50("path", { d: "M0 0 L4 4 L8 0" }) }) }), children ] }); } // src/components/Tree/Tree.tsx import "react"; import { Button as Button12, TreeItemContent as RACTreeItemContent, TreeItem as RACTreeItem, Tree as RACTree } from "react-aria-components"; import { Fragment as Fragment10, jsx as jsx51, jsxs as jsxs36 } from "react/jsx-runtime"; function TreeItemContent(props) { return /* @__PURE__ */ jsx51(RACTreeItemContent, { children: ({ hasChildItems, selectionBehavior, selectionMode }) => /* @__PURE__ */ jsxs36(Fragment10, { children: [ selectionBehavior === "toggle" && selectionMode !== "none" && /* @__PURE__ */ jsx51(Checkbox, { slot: "selection" }), /* @__PURE__ */ jsx51(Button12, { slot: "chevron", children: /* @__PURE__ */ jsx51("svg", { viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx51("path", { d: "m8.25 4.5 7.5 7.5-7.5 7.5" }) }) }), props.children ] }) }); } function TreeItem(props) { return /* @__PURE__ */ jsxs36(RACTreeItem, { textValue: props.title, ...props, children: [ /* @__PURE__ */ jsx51(TreeItemContent, { children: props.title }), props.children ] }); } function Tree({ children, ...props }) { return /* @__PURE__ */ jsx51(RACTree, { ...props, children }); } // src/components/quanta/TextField/TextField.tsx import "react"; import { TextFieldContext } from "react-aria-components"; import { jsx as jsx52 } from "react/jsx-runtime"; function QuantaTextField(props) { return /* @__PURE__ */ jsx52(TextFieldContext.Provider, { value: { className: "q react-aria-TextField" }, children: /* @__PURE__ */ jsx52(TextField, { ...props }) }); } // src/components/quanta/TextAreaField/TextAreaField.tsx import "react"; import { TextFieldContext as TextFieldContext2 } from "react-aria-components"; import { jsx as jsx53 } from "react/jsx-runtime"; function QuantaTextAreaField(props) { return /* @__PURE__ */ jsx53( TextFieldContext2.Provider, { value: { className: "q react-aria-TextAreaField" }, children: /* @__PURE__ */ jsx53(TextAreaField, { ...props }) } ); } // src/components/quanta/Select/Select.tsx import "react"; import { PopoverContext, SelectContext } from "react-aria-components"; import { jsx as jsx54 } from "react/jsx-runtime"; function QuantaSelect(props) { return /* @__PURE__ */ jsx54(SelectContext.Provider, { value: { className: "q react-aria-Select" }, children: /* @__PURE__ */ jsx54(PopoverContext.Provider, { value: { className: "q react-aria-Popover" }, children: /* @__PURE__ */ jsx54(Select, { ...props }) }) }); } export { AlignWidget, BlockToolbar, Breadcrumb, Breadcrumbs, Button, Calendar, Checkbox, CheckboxField, CheckboxGroup, ColorArea, ColorField, ColorPicker, ColorSlider, ColorSwatch, ColorSwatchPicker, ColorWheel, Column, ComboBox, ComboBoxItem, Container, DateField, DatePicker, DateRangePicker, Dialog4 as Dialog, DialogTrigger2 as DialogTrigger, Disclosure, DisclosureGroup, Form, GridList, GridListItem, Icon, Link, ListBox2 as ListBox, ListBoxItem2 as ListBoxItem, Menu, MenuItem, MenuSection, MenuSectionHeader, MenuSeparator, MenuTrigger, Meter, Modal, NumberField, Popover6 as Popover, ProgressBar, QuantaSelect, QuantaTextAreaField, QuantaTextField, Radio, RadioGroup, RangeCalendar2 as RangeCalendar, Row, SearchField, Select, SelectItem, SelectListBox, SelectSection, SelectSectionHeader, SizeWidget, Slider, Spinner, SubmenuTrigger, Switch, Table, TableHeader, Tabs, Tag, TagGroup, TextAreaField, TextField, TimeField, Toast, ToggleButton, Toolbar, Tooltip, Tree, TreeItem, TreeItemContent, WidthWidget };