@backstage/ui 0.15.0-next.2 → 0.15.0-next.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @backstage/ui
2
2
 
3
+ ## 0.15.0-next.3
4
+
5
+ ### Patch Changes
6
+
7
+ - 4bb649d: Fixed Table with row selection creating phantom scroll height on ancestor elements by establishing a containing block for visually-hidden checkbox inputs.
8
+
9
+ **Affected components:** Table, TableRoot
10
+
11
+ - d726bcd: Added new `DatePicker` component — combines a date field and a calendar popover for selecting a date, built on React Aria with full keyboard and screen reader accessibility. Uses BUI design tokens throughout, including auto-incremented backgrounds via the bg consumer pattern.
12
+
13
+ **Affected components:** DatePicker
14
+
3
15
  ## 0.15.0-next.2
4
16
 
5
17
  ### Patch Changes
@@ -0,0 +1,60 @@
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import { forwardRef, useEffect } from 'react';
3
+ import { DatePicker as DatePicker$1 } from 'react-aria-components';
4
+ import { FieldLabel } from '../FieldLabel/FieldLabel.esm.js';
5
+ import { useDefinition } from '../../hooks/useDefinition/useDefinition.esm.js';
6
+ import '../FieldLabel/FieldLabel.module.css.esm.js';
7
+ import { FieldError } from '../FieldError/FieldError.esm.js';
8
+ import '../FieldError/FieldError.module.css.esm.js';
9
+ import { Popover } from '../Popover/Popover.esm.js';
10
+ import '../Popover/Popover.module.css.esm.js';
11
+ import { DatePickerGroup } from './DatePickerGroup.esm.js';
12
+ import { DatePickerCalendar } from './DatePickerCalendar.esm.js';
13
+ import { DatePickerDefinition } from './definition.esm.js';
14
+
15
+ const DatePicker = forwardRef(
16
+ (props, ref) => {
17
+ const { ownProps, restProps, dataAttributes } = useDefinition(
18
+ DatePickerDefinition,
19
+ props
20
+ );
21
+ const { classes, label, description, secondaryLabel } = ownProps;
22
+ const ariaLabel = restProps["aria-label"];
23
+ const ariaLabelledBy = restProps["aria-labelledby"];
24
+ useEffect(() => {
25
+ if (!label && !ariaLabel && !ariaLabelledBy) {
26
+ console.warn(
27
+ "DatePicker requires either a visible label, aria-label, or aria-labelledby for accessibility"
28
+ );
29
+ }
30
+ }, [label, ariaLabel, ariaLabelledBy]);
31
+ const secondaryLabelText = secondaryLabel || (restProps.isRequired ? "Required" : null);
32
+ return /* @__PURE__ */ jsxs(
33
+ DatePicker$1,
34
+ {
35
+ className: classes.root,
36
+ ...dataAttributes,
37
+ ...restProps,
38
+ ref,
39
+ children: [
40
+ /* @__PURE__ */ jsx(
41
+ FieldLabel,
42
+ {
43
+ label,
44
+ secondaryLabel: secondaryLabelText,
45
+ description,
46
+ descriptionSlot: "description"
47
+ }
48
+ ),
49
+ /* @__PURE__ */ jsx(DatePickerGroup, { dataSize: dataAttributes["data-size"] }),
50
+ /* @__PURE__ */ jsx(FieldError, {}),
51
+ /* @__PURE__ */ jsx(Popover, { hideArrow: true, children: /* @__PURE__ */ jsx(DatePickerCalendar, {}) })
52
+ ]
53
+ }
54
+ );
55
+ }
56
+ );
57
+ DatePicker.displayName = "DatePicker";
58
+
59
+ export { DatePicker };
60
+ //# sourceMappingURL=DatePicker.esm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatePicker.esm.js","sources":["../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef, useEffect } from 'react';\nimport { DatePicker as AriaDatePicker } from 'react-aria-components';\nimport { FieldLabel } from '../FieldLabel';\nimport { FieldError } from '../FieldError';\nimport { Popover } from '../Popover';\nimport { DatePickerGroup } from './DatePickerGroup';\nimport { DatePickerCalendar } from './DatePickerCalendar';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { DatePickerDefinition } from './definition';\nimport type { DatePickerProps } from './types';\n\n/**\n * A date picker that combines a date field and a calendar popover, allowing\n * users to enter or select a date with full keyboard and screen reader\n * accessibility.\n *\n * @public\n */\nexport const DatePicker = forwardRef<HTMLDivElement, DatePickerProps>(\n (props, ref) => {\n const { ownProps, restProps, dataAttributes } = useDefinition(\n DatePickerDefinition,\n props,\n );\n\n const { classes, label, description, secondaryLabel } = ownProps;\n\n const ariaLabel = restProps['aria-label'];\n const ariaLabelledBy = restProps['aria-labelledby'];\n\n useEffect(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn(\n 'DatePicker requires either a visible label, aria-label, or aria-labelledby for accessibility',\n );\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n const secondaryLabelText =\n secondaryLabel || (restProps.isRequired ? 'Required' : null);\n\n return (\n <AriaDatePicker\n className={classes.root}\n {...dataAttributes}\n {...restProps}\n ref={ref}\n >\n <FieldLabel\n label={label}\n secondaryLabel={secondaryLabelText}\n description={description}\n descriptionSlot=\"description\"\n />\n <DatePickerGroup dataSize={dataAttributes['data-size']} />\n <FieldError />\n <Popover hideArrow>\n <DatePickerCalendar />\n </Popover>\n </AriaDatePicker>\n );\n },\n);\n\nDatePicker.displayName = 'DatePicker';\n"],"names":["AriaDatePicker"],"mappings":";;;;;;;;;;;;;;AAkCO,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,cAAA,EAAe,GAAI,aAAA;AAAA,MAC9C,oBAAA;AAAA,MACA;AAAA,KACF;AAEA,IAAA,MAAM,EAAE,OAAA,EAAS,KAAA,EAAO,WAAA,EAAa,gBAAe,GAAI,QAAA;AAExD,IAAA,MAAM,SAAA,GAAY,UAAU,YAAY,CAAA;AACxC,IAAA,MAAM,cAAA,GAAiB,UAAU,iBAAiB,CAAA;AAElD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,KAAA,IAAS,CAAC,SAAA,IAAa,CAAC,cAAA,EAAgB;AAC3C,QAAA,OAAA,CAAQ,IAAA;AAAA,UACN;AAAA,SACF;AAAA,MACF;AAAA,IACF,CAAA,EAAG,CAAC,KAAA,EAAO,SAAA,EAAW,cAAc,CAAC,CAAA;AAErC,IAAA,MAAM,kBAAA,GACJ,cAAA,KAAmB,SAAA,CAAU,UAAA,GAAa,UAAA,GAAa,IAAA,CAAA;AAEzD,IAAA,uBACE,IAAA;AAAA,MAACA,YAAA;AAAA,MAAA;AAAA,QACC,WAAW,OAAA,CAAQ,IAAA;AAAA,QAClB,GAAG,cAAA;AAAA,QACH,GAAG,SAAA;AAAA,QACJ,GAAA;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,KAAA;AAAA,cACA,cAAA,EAAgB,kBAAA;AAAA,cAChB,WAAA;AAAA,cACA,eAAA,EAAgB;AAAA;AAAA,WAClB;AAAA,0BACA,GAAA,CAAC,eAAA,EAAA,EAAgB,QAAA,EAAU,cAAA,CAAe,WAAW,CAAA,EAAG,CAAA;AAAA,8BACvD,UAAA,EAAA,EAAW,CAAA;AAAA,8BACX,OAAA,EAAA,EAAQ,SAAA,EAAS,IAAA,EAChB,QAAA,kBAAA,GAAA,CAAC,sBAAmB,CAAA,EACtB;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA;;;;"}
@@ -0,0 +1,8 @@
1
+ import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
2
+
3
+ var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n /* ============================================================\n Root\n ============================================================ */\n\n .DatePicker_bui-DatePicker__5f91f82970 {\n display: flex;\n flex-direction: column;\n font-family: var(--bui-font-regular);\n width: 100%;\n flex-shrink: 0;\n }\n\n /* ============================================================\n Field group — custom container (not reusing any BUI field)\n ============================================================ */\n\n .DatePicker_bui-DatePickerGroup__5f91f82970 {\n display: flex;\n align-items: center;\n background-color: var(--bui-bg-neutral-1);\n border-radius: var(--bui-radius-2);\n padding: 0 var(--bui-space-1) 0 var(--bui-space-3);\n width: fit-content;\n min-width: 200px;\n max-width: 100%;\n overflow: clip;\n transition: box-shadow 0.2s ease-in-out;\n cursor: text;\n\n /* bg consumer — auto-increment background based on parent context */\n &[data-on-bg='neutral-1'] {\n background-color: var(--bui-bg-neutral-2);\n }\n\n &[data-on-bg='neutral-2'] {\n background-color: var(--bui-bg-neutral-3);\n }\n\n &[data-on-bg='neutral-3'] {\n background-color: var(--bui-bg-neutral-4);\n }\n\n &[data-focus-within] {\n outline: none;\n box-shadow: inset 0 0 0 1px var(--bui-ring);\n }\n\n &[data-invalid] {\n box-shadow: inset 0 0 0 1px var(--bui-border-danger);\n }\n\n &[data-disabled] {\n opacity: 0.5;\n cursor: not-allowed;\n }\n\n /* Sizes */\n &[data-size='small'] {\n height: 2rem;\n padding-inline-start: var(--bui-space-2);\n }\n\n &[data-size='medium'] {\n height: 2.5rem;\n min-width: 210px;\n padding-inline-end: var(--bui-space-1);\n\n & .DatePicker_bui-DatePickerButton__5f91f82970 {\n width: 2rem;\n height: 2rem;\n }\n }\n }\n\n /* ============================================================\n Date input\n ============================================================ */\n\n .DatePicker_bui-DatePickerDateInput__5f91f82970 {\n flex: 1;\n display: inline-flex;\n align-items: center;\n width: unset;\n min-width: unset;\n padding: unset;\n border: unset;\n box-shadow: none;\n background: none;\n height: auto;\n overflow-x: auto;\n overflow-y: clip;\n scrollbar-width: none;\n }\n\n /* ============================================================\n Date segments (month, day, year literals and placeholders)\n ============================================================ */\n\n .DatePicker_bui-DatePickerSegment__5f91f82970 {\n display: inline-block;\n padding: var(--bui-space-0_5) var(--bui-space-1);\n border-radius: var(--bui-radius-1);\n font-size: var(--bui-font-size-3);\n font-family: var(--bui-font-regular);\n font-weight: var(--bui-font-weight-regular);\n color: var(--bui-fg-primary);\n caret-color: transparent;\n outline: none;\n font-variant-numeric: tabular-nums;\n\n &[data-placeholder] {\n color: var(--bui-fg-secondary);\n }\n\n &[data-type='literal'] {\n color: var(--bui-fg-secondary);\n padding: 0;\n }\n\n &[data-focused] {\n background-color: var(--bui-bg-solid);\n color: var(--bui-fg-solid);\n border-radius: var(--bui-radius-1);\n\n &[data-placeholder] {\n color: var(--bui-fg-solid);\n }\n }\n\n &[data-disabled] {\n color: var(--bui-fg-disabled);\n }\n }\n\n /* ============================================================\n Calendar trigger button\n ============================================================ */\n\n .DatePicker_bui-DatePickerButton__5f91f82970 {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 1.5rem;\n height: 1.5rem;\n padding: 0;\n background: none;\n border: none;\n border-radius: var(--bui-radius-2);\n color: var(--bui-fg-secondary);\n cursor: pointer;\n margin-left: auto;\n transition: color 0.15s ease-in-out;\n outline: none;\n\n &[data-hovered] {\n color: var(--bui-fg-primary);\n }\n\n &[data-focus-visible] {\n box-shadow: inset 0 0 0 1px var(--bui-ring);\n }\n\n &[data-pressed] {\n color: var(--bui-fg-primary);\n }\n }\n\n /* ============================================================\n Calendar (inside Popover)\n ============================================================ */\n\n .DatePicker_bui-DatePickerCalendar__5f91f82970 {\n width: fit-content;\n outline: none;\n }\n\n .DatePicker_bui-DatePickerCalendarHeader__5f91f82970 {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: var(--bui-space-3);\n }\n\n .DatePicker_bui-DatePickerCalendarHeading__5f91f82970 {\n font-size: var(--bui-font-size-3);\n font-weight: var(--bui-font-weight-bold);\n font-family: var(--bui-font-regular);\n color: var(--bui-fg-primary);\n flex: 1;\n text-align: center;\n }\n\n .DatePicker_bui-DatePickerCalendarNavButton__5f91f82970 {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: var(--bui-space-8);\n height: var(--bui-space-8);\n background: none;\n border: none;\n border-radius: var(--bui-radius-2);\n color: var(--bui-fg-secondary);\n cursor: pointer;\n transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;\n\n &[data-hovered] {\n background-color: var(--bui-bg-neutral-2);\n color: var(--bui-fg-primary);\n }\n\n &[data-focus-visible] {\n outline: 2px solid var(--bui-ring);\n outline-offset: 1px;\n }\n\n &[data-pressed] {\n background-color: var(--bui-bg-neutral-2);\n }\n }\n\n /* ============================================================\n Calendar grid\n ============================================================ */\n\n .DatePicker_bui-DatePickerCalendarGrid__5f91f82970 {\n width: 100%;\n border-collapse: separate;\n border-spacing: 0 2px;\n }\n\n .DatePicker_bui-DatePickerCalendarHeaderCell__5f91f82970 {\n font-size: var(--bui-font-size-2);\n font-weight: var(--bui-font-weight-regular);\n color: var(--bui-fg-secondary);\n text-align: center;\n padding-bottom: var(--bui-space-2);\n width: 40px;\n }\n\n /* ============================================================\n Calendar cells\n ============================================================ */\n\n .DatePicker_bui-DatePickerCalendarCell__5f91f82970 {\n position: relative;\n width: 40px;\n height: 40px;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n outline: none;\n cursor: default;\n font-size: var(--bui-font-size-3);\n font-family: var(--bui-font-regular);\n color: var(--bui-fg-primary);\n border-radius: var(--bui-radius-full);\n\n &[data-outside-month] {\n color: var(--bui-fg-disabled);\n }\n\n &[data-disabled] {\n color: var(--bui-fg-disabled);\n cursor: not-allowed;\n }\n\n &[data-unavailable] {\n color: var(--bui-fg-disabled);\n cursor: not-allowed;\n text-decoration: line-through;\n }\n\n &[data-hovered]:not([data-disabled]):not([data-unavailable]):not(\n [data-selected]\n ) {\n background-color: var(--bui-bg-neutral-2);\n }\n\n &[data-focus-visible] {\n outline: 2px solid var(--bui-ring);\n outline-offset: -2px;\n }\n\n /* Today marker */\n &[data-today]:not([data-selected]) {\n font-weight: var(--bui-font-weight-bold);\n }\n\n /* Selected day */\n &[data-selected] {\n background-color: var(--bui-bg-solid);\n color: var(--bui-fg-solid);\n }\n }\n}\n";
4
+ var styles = {"bui-DatePicker":"DatePicker_bui-DatePicker__5f91f82970","bui-DatePickerGroup":"DatePicker_bui-DatePickerGroup__5f91f82970","bui-DatePickerButton":"DatePicker_bui-DatePickerButton__5f91f82970","bui-DatePickerDateInput":"DatePicker_bui-DatePickerDateInput__5f91f82970","bui-DatePickerSegment":"DatePicker_bui-DatePickerSegment__5f91f82970","bui-DatePickerCalendar":"DatePicker_bui-DatePickerCalendar__5f91f82970","bui-DatePickerCalendarHeader":"DatePicker_bui-DatePickerCalendarHeader__5f91f82970","bui-DatePickerCalendarHeading":"DatePicker_bui-DatePickerCalendarHeading__5f91f82970","bui-DatePickerCalendarNavButton":"DatePicker_bui-DatePickerCalendarNavButton__5f91f82970","bui-DatePickerCalendarGrid":"DatePicker_bui-DatePickerCalendarGrid__5f91f82970","bui-DatePickerCalendarHeaderCell":"DatePicker_bui-DatePickerCalendarHeaderCell__5f91f82970","bui-DatePickerCalendarCell":"DatePicker_bui-DatePickerCalendarCell__5f91f82970"};
5
+ styleInject(css_248z);
6
+
7
+ export { styles as default };
8
+ //# sourceMappingURL=DatePicker.module.css.esm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatePicker.module.css.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
@@ -0,0 +1,24 @@
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import { Calendar, Button, Heading, CalendarGrid, CalendarGridHeader, CalendarHeaderCell, CalendarGridBody, CalendarCell } from 'react-aria-components';
3
+ import { RiArrowLeftSLine, RiArrowRightSLine } from '@remixicon/react';
4
+ import { useDefinition } from '../../hooks/useDefinition/useDefinition.esm.js';
5
+ import { DatePickerCalendarDefinition } from './definition.esm.js';
6
+
7
+ const DatePickerCalendar = () => {
8
+ const { ownProps } = useDefinition(DatePickerCalendarDefinition, {});
9
+ const { classes } = ownProps;
10
+ return /* @__PURE__ */ jsxs(Calendar, { className: classes.root, children: [
11
+ /* @__PURE__ */ jsxs("header", { className: classes.header, children: [
12
+ /* @__PURE__ */ jsx(Button, { slot: "previous", className: classes.navButton, children: /* @__PURE__ */ jsx(RiArrowLeftSLine, { size: 16, "aria-hidden": "true" }) }),
13
+ /* @__PURE__ */ jsx(Heading, { className: classes.heading }),
14
+ /* @__PURE__ */ jsx(Button, { slot: "next", className: classes.navButton, children: /* @__PURE__ */ jsx(RiArrowRightSLine, { size: 16, "aria-hidden": "true" }) })
15
+ ] }),
16
+ /* @__PURE__ */ jsxs(CalendarGrid, { className: classes.grid, children: [
17
+ /* @__PURE__ */ jsx(CalendarGridHeader, { className: classes.gridHeader, children: (day) => /* @__PURE__ */ jsx(CalendarHeaderCell, { className: classes.headerCell, children: day }) }),
18
+ /* @__PURE__ */ jsx(CalendarGridBody, { className: classes.gridBody, children: (date) => /* @__PURE__ */ jsx(CalendarCell, { className: classes.cell, date }) })
19
+ ] })
20
+ ] });
21
+ };
22
+
23
+ export { DatePickerCalendar };
24
+ //# sourceMappingURL=DatePickerCalendar.esm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatePickerCalendar.esm.js","sources":["../../../src/components/DatePicker/DatePickerCalendar.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n Calendar,\n CalendarGrid,\n CalendarGridHeader,\n CalendarHeaderCell,\n CalendarGridBody,\n CalendarCell,\n Heading,\n Button,\n} from 'react-aria-components';\nimport { RiArrowLeftSLine, RiArrowRightSLine } from '@remixicon/react';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { DatePickerCalendarDefinition } from './definition';\n\n/**\n * Calendar popover content for DatePicker — renders the Calendar with\n * navigation and a full calendar grid.\n *\n * @internal\n */\nexport const DatePickerCalendar = () => {\n const { ownProps } = useDefinition(DatePickerCalendarDefinition, {});\n const { classes } = ownProps;\n\n return (\n <Calendar className={classes.root}>\n <header className={classes.header}>\n <Button slot=\"previous\" className={classes.navButton}>\n <RiArrowLeftSLine size={16} aria-hidden=\"true\" />\n </Button>\n <Heading className={classes.heading} />\n <Button slot=\"next\" className={classes.navButton}>\n <RiArrowRightSLine size={16} aria-hidden=\"true\" />\n </Button>\n </header>\n <CalendarGrid className={classes.grid}>\n <CalendarGridHeader className={classes.gridHeader}>\n {day => (\n <CalendarHeaderCell className={classes.headerCell}>\n {day}\n </CalendarHeaderCell>\n )}\n </CalendarGridHeader>\n <CalendarGridBody className={classes.gridBody}>\n {date => <CalendarCell className={classes.cell} date={date} />}\n </CalendarGridBody>\n </CalendarGrid>\n </Calendar>\n );\n};\n"],"names":[],"mappings":";;;;;;AAoCO,MAAM,qBAAqB,MAAM;AACtC,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,aAAA,CAAc,4BAAA,EAA8B,EAAE,CAAA;AACnE,EAAA,MAAM,EAAE,SAAQ,GAAI,QAAA;AAEpB,EAAA,uBACE,IAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAW,OAAA,CAAQ,IAAA,EAC3B,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,QAAA,EAAA,EAAO,SAAA,EAAW,OAAA,CAAQ,MAAA,EACzB,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,IAAA,EAAK,UAAA,EAAW,SAAA,EAAW,OAAA,CAAQ,SAAA,EACzC,QAAA,kBAAA,GAAA,CAAC,gBAAA,EAAA,EAAiB,IAAA,EAAM,EAAA,EAAI,aAAA,EAAY,MAAA,EAAO,CAAA,EACjD,CAAA;AAAA,sBACA,GAAA,CAAC,OAAA,EAAA,EAAQ,SAAA,EAAW,OAAA,CAAQ,OAAA,EAAS,CAAA;AAAA,sBACrC,GAAA,CAAC,MAAA,EAAA,EAAO,IAAA,EAAK,MAAA,EAAO,SAAA,EAAW,OAAA,CAAQ,SAAA,EACrC,QAAA,kBAAA,GAAA,CAAC,iBAAA,EAAA,EAAkB,IAAA,EAAM,EAAA,EAAI,aAAA,EAAY,QAAO,CAAA,EAClD;AAAA,KAAA,EACF,CAAA;AAAA,oBACA,IAAA,CAAC,YAAA,EAAA,EAAa,SAAA,EAAW,OAAA,CAAQ,IAAA,EAC/B,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,kBAAA,EAAA,EAAmB,SAAA,EAAW,OAAA,CAAQ,UAAA,EACpC,QAAA,EAAA,CAAA,GAAA,qBACC,GAAA,CAAC,kBAAA,EAAA,EAAmB,SAAA,EAAW,OAAA,CAAQ,UAAA,EACpC,QAAA,EAAA,GAAA,EACH,CAAA,EAEJ,CAAA;AAAA,sBACA,GAAA,CAAC,gBAAA,EAAA,EAAiB,SAAA,EAAW,OAAA,CAAQ,QAAA,EAClC,QAAA,EAAA,CAAA,IAAA,qBAAQ,GAAA,CAAC,YAAA,EAAA,EAAa,SAAA,EAAW,OAAA,CAAQ,IAAA,EAAM,IAAA,EAAY,CAAA,EAC9D;AAAA,KAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}
@@ -0,0 +1,28 @@
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import { Group, DateInput, DateSegment, Button } from 'react-aria-components';
3
+ import { RiCalendarLine } from '@remixicon/react';
4
+ import { useDefinition } from '../../hooks/useDefinition/useDefinition.esm.js';
5
+ import { DatePickerGroupDefinition } from './definition.esm.js';
6
+
7
+ const DatePickerGroup = ({ dataSize }) => {
8
+ const { ownProps, dataAttributes } = useDefinition(
9
+ DatePickerGroupDefinition,
10
+ {}
11
+ );
12
+ const { classes } = ownProps;
13
+ return /* @__PURE__ */ jsxs(
14
+ Group,
15
+ {
16
+ className: classes.root,
17
+ ...dataAttributes,
18
+ ...dataSize ? { "data-size": dataSize } : {},
19
+ children: [
20
+ /* @__PURE__ */ jsx(DateInput, { className: classes.dateInput, children: (segment) => /* @__PURE__ */ jsx(DateSegment, { segment, className: classes.segment }) }),
21
+ /* @__PURE__ */ jsx(Button, { className: classes.button, "aria-label": "Open calendar", children: /* @__PURE__ */ jsx(RiCalendarLine, { size: 16, "aria-hidden": "true" }) })
22
+ ]
23
+ }
24
+ );
25
+ };
26
+
27
+ export { DatePickerGroup };
28
+ //# sourceMappingURL=DatePickerGroup.esm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatePickerGroup.esm.js","sources":["../../../src/components/DatePicker/DatePickerGroup.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Group, DateInput, DateSegment, Button } from 'react-aria-components';\nimport { RiCalendarLine } from '@remixicon/react';\nimport { useDefinition } from '../../hooks/useDefinition';\nimport { DatePickerGroupDefinition } from './definition';\n\n/**\n * Custom field group for DatePicker — renders a single DateInput field\n * and a calendar trigger button.\n *\n * @internal\n */\nexport const DatePickerGroup = ({ dataSize }: { dataSize?: string }) => {\n const { ownProps, dataAttributes } = useDefinition(\n DatePickerGroupDefinition,\n {},\n );\n const { classes } = ownProps;\n\n return (\n <Group\n className={classes.root}\n {...dataAttributes}\n {...(dataSize ? { 'data-size': dataSize } : {})}\n >\n <DateInput className={classes.dateInput}>\n {segment => (\n <DateSegment segment={segment} className={classes.segment} />\n )}\n </DateInput>\n <Button className={classes.button} aria-label=\"Open calendar\">\n <RiCalendarLine size={16} aria-hidden=\"true\" />\n </Button>\n </Group>\n );\n};\n"],"names":[],"mappings":";;;;;;AA2BO,MAAM,eAAA,GAAkB,CAAC,EAAE,QAAA,EAAS,KAA6B;AACtE,EAAA,MAAM,EAAE,QAAA,EAAU,cAAA,EAAe,GAAI,aAAA;AAAA,IACnC,yBAAA;AAAA,IACA;AAAC,GACH;AACA,EAAA,MAAM,EAAE,SAAQ,GAAI,QAAA;AAEpB,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAW,OAAA,CAAQ,IAAA;AAAA,MAClB,GAAG,cAAA;AAAA,MACH,GAAI,QAAA,GAAW,EAAE,WAAA,EAAa,QAAA,KAAa,EAAC;AAAA,MAE7C,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,SAAA,EAAW,OAAA,CAAQ,SAAA,EAC3B,QAAA,EAAA,CAAA,OAAA,qBACC,GAAA,CAAC,WAAA,EAAA,EAAY,OAAA,EAAkB,SAAA,EAAW,OAAA,CAAQ,OAAA,EAAS,CAAA,EAE/D,CAAA;AAAA,wBACA,GAAA,CAAC,MAAA,EAAA,EAAO,SAAA,EAAW,OAAA,CAAQ,MAAA,EAAQ,YAAA,EAAW,eAAA,EAC5C,QAAA,kBAAA,GAAA,CAAC,cAAA,EAAA,EAAe,IAAA,EAAM,EAAA,EAAI,aAAA,EAAY,QAAO,CAAA,EAC/C;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}
@@ -0,0 +1,52 @@
1
+ import 'react/jsx-runtime';
2
+ import 'clsx';
3
+ import '../../hooks/useBreakpoint.esm.js';
4
+ import '../../hooks/useBg.esm.js';
5
+ import '../../hooks/useDefinition/helpers.esm.js';
6
+ import '../../analytics/useAnalytics.esm.js';
7
+ import 'react-router-dom';
8
+ import { defineComponent } from '../../hooks/useDefinition/defineComponent.esm.js';
9
+ import styles from './DatePicker.module.css.esm.js';
10
+
11
+ const DatePickerDefinition = defineComponent()({
12
+ styles,
13
+ classNames: {
14
+ root: "bui-DatePicker"
15
+ },
16
+ propDefs: {
17
+ size: { dataAttribute: true, default: "small" },
18
+ className: {},
19
+ label: {},
20
+ description: {},
21
+ secondaryLabel: {}
22
+ }
23
+ });
24
+ const DatePickerGroupDefinition = defineComponent()({
25
+ styles,
26
+ classNames: {
27
+ root: "bui-DatePickerGroup",
28
+ dateInput: "bui-DatePickerDateInput",
29
+ segment: "bui-DatePickerSegment",
30
+ button: "bui-DatePickerButton"
31
+ },
32
+ bg: "consumer",
33
+ propDefs: {}
34
+ });
35
+ const DatePickerCalendarDefinition = defineComponent()({
36
+ styles,
37
+ classNames: {
38
+ root: "bui-DatePickerCalendar",
39
+ header: "bui-DatePickerCalendarHeader",
40
+ heading: "bui-DatePickerCalendarHeading",
41
+ navButton: "bui-DatePickerCalendarNavButton",
42
+ grid: "bui-DatePickerCalendarGrid",
43
+ gridHeader: "bui-DatePickerCalendarGridHeader",
44
+ headerCell: "bui-DatePickerCalendarHeaderCell",
45
+ gridBody: "bui-DatePickerCalendarGridBody",
46
+ cell: "bui-DatePickerCalendarCell"
47
+ },
48
+ propDefs: {}
49
+ });
50
+
51
+ export { DatePickerCalendarDefinition, DatePickerDefinition, DatePickerGroupDefinition };
52
+ //# sourceMappingURL=definition.esm.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"definition.esm.js","sources":["../../../src/components/DatePicker/definition.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { defineComponent } from '../../hooks/useDefinition';\nimport type { DatePickerOwnProps } from './types';\nimport styles from './DatePicker.module.css';\n\n/**\n * Component definition for DatePicker\n * @public\n */\nexport const DatePickerDefinition = defineComponent<DatePickerOwnProps>()({\n styles,\n classNames: {\n root: 'bui-DatePicker',\n },\n propDefs: {\n size: { dataAttribute: true, default: 'small' },\n className: {},\n label: {},\n description: {},\n secondaryLabel: {},\n },\n});\n\n/**\n * Component definition for DatePickerGroup\n * @public\n */\nexport const DatePickerGroupDefinition = defineComponent<\n Record<string, never>\n>()({\n styles,\n classNames: {\n root: 'bui-DatePickerGroup',\n dateInput: 'bui-DatePickerDateInput',\n segment: 'bui-DatePickerSegment',\n button: 'bui-DatePickerButton',\n },\n bg: 'consumer',\n propDefs: {},\n});\n\n/**\n * Component definition for DatePickerCalendar\n * @public\n */\nexport const DatePickerCalendarDefinition = defineComponent<\n Record<string, never>\n>()({\n styles,\n classNames: {\n root: 'bui-DatePickerCalendar',\n header: 'bui-DatePickerCalendarHeader',\n heading: 'bui-DatePickerCalendarHeading',\n navButton: 'bui-DatePickerCalendarNavButton',\n grid: 'bui-DatePickerCalendarGrid',\n gridHeader: 'bui-DatePickerCalendarGridHeader',\n headerCell: 'bui-DatePickerCalendarHeaderCell',\n gridBody: 'bui-DatePickerCalendarGridBody',\n cell: 'bui-DatePickerCalendarCell',\n },\n propDefs: {},\n});\n"],"names":[],"mappings":";;;;;;;;;;AAwBO,MAAM,oBAAA,GAAuB,iBAAoC,CAAE;AAAA,EACxE,MAAA;AAAA,EACA,UAAA,EAAY;AAAA,IACV,IAAA,EAAM;AAAA,GACR;AAAA,EACA,QAAA,EAAU;AAAA,IACR,IAAA,EAAM,EAAE,aAAA,EAAe,IAAA,EAAM,SAAS,OAAA,EAAQ;AAAA,IAC9C,WAAW,EAAC;AAAA,IACZ,OAAO,EAAC;AAAA,IACR,aAAa,EAAC;AAAA,IACd,gBAAgB;AAAC;AAErB,CAAC;AAMM,MAAM,yBAAA,GAA4B,iBAEvC,CAAE;AAAA,EACF,MAAA;AAAA,EACA,UAAA,EAAY;AAAA,IACV,IAAA,EAAM,qBAAA;AAAA,IACN,SAAA,EAAW,yBAAA;AAAA,IACX,OAAA,EAAS,uBAAA;AAAA,IACT,MAAA,EAAQ;AAAA,GACV;AAAA,EACA,EAAA,EAAI,UAAA;AAAA,EACJ,UAAU;AACZ,CAAC;AAMM,MAAM,4BAAA,GAA+B,iBAE1C,CAAE;AAAA,EACF,MAAA;AAAA,EACA,UAAA,EAAY;AAAA,IACV,IAAA,EAAM,wBAAA;AAAA,IACN,MAAA,EAAQ,8BAAA;AAAA,IACR,OAAA,EAAS,+BAAA;AAAA,IACT,SAAA,EAAW,iCAAA;AAAA,IACX,IAAA,EAAM,4BAAA;AAAA,IACN,UAAA,EAAY,kCAAA;AAAA,IACZ,UAAA,EAAY,kCAAA;AAAA,IACZ,QAAA,EAAU,gCAAA;AAAA,IACV,IAAA,EAAM;AAAA,GACR;AAAA,EACA,UAAU;AACZ,CAAC;;;;"}
@@ -1,7 +1,7 @@
1
1
  import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
2
2
 
3
- var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Table_bui-TableWrapper__1e8e8291a0 {\n display: flex;\n flex-direction: column;\n }\n\n .Table_bui-TableResizableContainer__1e8e8291a0 {\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n overflow: hidden;\n }\n\n .Table_bui-Table__1e8e8291a0 {\n width: 100%;\n caption-side: bottom;\n border-collapse: collapse;\n table-layout: fixed;\n transition: opacity 0.2s ease-in-out;\n overflow: auto;\n flex: 1;\n min-height: 0;\n\n &[data-stale='true'],\n &[data-ispending='true'] {\n opacity: 0.6;\n }\n }\n\n .Table_bui-TableHeader__1e8e8291a0 {\n border-bottom: 1px solid var(--bui-border-2);\n transition: color 0.2s ease-in-out;\n }\n\n .Table_bui-TableHead__1e8e8291a0 {\n text-align: left;\n padding: var(--bui-space-3);\n font-size: var(--bui-font-size-3);\n color: var(--bui-fg-primary);\n }\n\n .Table_bui-TableHeadSelection__1e8e8291a0 {\n width: 40px;\n }\n\n .Table_bui-TableHeadContent__1e8e8291a0 {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--bui-space-1);\n }\n\n .Table_bui-TableHeadLabel__1e8e8291a0 {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n min-width: 0;\n }\n\n .Table_bui-TableHeadSortButton__1e8e8291a0 {\n cursor: pointer;\n user-select: none;\n display: inline-flex;\n align-items: center;\n gap: var(--bui-space-1);\n opacity: 0;\n transition: opacity 0.1s ease-in-out;\n color: var(--bui-fg-secondary);\n\n .Table_bui-TableHead__1e8e8291a0:hover &,\n [data-sort-direction='ascending'] &,\n [data-sort-direction='descending'] & {\n opacity: 1;\n }\n\n & svg {\n transition: transform 0.1s ease-in-out;\n }\n [data-sort-direction='descending'] & svg {\n transform: rotate(180deg);\n }\n }\n\n .Table_bui-TableBody__1e8e8291a0 {\n color: var(--bui-fg-primary);\n }\n\n .Table_bui-TableRow__1e8e8291a0 {\n border-bottom: 1px solid var(--bui-border-2);\n transition: color 0.2s ease-in-out;\n cursor: default;\n\n &:hover {\n background-color: var(--bui-bg-neutral-1-hover);\n }\n\n &[data-selected] {\n background-color: var(--bui-bg-neutral-1-pressed);\n }\n\n &[data-pressed] {\n background-color: var(--bui-bg-neutral-1-pressed);\n }\n\n &[data-on-bg='neutral-1'] {\n &:hover {\n background-color: var(--bui-bg-neutral-2-hover);\n }\n\n &[data-selected] {\n background-color: var(--bui-bg-neutral-2-pressed);\n }\n\n &[data-pressed] {\n background-color: var(--bui-bg-neutral-2-pressed);\n }\n\n &[data-disabled] {\n background-color: var(--bui-bg-neutral-2-disabled);\n }\n }\n\n &[data-on-bg='neutral-2'] {\n &:hover {\n background-color: var(--bui-bg-neutral-3-hover);\n }\n\n &[data-selected] {\n background-color: var(--bui-bg-neutral-3-pressed);\n }\n\n &[data-pressed] {\n background-color: var(--bui-bg-neutral-3-pressed);\n }\n\n &[data-disabled] {\n background-color: var(--bui-bg-neutral-3-disabled);\n }\n }\n\n &[data-on-bg='neutral-3'] {\n &:hover {\n background-color: var(--bui-bg-neutral-4-hover);\n }\n\n &[data-selected] {\n background-color: var(--bui-bg-neutral-4-pressed);\n }\n\n &[data-pressed] {\n background-color: var(--bui-bg-neutral-4-pressed);\n }\n\n &[data-disabled] {\n background-color: var(--bui-bg-neutral-4-disabled);\n }\n }\n\n &[data-href],\n &[data-selection-mode],\n &[data-react-aria-pressable='true'] {\n cursor: pointer;\n }\n\n &[data-disabled] {\n background-color: var(--bui-bg-neutral-1-disabled);\n cursor: not-allowed;\n }\n }\n\n .Table_bui-TableCell__1e8e8291a0 {\n padding: var(--bui-space-3);\n font-size: var(--bui-font-size-3);\n font-family: var(--bui-font-regular);\n font-weight: var(--bui-font-weight-regular);\n min-width: 0;\n overflow: hidden;\n }\n\n .Table_bui-TableCellSelection__1e8e8291a0 {\n width: 40px;\n }\n\n .Table_bui-TableCellContentWrapper__1e8e8291a0 {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--bui-space-2);\n min-width: 0;\n width: 100%;\n max-width: 100%;\n }\n\n .Table_bui-TableCellIcon__1e8e8291a0,\n .Table_bui-TableCellIcon__1e8e8291a0 svg {\n display: inline-flex;\n align-items: center;\n color: var(--bui-fg-primary);\n }\n\n .Table_bui-TableCellContent__1e8e8291a0 {\n display: flex;\n flex-direction: column;\n gap: var(--bui-space-0_5);\n min-width: 0;\n flex: 1;\n overflow: hidden;\n max-width: 100%;\n }\n\n .Table_bui-TableCellContent__1e8e8291a0 > * {\n min-width: 0;\n max-width: 100%;\n }\n\n .Table_bui-TableCellProfile__1e8e8291a0 {\n display: flex;\n flex-direction: row;\n gap: var(--bui-space-2);\n align-items: center;\n }\n}\n";
4
- var styles = {"bui-TableWrapper":"Table_bui-TableWrapper__1e8e8291a0","bui-TableResizableContainer":"Table_bui-TableResizableContainer__1e8e8291a0","bui-Table":"Table_bui-Table__1e8e8291a0","bui-TableHeader":"Table_bui-TableHeader__1e8e8291a0","bui-TableHead":"Table_bui-TableHead__1e8e8291a0","bui-TableHeadSelection":"Table_bui-TableHeadSelection__1e8e8291a0","bui-TableHeadContent":"Table_bui-TableHeadContent__1e8e8291a0","bui-TableHeadLabel":"Table_bui-TableHeadLabel__1e8e8291a0","bui-TableHeadSortButton":"Table_bui-TableHeadSortButton__1e8e8291a0","bui-TableBody":"Table_bui-TableBody__1e8e8291a0","bui-TableRow":"Table_bui-TableRow__1e8e8291a0","bui-TableCell":"Table_bui-TableCell__1e8e8291a0","bui-TableCellSelection":"Table_bui-TableCellSelection__1e8e8291a0","bui-TableCellContentWrapper":"Table_bui-TableCellContentWrapper__1e8e8291a0","bui-TableCellIcon":"Table_bui-TableCellIcon__1e8e8291a0","bui-TableCellContent":"Table_bui-TableCellContent__1e8e8291a0","bui-TableCellProfile":"Table_bui-TableCellProfile__1e8e8291a0"};
3
+ var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Table_bui-TableWrapper__61510929c4 {\n display: flex;\n flex-direction: column;\n }\n\n .Table_bui-TableResizableContainer__61510929c4 {\n display: flex;\n flex-direction: column;\n flex: 1;\n min-height: 0;\n overflow: hidden;\n }\n\n .Table_bui-Table__61510929c4 {\n /* Establishes containing block for react-aria's absolutely positioned hidden checkbox inputs, preventing them from escaping to a distant ancestor and creating phantom scroll height. */\n position: relative;\n width: 100%;\n caption-side: bottom;\n border-collapse: collapse;\n table-layout: fixed;\n transition: opacity 0.2s ease-in-out;\n overflow: auto;\n flex: 1;\n min-height: 0;\n\n &[data-stale='true'],\n &[data-ispending='true'] {\n opacity: 0.6;\n }\n }\n\n .Table_bui-TableHeader__61510929c4 {\n border-bottom: 1px solid var(--bui-border-2);\n transition: color 0.2s ease-in-out;\n }\n\n .Table_bui-TableHead__61510929c4 {\n text-align: left;\n padding: var(--bui-space-3);\n font-size: var(--bui-font-size-3);\n color: var(--bui-fg-primary);\n }\n\n .Table_bui-TableHeadSelection__61510929c4 {\n width: 40px;\n }\n\n .Table_bui-TableHeadContent__61510929c4 {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--bui-space-1);\n }\n\n .Table_bui-TableHeadLabel__61510929c4 {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n min-width: 0;\n }\n\n .Table_bui-TableHeadSortButton__61510929c4 {\n cursor: pointer;\n user-select: none;\n display: inline-flex;\n align-items: center;\n gap: var(--bui-space-1);\n opacity: 0;\n transition: opacity 0.1s ease-in-out;\n color: var(--bui-fg-secondary);\n\n .Table_bui-TableHead__61510929c4:hover &,\n [data-sort-direction='ascending'] &,\n [data-sort-direction='descending'] & {\n opacity: 1;\n }\n\n & svg {\n transition: transform 0.1s ease-in-out;\n }\n [data-sort-direction='descending'] & svg {\n transform: rotate(180deg);\n }\n }\n\n .Table_bui-TableBody__61510929c4 {\n color: var(--bui-fg-primary);\n }\n\n .Table_bui-TableRow__61510929c4 {\n border-bottom: 1px solid var(--bui-border-2);\n transition: color 0.2s ease-in-out;\n cursor: default;\n\n &:hover {\n background-color: var(--bui-bg-neutral-1-hover);\n }\n\n &[data-selected] {\n background-color: var(--bui-bg-neutral-1-pressed);\n }\n\n &[data-pressed] {\n background-color: var(--bui-bg-neutral-1-pressed);\n }\n\n &[data-on-bg='neutral-1'] {\n &:hover {\n background-color: var(--bui-bg-neutral-2-hover);\n }\n\n &[data-selected] {\n background-color: var(--bui-bg-neutral-2-pressed);\n }\n\n &[data-pressed] {\n background-color: var(--bui-bg-neutral-2-pressed);\n }\n\n &[data-disabled] {\n background-color: var(--bui-bg-neutral-2-disabled);\n }\n }\n\n &[data-on-bg='neutral-2'] {\n &:hover {\n background-color: var(--bui-bg-neutral-3-hover);\n }\n\n &[data-selected] {\n background-color: var(--bui-bg-neutral-3-pressed);\n }\n\n &[data-pressed] {\n background-color: var(--bui-bg-neutral-3-pressed);\n }\n\n &[data-disabled] {\n background-color: var(--bui-bg-neutral-3-disabled);\n }\n }\n\n &[data-on-bg='neutral-3'] {\n &:hover {\n background-color: var(--bui-bg-neutral-4-hover);\n }\n\n &[data-selected] {\n background-color: var(--bui-bg-neutral-4-pressed);\n }\n\n &[data-pressed] {\n background-color: var(--bui-bg-neutral-4-pressed);\n }\n\n &[data-disabled] {\n background-color: var(--bui-bg-neutral-4-disabled);\n }\n }\n\n &[data-href],\n &[data-selection-mode],\n &[data-react-aria-pressable='true'] {\n cursor: pointer;\n }\n\n &[data-disabled] {\n background-color: var(--bui-bg-neutral-1-disabled);\n cursor: not-allowed;\n }\n }\n\n .Table_bui-TableCell__61510929c4 {\n padding: var(--bui-space-3);\n font-size: var(--bui-font-size-3);\n font-family: var(--bui-font-regular);\n font-weight: var(--bui-font-weight-regular);\n min-width: 0;\n overflow: hidden;\n }\n\n .Table_bui-TableCellSelection__61510929c4 {\n width: 40px;\n }\n\n .Table_bui-TableCellContentWrapper__61510929c4 {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--bui-space-2);\n min-width: 0;\n width: 100%;\n max-width: 100%;\n }\n\n .Table_bui-TableCellIcon__61510929c4,\n .Table_bui-TableCellIcon__61510929c4 svg {\n display: inline-flex;\n align-items: center;\n color: var(--bui-fg-primary);\n }\n\n .Table_bui-TableCellContent__61510929c4 {\n display: flex;\n flex-direction: column;\n gap: var(--bui-space-0_5);\n min-width: 0;\n flex: 1;\n overflow: hidden;\n max-width: 100%;\n }\n\n .Table_bui-TableCellContent__61510929c4 > * {\n min-width: 0;\n max-width: 100%;\n }\n\n .Table_bui-TableCellProfile__61510929c4 {\n display: flex;\n flex-direction: row;\n gap: var(--bui-space-2);\n align-items: center;\n }\n}\n";
4
+ var styles = {"bui-TableWrapper":"Table_bui-TableWrapper__61510929c4","bui-TableResizableContainer":"Table_bui-TableResizableContainer__61510929c4","bui-Table":"Table_bui-Table__61510929c4","bui-TableHeader":"Table_bui-TableHeader__61510929c4","bui-TableHead":"Table_bui-TableHead__61510929c4","bui-TableHeadSelection":"Table_bui-TableHeadSelection__61510929c4","bui-TableHeadContent":"Table_bui-TableHeadContent__61510929c4","bui-TableHeadLabel":"Table_bui-TableHeadLabel__61510929c4","bui-TableHeadSortButton":"Table_bui-TableHeadSortButton__61510929c4","bui-TableBody":"Table_bui-TableBody__61510929c4","bui-TableRow":"Table_bui-TableRow__61510929c4","bui-TableCell":"Table_bui-TableCell__61510929c4","bui-TableCellSelection":"Table_bui-TableCellSelection__61510929c4","bui-TableCellContentWrapper":"Table_bui-TableCellContentWrapper__61510929c4","bui-TableCellIcon":"Table_bui-TableCellIcon__61510929c4","bui-TableCellContent":"Table_bui-TableCellContent__61510929c4","bui-TableCellProfile":"Table_bui-TableCellProfile__61510929c4"};
5
5
  styleInject(css_248z);
6
6
 
7
7
  export { styles as default };
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as react from 'react';
2
2
  import { CSSProperties, ReactNode, HTMLAttributes, ComponentPropsWithoutRef, ReactElement, ElementType, ComponentPropsWithRef, ComponentProps } from 'react';
3
- import { DisclosureProps, DisclosureGroupProps, DisclosurePanelProps, HeadingProps, ButtonProps as ButtonProps$1, DateRangePickerProps as DateRangePickerProps$1, ModalOverlayProps, DialogTriggerProps as DialogTriggerProps$1, TabProps as TabProps$1, TabListProps as TabListProps$1, TabPanelProps as TabPanelProps$1, TabsProps as TabsProps$1, LinkProps as LinkProps$1, CheckboxProps as CheckboxProps$1, CheckboxGroupProps as CheckboxGroupProps$1, SelectProps as SelectProps$1, ComboBoxProps, RadioProps as RadioProps$1, RadioGroupProps as RadioGroupProps$1, SliderProps as SliderProps$1, CellProps as CellProps$1, ColumnProps as ColumnProps$1, RowProps as RowProps$1, TableProps as TableProps$1, TableBodyProps as TableBodyProps$1, TableHeaderProps as TableHeaderProps$1, TagProps as TagProps$1, TagListProps, TagGroupProps as TagGroupProps$1, TextFieldProps as TextFieldProps$1, TooltipProps as TooltipProps$1, TooltipTriggerComponentProps, PopoverProps as PopoverProps$1, MenuProps as MenuProps$1, ListBoxProps, MenuItemProps as MenuItemProps$1, ListBoxItemProps, MenuSectionProps as MenuSectionProps$1, SeparatorProps, MenuTriggerProps as MenuTriggerProps$1, SubmenuTriggerProps as SubmenuTriggerProps$1, SearchFieldProps as SearchFieldProps$1, GridListProps, GridListItemProps, SwitchProps as SwitchProps$1, ToggleButtonProps as ToggleButtonProps$1, ToggleButtonGroupProps as ToggleButtonGroupProps$1 } from 'react-aria-components';
3
+ import { DisclosureProps, DisclosureGroupProps, DisclosurePanelProps, HeadingProps, ButtonProps as ButtonProps$1, DatePickerProps as DatePickerProps$1, DateRangePickerProps as DateRangePickerProps$1, ModalOverlayProps, DialogTriggerProps as DialogTriggerProps$1, TabProps as TabProps$1, TabListProps as TabListProps$1, TabPanelProps as TabPanelProps$1, TabsProps as TabsProps$1, LinkProps as LinkProps$1, CheckboxProps as CheckboxProps$1, CheckboxGroupProps as CheckboxGroupProps$1, SelectProps as SelectProps$1, ComboBoxProps, RadioProps as RadioProps$1, RadioGroupProps as RadioGroupProps$1, SliderProps as SliderProps$1, CellProps as CellProps$1, ColumnProps as ColumnProps$1, RowProps as RowProps$1, TableProps as TableProps$1, TableBodyProps as TableBodyProps$1, TableHeaderProps as TableHeaderProps$1, TagProps as TagProps$1, TagListProps, TagGroupProps as TagGroupProps$1, TextFieldProps as TextFieldProps$1, TooltipProps as TooltipProps$1, TooltipTriggerComponentProps, PopoverProps as PopoverProps$1, MenuProps as MenuProps$1, ListBoxProps, MenuItemProps as MenuItemProps$1, ListBoxItemProps, MenuSectionProps as MenuSectionProps$1, SeparatorProps, MenuTriggerProps as MenuTriggerProps$1, SubmenuTriggerProps as SubmenuTriggerProps$1, SearchFieldProps as SearchFieldProps$1, GridListProps, GridListItemProps, SwitchProps as SwitchProps$1, ToggleButtonProps as ToggleButtonProps$1, ToggleButtonGroupProps as ToggleButtonGroupProps$1 } from 'react-aria-components';
4
4
  import { DateValue } from '@internationalized/date';
5
5
  import * as react_jsx_runtime from 'react/jsx-runtime';
6
6
  import { NavigateOptions } from 'react-router-dom';
@@ -1104,6 +1104,92 @@ type FieldLabelOwnProps = {
1104
1104
  interface FieldLabelProps extends FieldLabelOwnProps, Omit<React.ComponentPropsWithoutRef<'div'>, keyof FieldLabelOwnProps> {
1105
1105
  }
1106
1106
 
1107
+ /** @public */
1108
+ type DatePickerOwnProps = {
1109
+ /**
1110
+ * The size of the date picker
1111
+ * @defaultValue 'small'
1112
+ */
1113
+ size?: 'small' | 'medium' | Partial<Record<Breakpoint, 'small' | 'medium'>>;
1114
+ className?: string;
1115
+ label?: FieldLabelProps['label'];
1116
+ description?: FieldLabelProps['description'];
1117
+ secondaryLabel?: FieldLabelProps['secondaryLabel'];
1118
+ };
1119
+ /** @public */
1120
+ interface DatePickerProps extends Omit<DatePickerProps$1<DateValue>, 'className' | 'children'>, DatePickerOwnProps {
1121
+ }
1122
+
1123
+ /**
1124
+ * A date picker that combines a date field and a calendar popover, allowing
1125
+ * users to enter or select a date with full keyboard and screen reader
1126
+ * accessibility.
1127
+ *
1128
+ * @public
1129
+ */
1130
+ declare const DatePicker: react.ForwardRefExoticComponent<DatePickerProps & react.RefAttributes<HTMLDivElement>>;
1131
+
1132
+ /**
1133
+ * Component definition for DatePicker
1134
+ * @public
1135
+ */
1136
+ declare const DatePickerDefinition: {
1137
+ readonly styles: {
1138
+ readonly [key: string]: string;
1139
+ };
1140
+ readonly classNames: {
1141
+ readonly root: "bui-DatePicker";
1142
+ };
1143
+ readonly propDefs: {
1144
+ readonly size: {
1145
+ readonly dataAttribute: true;
1146
+ readonly default: "small";
1147
+ };
1148
+ readonly className: {};
1149
+ readonly label: {};
1150
+ readonly description: {};
1151
+ readonly secondaryLabel: {};
1152
+ };
1153
+ };
1154
+ /**
1155
+ * Component definition for DatePickerGroup
1156
+ * @public
1157
+ */
1158
+ declare const DatePickerGroupDefinition: {
1159
+ readonly styles: {
1160
+ readonly [key: string]: string;
1161
+ };
1162
+ readonly classNames: {
1163
+ readonly root: "bui-DatePickerGroup";
1164
+ readonly dateInput: "bui-DatePickerDateInput";
1165
+ readonly segment: "bui-DatePickerSegment";
1166
+ readonly button: "bui-DatePickerButton";
1167
+ };
1168
+ readonly bg: "consumer";
1169
+ readonly propDefs: {};
1170
+ };
1171
+ /**
1172
+ * Component definition for DatePickerCalendar
1173
+ * @public
1174
+ */
1175
+ declare const DatePickerCalendarDefinition: {
1176
+ readonly styles: {
1177
+ readonly [key: string]: string;
1178
+ };
1179
+ readonly classNames: {
1180
+ readonly root: "bui-DatePickerCalendar";
1181
+ readonly header: "bui-DatePickerCalendarHeader";
1182
+ readonly heading: "bui-DatePickerCalendarHeading";
1183
+ readonly navButton: "bui-DatePickerCalendarNavButton";
1184
+ readonly grid: "bui-DatePickerCalendarGrid";
1185
+ readonly gridHeader: "bui-DatePickerCalendarGridHeader";
1186
+ readonly headerCell: "bui-DatePickerCalendarHeaderCell";
1187
+ readonly gridBody: "bui-DatePickerCalendarGridBody";
1188
+ readonly cell: "bui-DatePickerCalendarCell";
1189
+ };
1190
+ readonly propDefs: {};
1191
+ };
1192
+
1107
1193
  /** @public */
1108
1194
  type DateRangePickerOwnProps = {
1109
1195
  /**
@@ -4119,5 +4205,5 @@ declare function useAnalytics(): AnalyticsTracker;
4119
4205
  */
4120
4206
  declare function getNodeText(node: ReactNode | ((...args: any[]) => ReactNode)): string | undefined;
4121
4207
 
4122
- export { Accordion, AccordionDefinition, AccordionGroup, AccordionGroupDefinition, AccordionPanel, AccordionPanelDefinition, AccordionTrigger, AccordionTriggerDefinition, Alert, AlertDefinition, Avatar, AvatarDefinition, BUIProvider, Badge, BadgeDefinition, BgProvider, Box, BoxDefinition, Button, ButtonDefinition, ButtonIcon, ButtonIconDefinition, ButtonLink, ButtonLinkDefinition, Card, CardBody, CardBodyDefinition, CardDefinition, CardFooter, CardFooterDefinition, CardHeader, CardHeaderDefinition, Cell, CellProfile, CellText, Checkbox, CheckboxDefinition, CheckboxGroup, CheckboxGroupDefinition, Column, Combobox, ComboboxDefinition, ComboboxInputDefinition, ComboboxListBoxDefinition, ComboboxListBoxItemDefinition, ComboboxSectionDefinition, Container, ContainerDefinition, DateRangePicker, DateRangePickerDefinition, Dialog, DialogBody, DialogBodyDefinition, DialogDefinition, DialogFooter, DialogFooterDefinition, DialogHeader, DialogHeaderDefinition, DialogTrigger, FieldLabel, FieldLabelDefinition, Flex, FlexDefinition, FullPage, FullPageDefinition, Grid, GridDefinition, GridItemDefinition, Header, HeaderDefinition, HeaderMetadataStatus, HeaderMetadataUsers, HeaderNavDefinition, HeaderNavGroupDefinition, HeaderNavItemDefinition, HeaderPage, HeaderPageDefinition, Link, LinkDefinition, List, ListDefinition, ListRow, ListRowDefinition, Menu, MenuAutocomplete, MenuAutocompleteListbox, MenuDefinition, MenuItem, MenuListBox, MenuListBoxItem, MenuSection, MenuSeparator, MenuTrigger, PasswordField, PasswordFieldDefinition, PluginHeader, PluginHeaderDefinition, Popover, PopoverDefinition, Radio, RadioDefinition, RadioGroup, RadioGroupDefinition, Row, SearchAutocomplete, SearchAutocompleteDefinition, SearchAutocompleteItem, SearchField, SearchFieldDefinition, Select, SelectDefinition, Skeleton, SkeletonDefinition, Slider, SliderDefinition, SubmenuTrigger, Switch, SwitchDefinition, Tab, TabList, TabPanel, Table, TableBody, TableBodySkeleton, TableDefinition, TableHeader, TablePagination, TablePaginationDefinition, TableRoot, Tabs, TabsDefinition, Tag, TagGroup, TagGroupDefinition, Text, TextDefinition, TextField, TextFieldDefinition, ToggleButton, ToggleButtonDefinition, ToggleButtonGroup, ToggleButtonGroupDefinition, Tooltip, TooltipDefinition, TooltipTrigger, VisuallyHidden, VisuallyHiddenDefinition, getNodeText, useAnalytics, useBgConsumer, useBgProvider, useBreakpoint, useTable };
4123
- export type { AccordionGroupOwnProps, AccordionGroupProps, AccordionOwnProps, AccordionPanelOwnProps, AccordionPanelProps, AccordionProps, AccordionTriggerOwnProps, AccordionTriggerProps, AlertOwnProps, AlertProps, AlignItems, AnalyticsEventAttributes, AnalyticsTracker, AvatarOwnProps, AvatarProps, BUIProviderProps, BadgeOwnProps, BadgeProps, BgContextValue, BgProviderProps, Border, BorderRadius, BoxOwnProps, BoxProps, BoxUtilityProps, Breakpoint, ButtonIconOwnProps, ButtonIconProps, ButtonLinkOwnProps, ButtonLinkProps, ButtonOwnProps, ButtonProps, CardBaseProps, CardBodyOwnProps, CardBodyProps, CardButtonVariant, CardFooterOwnProps, CardFooterProps, CardHeaderOwnProps, CardHeaderProps, CardLinkVariant, CardOwnProps, CardProps, CardStaticVariant, CellOwnProps, CellProfileOwnProps, CellProfileProps, CellProps, CellTextOwnProps, CellTextProps, CheckboxGroupOwnProps, CheckboxGroupProps, CheckboxOwnProps, CheckboxProps, ColumnConfig, ColumnOwnProps, ColumnProps, Columns, ComboboxOwnProps, ComboboxProps, CompletePaginationOptions, ContainerBg, ContainerOwnProps, ContainerProps, CursorParams, CursorResponse, DateRangePickerOwnProps, DateRangePickerProps, DialogBodyOwnProps, DialogBodyProps, DialogFooterOwnProps, DialogFooterProps, DialogHeaderOwnProps, DialogHeaderProps, DialogOwnProps, DialogProps, DialogTriggerProps, Display, FieldLabelOwnProps, FieldLabelProps, FilterState, FlexDirection, FlexItemProps, FlexOwnProps, FlexProps, FlexWrap, FullPageOwnProps, FullPageProps, GridItemOwnProps, GridItemProps, GridOwnProps, GridProps, HeaderBreadcrumb, HeaderMetadataItem, HeaderMetadataStatusProps, HeaderMetadataUser, HeaderNavTab, HeaderNavTabGroup, HeaderNavTabItem, HeaderOwnProps, HeaderPageBreadcrumb, HeaderPageOwnProps, HeaderPageProps, HeaderProps, HeaderTab, HeaderTag, JustifyContent, LinkOwnProps, LinkProps, ListOwnProps, ListProps, ListRowOwnProps, ListRowProps, MarginProps, MenuAutocompleteListBoxOwnProps, MenuAutocompleteListBoxProps, MenuAutocompleteOwnProps, MenuAutocompleteProps, MenuItemOwnProps, MenuItemProps, MenuListBoxItemOwnProps, MenuListBoxItemProps, MenuListBoxOwnProps, MenuListBoxProps, MenuOwnProps, MenuPopoverOwnProps, MenuProps, MenuSectionOwnProps, MenuSectionProps, MenuSeparatorOwnProps, MenuSeparatorProps, MenuTriggerProps, NoPagination, OffsetParams, OffsetResponse, Option, OptionSection, PaddingProps, PagePagination, PageSizeOption, PaginationOptions, PasswordFieldOwnProps, PasswordFieldProps, PluginHeaderOwnProps, PluginHeaderProps, PopoverOwnProps, PopoverProps, ProviderBg, QueryOptions, RadioGroupOwnProps, RadioGroupProps, RadioOwnProps, RadioProps, Responsive, RowConfig, RowOwnProps, RowProps, RowRenderFn, SearchAutocompleteItemOwnProps, SearchAutocompleteItemProps, SearchAutocompleteOwnProps, SearchAutocompleteProps, SearchFieldOwnProps, SearchFieldProps, SearchState, SelectOwnProps, SelectProps, SkeletonOwnProps, SkeletonProps, SliderOwnProps, SliderProps, SortDescriptor, SortState, Space, SpaceProps, SubmenuTriggerProps, SwitchOwnProps, SwitchProps, TabListOwnProps, TabListProps, TabMatchStrategy, TabOwnProps, TabPanelOwnProps, TabPanelProps, TabProps, TableBodyOwnProps, TableBodyProps, TableHeaderOwnProps, TableHeaderProps, TableItem, TablePaginationOwnProps, TablePaginationProps, TablePaginationType, TableProps, TableRootOwnProps, TableRootProps, TableSelection, TabsOwnProps, TabsProps, TagGroupOwnProps, TagGroupProps, TagOwnProps, TagProps, TextColorStatus, TextColors, TextFieldOwnProps, TextFieldProps, TextOwnProps, TextProps, TextVariants, TextWeights, ToggleButtonGroupOwnProps, ToggleButtonGroupProps, ToggleButtonOwnProps, ToggleButtonProps, TooltipOwnProps, TooltipProps, UseAnalyticsFn, UseTableCompleteOptions, UseTableCursorOptions, UseTableOffsetOptions, UseTableOptions, UseTableResult, UtilityProps, VirtualizedProp, VisuallyHiddenOwnProps, VisuallyHiddenProps };
4208
+ export { Accordion, AccordionDefinition, AccordionGroup, AccordionGroupDefinition, AccordionPanel, AccordionPanelDefinition, AccordionTrigger, AccordionTriggerDefinition, Alert, AlertDefinition, Avatar, AvatarDefinition, BUIProvider, Badge, BadgeDefinition, BgProvider, Box, BoxDefinition, Button, ButtonDefinition, ButtonIcon, ButtonIconDefinition, ButtonLink, ButtonLinkDefinition, Card, CardBody, CardBodyDefinition, CardDefinition, CardFooter, CardFooterDefinition, CardHeader, CardHeaderDefinition, Cell, CellProfile, CellText, Checkbox, CheckboxDefinition, CheckboxGroup, CheckboxGroupDefinition, Column, Combobox, ComboboxDefinition, ComboboxInputDefinition, ComboboxListBoxDefinition, ComboboxListBoxItemDefinition, ComboboxSectionDefinition, Container, ContainerDefinition, DatePicker, DatePickerCalendarDefinition, DatePickerDefinition, DatePickerGroupDefinition, DateRangePicker, DateRangePickerDefinition, Dialog, DialogBody, DialogBodyDefinition, DialogDefinition, DialogFooter, DialogFooterDefinition, DialogHeader, DialogHeaderDefinition, DialogTrigger, FieldLabel, FieldLabelDefinition, Flex, FlexDefinition, FullPage, FullPageDefinition, Grid, GridDefinition, GridItemDefinition, Header, HeaderDefinition, HeaderMetadataStatus, HeaderMetadataUsers, HeaderNavDefinition, HeaderNavGroupDefinition, HeaderNavItemDefinition, HeaderPage, HeaderPageDefinition, Link, LinkDefinition, List, ListDefinition, ListRow, ListRowDefinition, Menu, MenuAutocomplete, MenuAutocompleteListbox, MenuDefinition, MenuItem, MenuListBox, MenuListBoxItem, MenuSection, MenuSeparator, MenuTrigger, PasswordField, PasswordFieldDefinition, PluginHeader, PluginHeaderDefinition, Popover, PopoverDefinition, Radio, RadioDefinition, RadioGroup, RadioGroupDefinition, Row, SearchAutocomplete, SearchAutocompleteDefinition, SearchAutocompleteItem, SearchField, SearchFieldDefinition, Select, SelectDefinition, Skeleton, SkeletonDefinition, Slider, SliderDefinition, SubmenuTrigger, Switch, SwitchDefinition, Tab, TabList, TabPanel, Table, TableBody, TableBodySkeleton, TableDefinition, TableHeader, TablePagination, TablePaginationDefinition, TableRoot, Tabs, TabsDefinition, Tag, TagGroup, TagGroupDefinition, Text, TextDefinition, TextField, TextFieldDefinition, ToggleButton, ToggleButtonDefinition, ToggleButtonGroup, ToggleButtonGroupDefinition, Tooltip, TooltipDefinition, TooltipTrigger, VisuallyHidden, VisuallyHiddenDefinition, getNodeText, useAnalytics, useBgConsumer, useBgProvider, useBreakpoint, useTable };
4209
+ export type { AccordionGroupOwnProps, AccordionGroupProps, AccordionOwnProps, AccordionPanelOwnProps, AccordionPanelProps, AccordionProps, AccordionTriggerOwnProps, AccordionTriggerProps, AlertOwnProps, AlertProps, AlignItems, AnalyticsEventAttributes, AnalyticsTracker, AvatarOwnProps, AvatarProps, BUIProviderProps, BadgeOwnProps, BadgeProps, BgContextValue, BgProviderProps, Border, BorderRadius, BoxOwnProps, BoxProps, BoxUtilityProps, Breakpoint, ButtonIconOwnProps, ButtonIconProps, ButtonLinkOwnProps, ButtonLinkProps, ButtonOwnProps, ButtonProps, CardBaseProps, CardBodyOwnProps, CardBodyProps, CardButtonVariant, CardFooterOwnProps, CardFooterProps, CardHeaderOwnProps, CardHeaderProps, CardLinkVariant, CardOwnProps, CardProps, CardStaticVariant, CellOwnProps, CellProfileOwnProps, CellProfileProps, CellProps, CellTextOwnProps, CellTextProps, CheckboxGroupOwnProps, CheckboxGroupProps, CheckboxOwnProps, CheckboxProps, ColumnConfig, ColumnOwnProps, ColumnProps, Columns, ComboboxOwnProps, ComboboxProps, CompletePaginationOptions, ContainerBg, ContainerOwnProps, ContainerProps, CursorParams, CursorResponse, DatePickerOwnProps, DatePickerProps, DateRangePickerOwnProps, DateRangePickerProps, DialogBodyOwnProps, DialogBodyProps, DialogFooterOwnProps, DialogFooterProps, DialogHeaderOwnProps, DialogHeaderProps, DialogOwnProps, DialogProps, DialogTriggerProps, Display, FieldLabelOwnProps, FieldLabelProps, FilterState, FlexDirection, FlexItemProps, FlexOwnProps, FlexProps, FlexWrap, FullPageOwnProps, FullPageProps, GridItemOwnProps, GridItemProps, GridOwnProps, GridProps, HeaderBreadcrumb, HeaderMetadataItem, HeaderMetadataStatusProps, HeaderMetadataUser, HeaderNavTab, HeaderNavTabGroup, HeaderNavTabItem, HeaderOwnProps, HeaderPageBreadcrumb, HeaderPageOwnProps, HeaderPageProps, HeaderProps, HeaderTab, HeaderTag, JustifyContent, LinkOwnProps, LinkProps, ListOwnProps, ListProps, ListRowOwnProps, ListRowProps, MarginProps, MenuAutocompleteListBoxOwnProps, MenuAutocompleteListBoxProps, MenuAutocompleteOwnProps, MenuAutocompleteProps, MenuItemOwnProps, MenuItemProps, MenuListBoxItemOwnProps, MenuListBoxItemProps, MenuListBoxOwnProps, MenuListBoxProps, MenuOwnProps, MenuPopoverOwnProps, MenuProps, MenuSectionOwnProps, MenuSectionProps, MenuSeparatorOwnProps, MenuSeparatorProps, MenuTriggerProps, NoPagination, OffsetParams, OffsetResponse, Option, OptionSection, PaddingProps, PagePagination, PageSizeOption, PaginationOptions, PasswordFieldOwnProps, PasswordFieldProps, PluginHeaderOwnProps, PluginHeaderProps, PopoverOwnProps, PopoverProps, ProviderBg, QueryOptions, RadioGroupOwnProps, RadioGroupProps, RadioOwnProps, RadioProps, Responsive, RowConfig, RowOwnProps, RowProps, RowRenderFn, SearchAutocompleteItemOwnProps, SearchAutocompleteItemProps, SearchAutocompleteOwnProps, SearchAutocompleteProps, SearchFieldOwnProps, SearchFieldProps, SearchState, SelectOwnProps, SelectProps, SkeletonOwnProps, SkeletonProps, SliderOwnProps, SliderProps, SortDescriptor, SortState, Space, SpaceProps, SubmenuTriggerProps, SwitchOwnProps, SwitchProps, TabListOwnProps, TabListProps, TabMatchStrategy, TabOwnProps, TabPanelOwnProps, TabPanelProps, TabProps, TableBodyOwnProps, TableBodyProps, TableHeaderOwnProps, TableHeaderProps, TableItem, TablePaginationOwnProps, TablePaginationProps, TablePaginationType, TableProps, TableRootOwnProps, TableRootProps, TableSelection, TabsOwnProps, TabsProps, TagGroupOwnProps, TagGroupProps, TagOwnProps, TagProps, TextColorStatus, TextColors, TextFieldOwnProps, TextFieldProps, TextOwnProps, TextProps, TextVariants, TextWeights, ToggleButtonGroupOwnProps, ToggleButtonGroupProps, ToggleButtonOwnProps, ToggleButtonProps, TooltipOwnProps, TooltipProps, UseAnalyticsFn, UseTableCompleteOptions, UseTableCursorOptions, UseTableOffsetOptions, UseTableOptions, UseTableResult, UtilityProps, VirtualizedProp, VisuallyHiddenOwnProps, VisuallyHiddenProps };
package/dist/index.esm.js CHANGED
@@ -20,6 +20,8 @@ export { Button } from './components/Button/Button.esm.js';
20
20
  export { ButtonDefinition } from './components/Button/definition.esm.js';
21
21
  export { Card, CardBody, CardFooter, CardHeader } from './components/Card/Card.esm.js';
22
22
  export { CardBodyDefinition, CardDefinition, CardFooterDefinition, CardHeaderDefinition } from './components/Card/definition.esm.js';
23
+ export { DatePicker } from './components/DatePicker/DatePicker.esm.js';
24
+ export { DatePickerCalendarDefinition, DatePickerDefinition, DatePickerGroupDefinition } from './components/DatePicker/definition.esm.js';
23
25
  export { DateRangePicker } from './components/DateRangePicker/DateRangePicker.esm.js';
24
26
  export { DateRangePickerDefinition } from './components/DateRangePicker/definition.esm.js';
25
27
  export { Dialog, DialogBody, DialogFooter, DialogHeader, DialogTrigger } from './components/Dialog/Dialog.esm.js';
@@ -1 +1 @@
1
- {"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@backstage/ui",
3
- "version": "0.15.0-next.2",
3
+ "version": "0.15.0-next.3",
4
4
  "backstage": {
5
5
  "role": "web-library"
6
6
  },