@cimpress-ui/react 1.24.0 → 1.25.1
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/dist/commonjs/components/app-header/side-nav.d.ts +1 -9
- package/dist/commonjs/components/app-header/side-nav.d.ts.map +1 -1
- package/dist/commonjs/components/app-header/side-nav.js +3 -3
- package/dist/commonjs/components/app-header/side-nav.js.map +1 -1
- package/dist/commonjs/components/checkbox/checkbox.d.ts.map +1 -1
- package/dist/commonjs/components/checkbox/checkbox.js +1 -1
- package/dist/commonjs/components/checkbox/checkbox.js.map +1 -1
- package/dist/commonjs/components/combo-box/combo-box.d.ts +1 -0
- package/dist/commonjs/components/combo-box/combo-box.d.ts.map +1 -1
- package/dist/commonjs/components/combo-box/combo-box.js +23 -5
- package/dist/commonjs/components/combo-box/combo-box.js.map +1 -1
- package/dist/commonjs/components/internal/checkbox-indicator/checkbox-indicator.js +2 -4
- package/dist/commonjs/components/internal/checkbox-indicator/checkbox-indicator.js.map +1 -1
- package/dist/commonjs/components/internal/collapsible-list/collapsible-list.js.map +1 -1
- package/dist/commonjs/components/menu/menu.d.ts +14 -1
- package/dist/commonjs/components/menu/menu.d.ts.map +1 -1
- package/dist/commonjs/components/menu/menu.js +16 -2
- package/dist/commonjs/components/menu/menu.js.map +1 -1
- package/dist/commonjs/components/popover/popover.d.ts +10 -1
- package/dist/commonjs/components/popover/popover.d.ts.map +1 -1
- package/dist/commonjs/components/popover/popover.js +23 -2
- package/dist/commonjs/components/popover/popover.js.map +1 -1
- package/dist/commonjs/components/select/select.d.ts +1 -1
- package/dist/commonjs/components/select/select.d.ts.map +1 -1
- package/dist/commonjs/components/select/select.js +3 -2
- package/dist/commonjs/components/select/select.js.map +1 -1
- package/dist/commonjs/components/tag-field/tag-field.js +1 -1
- package/dist/commonjs/components/tag-field/tag-field.js.map +1 -1
- package/dist/commonjs/components/toast/toast-queue.d.ts +9 -7
- package/dist/commonjs/components/toast/toast-queue.d.ts.map +1 -1
- package/dist/commonjs/components/toast/toast-queue.js +6 -5
- package/dist/commonjs/components/toast/toast-queue.js.map +1 -1
- package/dist/commonjs/components/toast/toast-region.d.ts +1 -1
- package/dist/commonjs/components/toast/toast-region.d.ts.map +1 -1
- package/dist/commonjs/components/toast/toast-region.js +3 -3
- package/dist/commonjs/components/toast/toast-region.js.map +1 -1
- package/dist/commonjs/components/toast/toast.js +3 -3
- package/dist/commonjs/components/toast/toast.js.map +1 -1
- package/dist/commonjs/components/toast/types.d.ts +1 -1
- package/dist/commonjs/components/toast/types.d.ts.map +1 -1
- package/dist/commonjs/components/toast/types.js.map +1 -1
- package/dist/commonjs/components/typography/list.d.ts +31 -0
- package/dist/commonjs/components/typography/list.d.ts.map +1 -0
- package/dist/commonjs/components/typography/list.js +39 -0
- package/dist/commonjs/components/typography/list.js.map +1 -0
- package/dist/commonjs/index.d.ts +4 -3
- package/dist/commonjs/index.d.ts.map +1 -1
- package/dist/commonjs/index.js +5 -4
- package/dist/commonjs/index.js.map +1 -1
- package/dist/esm/components/app-header/side-nav.d.ts +1 -9
- package/dist/esm/components/app-header/side-nav.d.ts.map +1 -1
- package/dist/esm/components/app-header/side-nav.js +3 -3
- package/dist/esm/components/app-header/side-nav.js.map +1 -1
- package/dist/esm/components/checkbox/checkbox.d.ts.map +1 -1
- package/dist/esm/components/checkbox/checkbox.js +1 -1
- package/dist/esm/components/checkbox/checkbox.js.map +1 -1
- package/dist/esm/components/combo-box/combo-box.d.ts +1 -0
- package/dist/esm/components/combo-box/combo-box.d.ts.map +1 -1
- package/dist/esm/components/combo-box/combo-box.js +24 -6
- package/dist/esm/components/combo-box/combo-box.js.map +1 -1
- package/dist/esm/components/internal/checkbox-indicator/checkbox-indicator.js +2 -4
- package/dist/esm/components/internal/checkbox-indicator/checkbox-indicator.js.map +1 -1
- package/dist/esm/components/internal/collapsible-list/collapsible-list.js.map +1 -1
- package/dist/esm/components/menu/menu.d.ts +14 -1
- package/dist/esm/components/menu/menu.d.ts.map +1 -1
- package/dist/esm/components/menu/menu.js +17 -4
- package/dist/esm/components/menu/menu.js.map +1 -1
- package/dist/esm/components/popover/popover.d.ts +10 -1
- package/dist/esm/components/popover/popover.d.ts.map +1 -1
- package/dist/esm/components/popover/popover.js +25 -4
- package/dist/esm/components/popover/popover.js.map +1 -1
- package/dist/esm/components/select/select.d.ts +1 -1
- package/dist/esm/components/select/select.d.ts.map +1 -1
- package/dist/esm/components/select/select.js +4 -3
- package/dist/esm/components/select/select.js.map +1 -1
- package/dist/esm/components/tag-field/tag-field.js +1 -1
- package/dist/esm/components/tag-field/tag-field.js.map +1 -1
- package/dist/esm/components/toast/toast-queue.d.ts +9 -7
- package/dist/esm/components/toast/toast-queue.d.ts.map +1 -1
- package/dist/esm/components/toast/toast-queue.js +5 -4
- package/dist/esm/components/toast/toast-queue.js.map +1 -1
- package/dist/esm/components/toast/toast-region.d.ts +1 -1
- package/dist/esm/components/toast/toast-region.d.ts.map +1 -1
- package/dist/esm/components/toast/toast-region.js +3 -3
- package/dist/esm/components/toast/toast-region.js.map +1 -1
- package/dist/esm/components/toast/toast.js +2 -2
- package/dist/esm/components/toast/toast.js.map +1 -1
- package/dist/esm/components/toast/types.d.ts +1 -1
- package/dist/esm/components/toast/types.d.ts.map +1 -1
- package/dist/esm/components/toast/types.js.map +1 -1
- package/dist/esm/components/typography/list.d.ts +31 -0
- package/dist/esm/components/typography/list.d.ts.map +1 -0
- package/dist/esm/components/typography/list.js +31 -0
- package/dist/esm/components/typography/list.js.map +1 -0
- package/dist/esm/index.d.ts +4 -3
- package/dist/esm/index.d.ts.map +1 -1
- package/dist/esm/index.js +3 -2
- package/dist/esm/index.js.map +1 -1
- package/dist-styles/core.css +1 -1
- package/dist-styles/styles.css +1 -1
- package/package.json +6 -6
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
import type { CommonProps } from '../types.js';
|
|
3
|
+
import type { BaseTypographyProps, TextStyleOptions } from './types.js';
|
|
4
|
+
export interface OrderedListProps extends BaseTypographyProps, Omit<TextStyleOptions, 'alignment'> {
|
|
5
|
+
/** An integer to start numbering list items from. */
|
|
6
|
+
startFrom?: number;
|
|
7
|
+
}
|
|
8
|
+
/**
|
|
9
|
+
* Renders an ordered list of text items in a specified style.
|
|
10
|
+
*
|
|
11
|
+
* See [list usage guidelines](https://ui.cimpress.io/components/list/).
|
|
12
|
+
*/
|
|
13
|
+
declare const _OrderedList: (props: OrderedListProps & import("react").RefAttributes<HTMLOListElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
|
|
14
|
+
export interface UnorderedListProps extends BaseTypographyProps, Omit<TextStyleOptions, 'alignment'> {
|
|
15
|
+
}
|
|
16
|
+
/**
|
|
17
|
+
* Renders an unordered list of text items in a specified style.
|
|
18
|
+
*
|
|
19
|
+
* See [list usage guidelines](https://ui.cimpress.io/components/list/).
|
|
20
|
+
*/
|
|
21
|
+
declare const _UnorderedList: (props: UnorderedListProps & import("react").RefAttributes<HTMLUListElement> & import("../../with-style-props.js").StyleProps) => import("react").JSX.Element | null;
|
|
22
|
+
export { _OrderedList as OrderedList, _UnorderedList as UnorderedList };
|
|
23
|
+
export interface ListItemProps extends CommonProps {
|
|
24
|
+
children: ReactNode;
|
|
25
|
+
}
|
|
26
|
+
/** Renders a list item within a list. */
|
|
27
|
+
export declare function ListItem({ children, UNSAFE_className, UNSAFE_style, ...props }: ListItemProps): import("react/jsx-runtime").JSX.Element;
|
|
28
|
+
export declare namespace ListItem {
|
|
29
|
+
var displayName: string;
|
|
30
|
+
}
|
|
31
|
+
//# sourceMappingURL=list.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../../src/components/typography/list.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,KAAK,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAGxE,MAAM,WAAW,gBAAiB,SAAQ,mBAAmB,EAAE,IAAI,CAAC,gBAAgB,EAAE,WAAW,CAAC;IAChG,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAiCD;;;;GAIG;AACH,QAAA,MAAM,YAAY,oKAAyD,CAAC;AAE5E,MAAM,WAAW,kBAAmB,SAAQ,mBAAmB,EAAE,IAAI,CAAC,gBAAgB,EAAE,WAAW,CAAC;CAAG;AAsBvG;;;;GAIG;AACH,QAAA,MAAM,cAAc,sKAA6D,CAAC;AAElF,OAAO,EAAE,YAAY,IAAI,WAAW,EAAE,cAAc,IAAI,aAAa,EAAE,CAAC;AAExE,MAAM,WAAW,aAAc,SAAQ,WAAW;IAChD,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,yCAAyC;AACzC,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,2CAM7F;yBANe,QAAQ"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";
|
|
3
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
4
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
5
|
+
};
|
|
6
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
|
+
exports.UnorderedList = exports.OrderedList = void 0;
|
|
8
|
+
exports.ListItem = ListItem;
|
|
9
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
10
|
+
const clsx_1 = __importDefault(require("clsx"));
|
|
11
|
+
const forward_ref_js_1 = require("../../forward-ref.js");
|
|
12
|
+
const with_style_props_js_1 = require("../../with-style-props.js");
|
|
13
|
+
const utils_js_1 = require("./utils.js");
|
|
14
|
+
function OrderedList({ children, startFrom, UNSAFE_className, UNSAFE_style, variant, fontStyle, textDecoration, tone, ...props }, ref) {
|
|
15
|
+
return ((0, jsx_runtime_1.jsx)("ol", { ...props, ref: ref, className: (0, clsx_1.default)('cim-list', (0, utils_js_1.textStyle)({ variant, fontStyle, alignment: 'start', textDecoration, tone }), UNSAFE_className), style: UNSAFE_style, start: startFrom, children: children }));
|
|
16
|
+
}
|
|
17
|
+
/**
|
|
18
|
+
* Renders an ordered list of text items in a specified style.
|
|
19
|
+
*
|
|
20
|
+
* See [list usage guidelines](https://ui.cimpress.io/components/list/).
|
|
21
|
+
*/
|
|
22
|
+
const _OrderedList = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(OrderedList), 'OrderedList');
|
|
23
|
+
exports.OrderedList = _OrderedList;
|
|
24
|
+
function UnorderedList({ children, UNSAFE_className, UNSAFE_style, variant, fontStyle, textDecoration, tone, ...props }, ref) {
|
|
25
|
+
return ((0, jsx_runtime_1.jsx)("ul", { ...props, ref: ref, className: (0, clsx_1.default)('cim-list', (0, utils_js_1.textStyle)({ variant, fontStyle, alignment: 'start', textDecoration, tone }), UNSAFE_className), style: UNSAFE_style, children: children }));
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* Renders an unordered list of text items in a specified style.
|
|
29
|
+
*
|
|
30
|
+
* See [list usage guidelines](https://ui.cimpress.io/components/list/).
|
|
31
|
+
*/
|
|
32
|
+
const _UnorderedList = (0, with_style_props_js_1.withStyleProps)((0, forward_ref_js_1.forwardRef)(UnorderedList), 'UnorderedList');
|
|
33
|
+
exports.UnorderedList = _UnorderedList;
|
|
34
|
+
/** Renders a list item within a list. */
|
|
35
|
+
function ListItem({ children, UNSAFE_className, UNSAFE_style, ...props }) {
|
|
36
|
+
return ((0, jsx_runtime_1.jsx)("li", { ...props, className: (0, clsx_1.default)('cim-list-item', UNSAFE_className), style: UNSAFE_style, children: children }));
|
|
37
|
+
}
|
|
38
|
+
ListItem.displayName = 'ListItem';
|
|
39
|
+
//# sourceMappingURL=list.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"list.js","sourceRoot":"","sources":["../../../../src/components/typography/list.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;;AAyFb,4BAMC;;AA7FD,gDAAwB;AAExB,yDAAkD;AAClD,mEAA2D;AAG3D,yCAAuC;AAOvC,SAAS,WAAW,CAClB,EACE,QAAQ,EACR,SAAS,EACT,gBAAgB,EAChB,YAAY,EACZ,OAAO,EACP,SAAS,EACT,cAAc,EACd,IAAI,EACJ,GAAG,KAAK,EACS,EACnB,GAAmC;IAEnC,OAAO,CACL,kCACM,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAI,EACb,UAAU,EACV,IAAA,oBAAS,EAAC,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC,EAC3E,gBAAgB,CACjB,EACD,KAAK,EAAE,YAAY,EACnB,KAAK,EAAE,SAAS,YAEf,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,YAAY,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,WAAW,CAAC,EAAE,aAAa,CAAC,CAAC;AA+BnD,mCAAW;AA3BpC,SAAS,aAAa,CACpB,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,IAAI,EAAE,GAAG,KAAK,EAAsB,EACpH,GAAmC;IAEnC,OAAO,CACL,kCACM,KAAK,EACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAA,cAAI,EACb,UAAU,EACV,IAAA,oBAAS,EAAC,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC,EAC3E,gBAAgB,CACjB,EACD,KAAK,EAAE,YAAY,YAElB,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,cAAc,GAAG,IAAA,oCAAc,EAAC,IAAA,2BAAU,EAAC,aAAa,CAAC,EAAE,eAAe,CAAC,CAAC;AAE1B,uCAAa;AAMrE,yCAAyC;AACzC,SAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAiB;IAC5F,OAAO,CACL,kCAAQ,KAAK,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,eAAe,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,YACnF,QAAQ,GACN,CACN,CAAC;AACJ,CAAC;AAED,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ForwardedRef, ReactNode } from 'react';\nimport { forwardRef } from '../../forward-ref.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport type { CommonProps } from '../types.js';\nimport type { BaseTypographyProps, TextStyleOptions } from './types.js';\nimport { textStyle } from './utils.js';\n\nexport interface OrderedListProps extends BaseTypographyProps, Omit<TextStyleOptions, 'alignment'> {\n /** An integer to start numbering list items from. */\n startFrom?: number;\n}\n\nfunction OrderedList(\n {\n children,\n startFrom,\n UNSAFE_className,\n UNSAFE_style,\n variant,\n fontStyle,\n textDecoration,\n tone,\n ...props\n }: OrderedListProps,\n ref: ForwardedRef<HTMLOListElement>,\n) {\n return (\n <ol\n {...props}\n ref={ref}\n className={clsx(\n 'cim-list',\n textStyle({ variant, fontStyle, alignment: 'start', textDecoration, tone }),\n UNSAFE_className,\n )}\n style={UNSAFE_style}\n start={startFrom}\n >\n {children}\n </ol>\n );\n}\n\n/**\n * Renders an ordered list of text items in a specified style.\n *\n * See [list usage guidelines](https://ui.cimpress.io/components/list/).\n */\nconst _OrderedList = withStyleProps(forwardRef(OrderedList), 'OrderedList');\n\nexport interface UnorderedListProps extends BaseTypographyProps, Omit<TextStyleOptions, 'alignment'> {}\n\nfunction UnorderedList(\n { children, UNSAFE_className, UNSAFE_style, variant, fontStyle, textDecoration, tone, ...props }: UnorderedListProps,\n ref: ForwardedRef<HTMLUListElement>,\n) {\n return (\n <ul\n {...props}\n ref={ref}\n className={clsx(\n 'cim-list',\n textStyle({ variant, fontStyle, alignment: 'start', textDecoration, tone }),\n UNSAFE_className,\n )}\n style={UNSAFE_style}\n >\n {children}\n </ul>\n );\n}\n\n/**\n * Renders an unordered list of text items in a specified style.\n *\n * See [list usage guidelines](https://ui.cimpress.io/components/list/).\n */\nconst _UnorderedList = withStyleProps(forwardRef(UnorderedList), 'UnorderedList');\n\nexport { _OrderedList as OrderedList, _UnorderedList as UnorderedList };\n\nexport interface ListItemProps extends CommonProps {\n children: ReactNode;\n}\n\n/** Renders a list item within a list. */\nexport function ListItem({ children, UNSAFE_className, UNSAFE_style, ...props }: ListItemProps) {\n return (\n <li {...props} className={clsx('cim-list-item', UNSAFE_className)} style={UNSAFE_style}>\n {children}\n </li>\n );\n}\n\nListItem.displayName = 'ListItem';\n"]}
|
package/dist/commonjs/index.d.ts
CHANGED
|
@@ -59,6 +59,9 @@ export * from './components/tabs/tabs.js';
|
|
|
59
59
|
export * from './components/tag/tag.js';
|
|
60
60
|
export * from './components/tag/tag-group.js';
|
|
61
61
|
export * from './components/tag-field/tag-field.js';
|
|
62
|
+
export * from './components/toast/toast-region.js';
|
|
63
|
+
export { toastQueue, type ToastQueue } from './components/toast/toast-queue.js';
|
|
64
|
+
export type { ToastOptions } from './components/toast/types.js';
|
|
62
65
|
export * from './components/toggle-button/toggle-button.js';
|
|
63
66
|
export * from './components/toggle-button/toggle-icon-button.js';
|
|
64
67
|
export * from './components/toggle-button/toggle-button-group.js';
|
|
@@ -67,6 +70,7 @@ export * from './components/spacing/box/box.js';
|
|
|
67
70
|
export * from './components/spacing/stack/stack.js';
|
|
68
71
|
export * from './components/typography/text.js';
|
|
69
72
|
export * from './components/typography/link.js';
|
|
73
|
+
export * from './components/typography/list.js';
|
|
70
74
|
export type { ForegroundTone } from './utils/style/types.js';
|
|
71
75
|
export type { CollectionItem, Direction, FieldError, HoverEvent, Key, Selection, PressEvent, RouterConfig, Href, RouterOptions, ValidationResult, } from './components/types.js';
|
|
72
76
|
export type { Spacing, Responsive } from './components/spacing/types.js';
|
|
@@ -78,9 +82,6 @@ export * from './utils/use-is-mobile.js';
|
|
|
78
82
|
export * from './components/visually-hidden/visually-hidden.js';
|
|
79
83
|
export * from './components/file-picker/file-picker.js';
|
|
80
84
|
export * from './components/container/container.js';
|
|
81
|
-
export * from './components/toast/toast-region.js';
|
|
82
|
-
export { UNSTABLE_toastQueue, type UNSTABLE_ToastQueue } from './components/toast/toast-queue.js';
|
|
83
|
-
export type { UNSTABLE_ToastOptions } from './components/toast/types.js';
|
|
84
85
|
export * from './components/stepper/stepper.js';
|
|
85
86
|
export * from './components/stepper/stepper-item.js';
|
|
86
87
|
export type { StepperStatus } from './components/stepper/types.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}
|
package/dist/commonjs/index.js
CHANGED
|
@@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
14
14
|
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
15
|
};
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
exports.
|
|
17
|
+
exports.toastQueue = void 0;
|
|
18
18
|
__exportStar(require("./components/alert/alert.js"), exports);
|
|
19
19
|
__exportStar(require("./components/alert-dialog/alert-dialog.js"), exports);
|
|
20
20
|
__exportStar(require("./components/app-header/app-header.js"), exports);
|
|
@@ -73,6 +73,9 @@ __exportStar(require("./components/tabs/tabs.js"), exports);
|
|
|
73
73
|
__exportStar(require("./components/tag/tag.js"), exports);
|
|
74
74
|
__exportStar(require("./components/tag/tag-group.js"), exports);
|
|
75
75
|
__exportStar(require("./components/tag-field/tag-field.js"), exports);
|
|
76
|
+
__exportStar(require("./components/toast/toast-region.js"), exports);
|
|
77
|
+
var toast_queue_js_1 = require("./components/toast/toast-queue.js");
|
|
78
|
+
Object.defineProperty(exports, "toastQueue", { enumerable: true, get: function () { return toast_queue_js_1.toastQueue; } });
|
|
76
79
|
__exportStar(require("./components/toggle-button/toggle-button.js"), exports);
|
|
77
80
|
__exportStar(require("./components/toggle-button/toggle-icon-button.js"), exports);
|
|
78
81
|
__exportStar(require("./components/toggle-button/toggle-button-group.js"), exports);
|
|
@@ -81,6 +84,7 @@ __exportStar(require("./components/spacing/box/box.js"), exports);
|
|
|
81
84
|
__exportStar(require("./components/spacing/stack/stack.js"), exports);
|
|
82
85
|
__exportStar(require("./components/typography/text.js"), exports);
|
|
83
86
|
__exportStar(require("./components/typography/link.js"), exports);
|
|
87
|
+
__exportStar(require("./components/typography/list.js"), exports);
|
|
84
88
|
__exportStar(require("./providers/ssr/ssr-provider.js"), exports);
|
|
85
89
|
__exportStar(require("./providers/router/router-provider.js"), exports);
|
|
86
90
|
__exportStar(require("./components/internal/x-button/x-button.js"), exports);
|
|
@@ -89,9 +93,6 @@ __exportStar(require("./utils/use-is-mobile.js"), exports);
|
|
|
89
93
|
__exportStar(require("./components/visually-hidden/visually-hidden.js"), exports);
|
|
90
94
|
__exportStar(require("./components/file-picker/file-picker.js"), exports);
|
|
91
95
|
__exportStar(require("./components/container/container.js"), exports);
|
|
92
|
-
__exportStar(require("./components/toast/toast-region.js"), exports);
|
|
93
|
-
var toast_queue_js_1 = require("./components/toast/toast-queue.js");
|
|
94
|
-
Object.defineProperty(exports, "UNSTABLE_toastQueue", { enumerable: true, get: function () { return toast_queue_js_1.UNSTABLE_toastQueue; } });
|
|
95
96
|
__exportStar(require("./components/stepper/stepper.js"), exports);
|
|
96
97
|
__exportStar(require("./components/stepper/stepper-item.js"), exports);
|
|
97
98
|
__exportStar(require("./components/app-shell/app-shell.js"), exports);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,8DAA4C;AAC5C,4EAA0D;AAC1D,wEAAsD;AACtD,8EAA4D;AAC5D,8DAA4C;AAC5C,gEAA8C;AAC9C,qEAAmD;AACnD,qEAAmD;AACnD,0EAAwD;AACxD,kEAAgD;AAChD,4DAA0C;AAC1C,oEAAkD;AAClD,0EAAwD;AACxD,sEAAoD;AACpD,4DAA0C;AAC1C,wEAAsD;AACtD,mEAAiD;AACjD,mEAAiD;AACjD,0EAAwD;AACxD,0EAAwD;AACxD,wEAAsD;AACtD,8EAA4D;AAE5D,kEAAgD;AAChD,gEAA8C;AAC9C,4DAA0C;AAC1C,sEAAoD;AACpD,4DAA0C;AAC1C,4EAA0D;AAC1D,4EAA0D;AAC1D,wEAAsD;AACtD,4EAA0D;AAC1D,8DAA4C;AAC5C,oEAAkD;AAClD,gEAA8C;AAC9C,gEAA8C;AAC9C,kEAAgD;AAChD,2EAAyD;AACzD,yEAAuD;AACvD,wEAAsD;AACtD,0EAAwD;AACxD,kEAAgD;AAChD,kEAAgD;AAChD,gEAA8C;AAC9C,wEAAsD;AACtD,8DAA4C;AAC5C,qEAAmD;AACnD,yEAAuD;AACvD,0EAAwD;AACxD,mEAAiD;AACjD,uEAAqD;AACrD,wEAAsD;AACtD,2EAAyD;AACzD,gFAA8D;AAC9D,0EAAwD;AAGxD,4DAA0C;AAC1C,0DAAwC;AACxC,gEAA8C;AAC9C,sEAAoD;AACpD,8EAA4D;AAC5D,mFAAiE;AACjE,oFAAkE;AAClE,+DAA6C;AAE7C,kEAAgD;AAChD,sEAAoD;AAEpD,kEAAgD;AAChD,kEAAgD;AAoBhD,kEAAgD;AAChD,wEAAsD;AAEtD,6EAA2D;AAE3D,2DAAyC;AAEzC,2BAA2B;AAC3B,kFAAgE;AAChE,0EAAwD;AACxD,sEAAoD;AACpD,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,8DAA4C;AAC5C,4EAA0D;AAC1D,wEAAsD;AACtD,8EAA4D;AAC5D,8DAA4C;AAC5C,gEAA8C;AAC9C,qEAAmD;AACnD,qEAAmD;AACnD,0EAAwD;AACxD,kEAAgD;AAChD,4DAA0C;AAC1C,oEAAkD;AAClD,0EAAwD;AACxD,sEAAoD;AACpD,4DAA0C;AAC1C,wEAAsD;AACtD,mEAAiD;AACjD,mEAAiD;AACjD,0EAAwD;AACxD,0EAAwD;AACxD,wEAAsD;AACtD,8EAA4D;AAE5D,kEAAgD;AAChD,gEAA8C;AAC9C,4DAA0C;AAC1C,sEAAoD;AACpD,4DAA0C;AAC1C,4EAA0D;AAC1D,4EAA0D;AAC1D,wEAAsD;AACtD,4EAA0D;AAC1D,8DAA4C;AAC5C,oEAAkD;AAClD,gEAA8C;AAC9C,gEAA8C;AAC9C,kEAAgD;AAChD,2EAAyD;AACzD,yEAAuD;AACvD,wEAAsD;AACtD,0EAAwD;AACxD,kEAAgD;AAChD,kEAAgD;AAChD,gEAA8C;AAC9C,wEAAsD;AACtD,8DAA4C;AAC5C,qEAAmD;AACnD,yEAAuD;AACvD,0EAAwD;AACxD,mEAAiD;AACjD,uEAAqD;AACrD,wEAAsD;AACtD,2EAAyD;AACzD,gFAA8D;AAC9D,0EAAwD;AAGxD,4DAA0C;AAC1C,0DAAwC;AACxC,gEAA8C;AAC9C,sEAAoD;AACpD,qEAAmD;AACnD,oEAAgF;AAAvE,4GAAA,UAAU,OAAA;AAEnB,8EAA4D;AAC5D,mFAAiE;AACjE,oFAAkE;AAClE,+DAA6C;AAE7C,kEAAgD;AAChD,sEAAoD;AAEpD,kEAAgD;AAChD,kEAAgD;AAChD,kEAAgD;AAoBhD,kEAAgD;AAChD,wEAAsD;AAEtD,6EAA2D;AAE3D,2DAAyC;AAEzC,2BAA2B;AAC3B,kFAAgE;AAChE,0EAAwD;AACxD,sEAAoD;AACpD,kEAAgD;AAChD,uEAAqD;AAErD,sEAAoD;AACpD,sEAAoD;AACpD,gEAA8C;AAC9C,wEAAsD;AACtD,kEAAgD;AAChD,0EAAwD;AACxD,oEAAkD","sourcesContent":["export * from './components/alert/alert.js';\nexport * from './components/alert-dialog/alert-dialog.js';\nexport * from './components/app-header/app-header.js';\nexport * from './components/app-header/simple-auth-tool.js';\nexport * from './components/badge/badge.js';\nexport * from './components/button/button.js';\nexport * from './components/button/link-button.js';\nexport * from './components/button/icon-button.js';\nexport * from './components/button/icon-link-button.js';\nexport * from './components/callout/callout.js';\nexport * from './components/card/card.js';\nexport * from './components/checkbox/checkbox.js';\nexport * from './components/checkbox/checkbox-group.js';\nexport * from './components/combo-box/combo-box.js';\nexport * from './components/code/code.js';\nexport * from './components/code-block/code-block.js';\nexport * from './components/copy/copy-button.js';\nexport * from './components/copy/copy-inline.js';\nexport * from './components/date-picker/date-picker.js';\nexport * from './components/dialog-root/dialog-root.js';\nexport * from './components/disclosure/disclosure.js';\nexport * from './components/disclosure/disclosure-group.js';\nexport type { DisclosureSize, DisclosureVariant } from './components/disclosure/context.js';\nexport * from './components/divider/divider.js';\nexport * from './components/drawer/drawer.js';\nexport * from './components/form/form.js';\nexport * from './components/link-tabs/link-tabs.js';\nexport * from './components/menu/menu.js';\nexport * from './components/modal-dialog/modal-dialog.js';\nexport * from './components/number-field/number-field.js';\nexport * from './components/pagination/pagination.js';\nexport * from './components/progress-bar/progress-bar.js';\nexport * from './components/radio/radio.js';\nexport * from './components/radio/radio-group.js';\nexport * from './components/select/select.js';\nexport * from './components/slider/slider.js';\nexport * from './components/spinner/spinner.js';\nexport * from './components/text-inputs/search-field.js';\nexport * from './components/text-inputs/text-field.js';\nexport * from './components/text-inputs/text-area.js';\nexport * from './components/breadcrumbs/breadcrumbs.js';\nexport * from './components/tooltip/tooltip.js';\nexport * from './components/popover/popover.js';\nexport * from './components/switch/switch.js';\nexport * from './components/table/table-container.js';\nexport * from './components/table/table.js';\nexport * from './components/table/table-header.js';\nexport * from './components/table/table-header-row.js';\nexport * from './components/table/table-header-cell.js';\nexport * from './components/table/table-body.js';\nexport * from './components/table/table-body-row.js';\nexport * from './components/table/table-body-cell.js';\nexport * from './components/table/table-row-selector.js';\nexport * from './components/table/table-all-rows-selector.js';\nexport * from './components/table/table-empty-state.js';\nexport type { RowSelectionMode as TableRowSelectionMode } from './components/table/contexts/table-state.js';\nexport type { ColumnContentAlignment as TableColumnContentAlignment } from './components/table/contexts/column-collection.js';\nexport * from './components/tabs/tabs.js';\nexport * from './components/tag/tag.js';\nexport * from './components/tag/tag-group.js';\nexport * from './components/tag-field/tag-field.js';\nexport * from './components/toast/toast-region.js';\nexport { toastQueue, type ToastQueue } from './components/toast/toast-queue.js';\nexport type { ToastOptions } from './components/toast/types.js';\nexport * from './components/toggle-button/toggle-button.js';\nexport * from './components/toggle-button/toggle-icon-button.js';\nexport * from './components/toggle-button/toggle-button-group.js';\nexport * from './components/file-trigger.js';\n\nexport * from './components/spacing/box/box.js';\nexport * from './components/spacing/stack/stack.js';\n\nexport * from './components/typography/text.js';\nexport * from './components/typography/link.js';\nexport * from './components/typography/list.js';\n\nexport type { ForegroundTone } from './utils/style/types.js';\n\nexport type {\n CollectionItem,\n Direction,\n FieldError,\n HoverEvent,\n Key,\n Selection,\n PressEvent,\n RouterConfig,\n Href,\n RouterOptions,\n ValidationResult,\n} from './components/types.js';\nexport type { Spacing, Responsive } from './components/spacing/types.js';\nexport type { StyleProps } from './with-style-props.js';\n\nexport * from './providers/ssr/ssr-provider.js';\nexport * from './providers/router/router-provider.js';\n\nexport * from './components/internal/x-button/x-button.js';\n\nexport * from './utils/use-is-mobile.js';\n\n// Unfinished exports below\nexport * from './components/visually-hidden/visually-hidden.js';\nexport * from './components/file-picker/file-picker.js';\nexport * from './components/container/container.js';\nexport * from './components/stepper/stepper.js';\nexport * from './components/stepper/stepper-item.js';\nexport type { StepperStatus } from './components/stepper/types.js';\nexport * from './components/app-shell/app-shell.js';\nexport * from './components/app-header/side-nav.js';\nexport * from './components/hidden/hidden.js';\nexport * from './components/app-header/nav-button.js';\nexport * from './components/top-nav/top-nav.js';\nexport * from './components/page-layout/page-layout.js';\nexport * from './components/nav-list/nav-list.js';\n"]}
|
|
@@ -4,16 +4,8 @@ export interface UNSTABLE_SideNavProps {
|
|
|
4
4
|
children: ReactNode;
|
|
5
5
|
isOpen?: boolean;
|
|
6
6
|
onOpenChange?: (isOpen: boolean) => void;
|
|
7
|
-
/**
|
|
8
|
-
* Determines how the side nav is displayed and behaves.
|
|
9
|
-
* - `overlay`: The side nav slides in as an overlay on top of the main content. This is used when all available screen space is needed for the main content.
|
|
10
|
-
* - `fixed`: The side nav is fixed to the side and includes an expand button to toggle between a compact icon-only view and an expanded view showing labels. On smaller screens, it slides in as an overlay.
|
|
11
|
-
*
|
|
12
|
-
* @default 'fixed'
|
|
13
|
-
*/
|
|
14
|
-
variant?: 'overlay' | 'fixed';
|
|
15
7
|
}
|
|
16
|
-
export declare function UNSTABLE_SideNav({ children, isOpen, onOpenChange
|
|
8
|
+
export declare function UNSTABLE_SideNav({ children, isOpen, onOpenChange }: UNSTABLE_SideNavProps): import("react/jsx-runtime").JSX.Element;
|
|
17
9
|
export interface UNSTABLE_SideNavListProps {
|
|
18
10
|
children: ReactNode;
|
|
19
11
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"side-nav.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/side-nav.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASlE,OAAO,KAAK,EAAE,IAAI,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAK5D,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"side-nav.d.ts","sourceRoot":"","sources":["../../../../src/components/app-header/side-nav.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASlE,OAAO,KAAK,EAAE,IAAI,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAK5D,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C;AAED,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,YAAY,EAAE,EAAE,qBAAqB,2CA2BzF;AAED,MAAM,WAAW,yBAAyB;IACxC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,EAAE,yBAAyB,2CAE3E;AAED,MAAM,WAAW,6BAA6B;IAC5C,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,IAAI,EAAE,IAAI,CAAC;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,wBAAgB,wBAAwB,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,6BAA6B,2CAazG;AAED,MAAM,WAAW,gCAAgC;IAC/C,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,2BAA2B,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,gCAAgC,2CAehG"}
|
|
@@ -11,10 +11,10 @@ import { UNSTABLE_Hidden } from '../hidden/hidden.js';
|
|
|
11
11
|
import { Tooltip } from '../tooltip/tooltip.js';
|
|
12
12
|
import { Text } from '../typography/text.js';
|
|
13
13
|
const SideNavContext = createContext({ isOpen: false });
|
|
14
|
-
export function UNSTABLE_SideNav({ children, isOpen, onOpenChange
|
|
14
|
+
export function UNSTABLE_SideNav({ children, isOpen, onOpenChange }) {
|
|
15
15
|
const isMobile = useIsMobile();
|
|
16
|
-
const drawer =
|
|
17
|
-
return (_jsxs(SideNavContext.Provider, { value: { isOpen: isOpen ?? false }, children: [drawer,
|
|
16
|
+
const drawer = isMobile && (_jsx(Drawer, { UNSTABLE_placement: "start", isOpen: isOpen, onOpenChange: onOpenChange, "aria-label": "Side navigation", children: _jsx(DrawerBody, { children: children }) }));
|
|
17
|
+
return (_jsxs(SideNavContext.Provider, { value: { isOpen: isOpen ?? false }, children: [drawer, _jsx(UNSTABLE_Hidden, { hide: { sm: true, md: false }, children: _jsxs("div", { className: "cim-side-nav", "data-expanded": isOpen, children: [_jsx("div", { className: "cim-side-nav-header", children: _jsx(IconButton, { variant: "tertiary", icon: isOpen ? _jsx(IconPushLeft, {}) : _jsx(IconPushRight, {}), "aria-label": "Expand sidebar", onPress: () => onOpenChange?.(!isOpen) }) }), _jsx("div", { className: "cim-side-nav-list-container", children: children })] }) })] }));
|
|
18
18
|
}
|
|
19
19
|
export function UNSTABLE_SideNavList({ children }) {
|
|
20
20
|
return _jsx("div", { className: "cim-side-nav-list", children: children });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"side-nav.js","sourceRoot":"","sources":["../../../../src/components/app-header/side-nav.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,aAAa,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACnE,OAAO,EAAE,0BAA0B,EAAE,MAAM,+CAA+C,CAAC;AAC3F,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAE7C,MAAM,cAAc,GAAG,aAAa,CAAsB,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"side-nav.js","sourceRoot":"","sources":["../../../../src/components/app-header/side-nav.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { createContext, useContext, type ReactNode } from 'react';\nimport { Link as RACLink } from 'react-aria-components';\nimport { IconPushLeft, IconPushRight } from '../../icons/index.js';\nimport { stringLikeChildrenToString } from '../../utils/string-like-children-to-string.js';\nimport { useIsMobile } from '../../utils/use-is-mobile.js';\nimport { IconButton } from '../button/icon-button.js';\nimport { Drawer, DrawerBody } from '../drawer/drawer.js';\nimport { UNSTABLE_Hidden } from '../hidden/hidden.js';\nimport { Tooltip } from '../tooltip/tooltip.js';\nimport type { Href, StringLikeChildren } from '../types.js';\nimport { Text } from '../typography/text.js';\n\nconst SideNavContext = createContext<{ isOpen: boolean }>({ isOpen: false });\n\nexport interface UNSTABLE_SideNavProps {\n children: ReactNode;\n isOpen?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport function UNSTABLE_SideNav({ children, isOpen, onOpenChange }: UNSTABLE_SideNavProps) {\n const isMobile = useIsMobile();\n\n const drawer = isMobile && (\n <Drawer UNSTABLE_placement=\"start\" isOpen={isOpen} onOpenChange={onOpenChange} aria-label=\"Side navigation\">\n <DrawerBody>{children}</DrawerBody>\n </Drawer>\n );\n\n return (\n <SideNavContext.Provider value={{ isOpen: isOpen ?? false }}>\n {drawer}\n <UNSTABLE_Hidden hide={{ sm: true, md: false }}>\n <div className=\"cim-side-nav\" data-expanded={isOpen}>\n <div className=\"cim-side-nav-header\">\n <IconButton\n variant=\"tertiary\"\n icon={isOpen ? <IconPushLeft /> : <IconPushRight />}\n aria-label=\"Expand sidebar\"\n onPress={() => onOpenChange?.(!isOpen)}\n />\n </div>\n <div className=\"cim-side-nav-list-container\">{children}</div>\n </div>\n </UNSTABLE_Hidden>\n </SideNavContext.Provider>\n );\n}\n\nexport interface UNSTABLE_SideNavListProps {\n children: ReactNode;\n}\n\nexport function UNSTABLE_SideNavList({ children }: UNSTABLE_SideNavListProps) {\n return <div className=\"cim-side-nav-list\">{children}</div>;\n}\n\nexport interface UNSTABLE_SideNavListItemProps {\n children: StringLikeChildren;\n href: Href;\n isActive?: boolean;\n icon?: ReactNode;\n}\n\nexport function UNSTABLE_SideNavListItem({ children, href, isActive, icon }: UNSTABLE_SideNavListItemProps) {\n const { isOpen } = useContext(SideNavContext);\n\n return (\n <Tooltip label={stringLikeChildrenToString(children)} placement=\"right\" isDisabled={isOpen}>\n <RACLink href={href} className=\"cim-side-nav-list-item\" data-active={isActive} data-expanded={isOpen}>\n {icon}\n <Text as=\"span\" variant=\"medium\" UNSAFE_className=\"cim-side-nav-list-item-label\">\n {children}\n </Text>\n </RACLink>\n </Tooltip>\n );\n}\n\nexport interface UNSTABLE_SideNavListSectionProps {\n children: ReactNode;\n label?: string;\n}\n\nexport function UNSTABLE_SideNavListSection({ children, label }: UNSTABLE_SideNavListSectionProps) {\n const { isOpen } = useContext(SideNavContext);\n\n return (\n <div className=\"cim-side-nav-list-section\" data-expanded={isOpen}>\n {label && (\n <div className=\"cim-side-nav-list-section-header\">\n <Text as=\"p\" variant=\"small-semibold\" tone=\"subtle\" UNSAFE_className=\"cim-side-nav-list-section-header-label\">\n {label}\n </Text>\n </div>\n )}\n {children}\n </div>\n );\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAIA,OAAO,EAA2B,KAAK,aAAa,IAAI,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAKxG,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAGtF,MAAM,WAAW,aACf,SACE,WAAW,EACX,iBAAiB,EACjB,IAAI,CACF,gBAAgB,EACd,UAAU,GACV,YAAY,GACZ,iBAAiB,GACjB,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,MAAM,GACN,MAAM,GACN,OAAO,GACP,iBAAiB,GACjB,WAAW,CACd;IACH,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,kBAAkB,CAAC;CAC/B;
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAIA,OAAO,EAA2B,KAAK,aAAa,IAAI,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAKxG,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAGtF,MAAM,WAAW,aACf,SACE,WAAW,EACX,iBAAiB,EACjB,IAAI,CACF,gBAAgB,EACd,UAAU,GACV,YAAY,GACZ,iBAAiB,GACjB,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,MAAM,GACN,MAAM,GACN,OAAO,GACP,iBAAiB,GACjB,WAAW,CACd;IACH,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,kBAAkB,CAAC;CAC/B;AAuCD;;;;GAIG;AACH,QAAA,MAAM,SAAS,iKAAmD,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC"}
|
|
@@ -14,7 +14,7 @@ function Checkbox({ children, UNSAFE_className, UNSAFE_style, ...props }, ref) {
|
|
|
14
14
|
console.warn('Checkbox requires one of children / aria-label / aria-labelledby for accessibility');
|
|
15
15
|
}
|
|
16
16
|
}, [children, ariaLabel, ariaLabelledBy]);
|
|
17
|
-
return (_jsx(RACCheckbox, { ...props, ref: ref, className: clsx('cim-checkbox',
|
|
17
|
+
return (_jsx(RACCheckbox, { ...props, ref: ref, className: clsx('cim-checkbox', UNSAFE_className), style: UNSAFE_style, children: ({ isIndeterminate, isSelected, isDisabled, isReadOnly, isInvalid, isHovered, isPressed, isFocusVisible }) => (_jsxs(_Fragment, { children: [_jsx(CheckboxIndicator, { isIndeterminate: isIndeterminate, isSelected: isSelected, isDisabled: isDisabled, isReadOnly: isReadOnly, isInvalid: isInvalid, isHovered: isHovered, isPressed: isPressed, isFocusVisible: isFocusVisible }), children && (_jsx(Text, { as: "span", variant: "medium", children: children }))] })) }));
|
|
18
18
|
}
|
|
19
19
|
/**
|
|
20
20
|
* Allows users to mark an item as selected. Can be used standalone, or as part of `CheckboxGroup`.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,QAAQ,IAAI,WAAW,EAA0C,MAAM,uBAAuB,CAAC;AACxG,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sDAAsD,CAAC;AAEzF,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAyB7C,SAAS,QAAQ,CACf,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAiB,EACrE,GAAmC;IAEnC,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,oBAAoB,CAAC,GAAG,EAAE;QACxB,IAAI,CAAC,QAAQ,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC/C,OAAO,CAAC,IAAI,CAAC,oFAAoF,CAAC,CAAC;QACrG,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAE1C,OAAO,CACL,KAAC,WAAW,
|
|
1
|
+
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,QAAQ,IAAI,WAAW,EAA0C,MAAM,uBAAuB,CAAC;AACxG,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,sDAAsD,CAAC;AAEzF,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAyB7C,SAAS,QAAQ,CACf,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,GAAG,KAAK,EAAiB,EACrE,GAAmC;IAEnC,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,oBAAoB,CAAC,GAAG,EAAE;QACxB,IAAI,CAAC,QAAQ,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC/C,OAAO,CAAC,IAAI,CAAC,oFAAoF,CAAC,CAAC;QACrG,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAE1C,OAAO,CACL,KAAC,WAAW,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,YACrG,CAAC,EAAE,eAAe,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE,EAAE,CAAC,CAC7G,8BACE,KAAC,iBAAiB,IAChB,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,GAC9B,EACD,QAAQ,IAAI,CACX,KAAC,IAAI,IAAC,EAAE,EAAC,MAAM,EAAC,OAAO,EAAC,QAAQ,YAC7B,QAAQ,GACJ,CACR,IACA,CACJ,GACW,CACf,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,SAAS,GAAG,cAAc,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport type { ForwardedRef } from 'react';\nimport { Checkbox as RACCheckbox, type CheckboxProps as RACCheckboxProps } from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { CheckboxIndicator } from '../internal/checkbox-indicator/checkbox-indicator.js';\nimport type { AriaLabelingProps, CommonProps, StringLikeChildren } from '../types.js';\nimport { Text } from '../typography/text.js';\n\nexport interface CheckboxProps\n extends\n CommonProps,\n AriaLabelingProps,\n Pick<\n RACCheckboxProps,\n | 'onChange'\n | 'isSelected'\n | 'isIndeterminate'\n | 'isDisabled'\n | 'isReadOnly'\n | 'isRequired'\n | 'isInvalid'\n | 'form'\n | 'name'\n | 'value'\n | 'defaultSelected'\n | 'autoFocus'\n > {\n /** The label rendered next to the checkbox. */\n children?: StringLikeChildren;\n}\n\nfunction Checkbox(\n { children, UNSAFE_className, UNSAFE_style, ...props }: CheckboxProps,\n ref: ForwardedRef<HTMLLabelElement>,\n) {\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!children && !ariaLabel && !ariaLabelledBy) {\n console.warn('Checkbox requires one of children / aria-label / aria-labelledby for accessibility');\n }\n }, [children, ariaLabel, ariaLabelledBy]);\n\n return (\n <RACCheckbox {...props} ref={ref} className={clsx('cim-checkbox', UNSAFE_className)} style={UNSAFE_style}>\n {({ isIndeterminate, isSelected, isDisabled, isReadOnly, isInvalid, isHovered, isPressed, isFocusVisible }) => (\n <>\n <CheckboxIndicator\n isIndeterminate={isIndeterminate}\n isSelected={isSelected}\n isDisabled={isDisabled}\n isReadOnly={isReadOnly}\n isInvalid={isInvalid}\n isHovered={isHovered}\n isPressed={isPressed}\n isFocusVisible={isFocusVisible}\n />\n {children && (\n <Text as=\"span\" variant=\"medium\">\n {children}\n </Text>\n )}\n </>\n )}\n </RACCheckbox>\n );\n}\n\n/**\n * Allows users to mark an item as selected. Can be used standalone, or as part of `CheckboxGroup`.\n *\n * See [checkbox usage guidelines](https://ui.cimpress.io/components/checkbox/).\n */\nconst _Checkbox = withStyleProps(forwardRef(Checkbox), 'Checkbox');\n\nexport { _Checkbox as Checkbox };\n"]}
|
|
@@ -22,6 +22,7 @@ export interface ComboBoxProps<T extends CollectionItem = CollectionItem> extend
|
|
|
22
22
|
isVirtualized?: boolean;
|
|
23
23
|
/** Handler that is called when the list of items is scrolled. */
|
|
24
24
|
onScroll?: UIEventHandler<HTMLDivElement>;
|
|
25
|
+
UNSTABLE_isClearable?: boolean;
|
|
25
26
|
}
|
|
26
27
|
/** The imperative API exposed by the `ComboBox` component. */
|
|
27
28
|
export interface ComboBoxApi {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combo-box.d.ts","sourceRoot":"","sources":["../../../../src/components/combo-box/combo-box.tsx"],"names":[],"mappings":"AAGA,OAAO,EAGL,KAAK,cAAc,EAIpB,MAAM,OAAO,CAAC;AAEf,OAAO,EAeL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,gBAAgB,IAAI,mBAAmB,EAE7C,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"combo-box.d.ts","sourceRoot":"","sources":["../../../../src/components/combo-box/combo-box.tsx"],"names":[],"mappings":"AAGA,OAAO,EAGL,KAAK,cAAc,EAIpB,MAAM,OAAO,CAAC;AAEf,OAAO,EAeL,KAAK,aAAa,IAAI,gBAAgB,EACtC,KAAK,gBAAgB,IAAI,mBAAmB,EAE7C,MAAM,uBAAuB,CAAC;AAW/B,OAAO,KAAK,EACV,QAAQ,EACR,qBAAqB,EACrB,cAAc,EACd,eAAe,EACf,WAAW,EACX,yBAAyB,EACzB,GAAG,EACH,kBAAkB,EACnB,MAAM,aAAa,CAAC;AAWrB,gFAAgF;AAChF,MAAM,WAAW,uBAAuB;IACtC,wCAAwC;IACxC,WAAW,EAAE,GAAG,GAAG,IAAI,CAAC;IACxB,uCAAuC;IACvC,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,cAAc,GAAG,cAAc,CACtE,SACE,WAAW,EACX,yBAAyB,CAAC,uBAAuB,CAAC,EAClD,eAAe,CAAC,CAAC,CAAC,EAClB,qBAAqB,EACrB,QAAQ,CAAC,WAAW,CAAC,EACrB,IAAI,CACF,gBAAgB,CAAC,CAAC,CAAC,EACjB,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,YAAY,GACZ,mBAAmB,GACnB,WAAW,GACX,eAAe,GACf,SAAS,GACT,QAAQ,GACR,cAAc,CACjB;IACH,iEAAiE;IACjE,WAAW,CAAC,EAAE,GAAG,GAAG,IAAI,CAAC;IACzB,iEAAiE;IACjE,kBAAkB,CAAC,EAAE,GAAG,CAAC;IACzB,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9C;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;IAC1C,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AAED,8DAA8D;AAC9D,MAAM,WAAW,WAAW;IAC1B,2DAA2D;IAC3D,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,+CAA+C;IAC/C,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAgHD;;;;GAIG;AACH,QAAA,MAAM,SAAS,GAnHG,CAAC,SAAS,cAAc,iKAmHwB,CAAC;AAEnE,OAAO,EAAE,SAAS,IAAI,QAAQ,EAAE,CAAC;AAsFjC,MAAM,WAAW,iBAAiB,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,IAAI,CACvE,mBAAmB,CAAC,CAAC,CAAC,EACtB,YAAY,GAAG,cAAc,GAAG,YAAY,CAC7C;IACC,0EAA0E;IAC1E,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,2CAA2C;IAC3C,QAAQ,EAAE,kBAAkB,CAAC;CAC9B;AAED,oDAAoD;AACpD,wBAAgB,YAAY,CAAC,CAAC,SAAS,cAAc,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,CAAC,CAAC,CAAC,2CAiBlG;yBAjBe,YAAY;;;AAqB5B,MAAM,WAAW,oBAAoB,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IACxF,6EAA6E;IAC7E,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,mDAAmD;IACnD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,0DAA0D;AAC1D,wBAAgB,eAAe,CAAC,CAAC,SAAS,cAAc,EAAE,EACxD,KAAK,EACL,QAAQ,EACR,KAAK,EACL,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,CAAC,CAAC,2CAezB;yBApBe,eAAe"}
|
|
@@ -6,12 +6,13 @@ import { usePreventScroll } from 'react-aria';
|
|
|
6
6
|
import { Button as RACButton, Collection as RACCollection, ComboBox as RACComboBox, ComboBoxStateContext as RACComboBoxStateContext, Group as RACGroup, Header as RACHeader, Input as RACInput, ListBox as RACListBox, ListBoxLoadMoreItem as RACListBoxLoadMoreItem, ListBoxItem as RACListBoxItem, ListBoxSection as RACListBoxSection, ListLayout as RACListLayout, Text as RACText, Virtualizer as RACVirtualizer, } from 'react-aria-components';
|
|
7
7
|
import { forwardRef } from '../../forward-ref.js';
|
|
8
8
|
import { useLocalizedMessages } from '../../i18n/index.js';
|
|
9
|
-
import {
|
|
9
|
+
import { IconCheckBold, IconChevronDown } from '../../icons/index.js';
|
|
10
10
|
import { isProduction } from '../../utils/is-production.js';
|
|
11
11
|
import { useProductionWarning } from '../../utils/use-production-warning.js';
|
|
12
12
|
import { withStyleProps } from '../../with-style-props.js';
|
|
13
13
|
import { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';
|
|
14
14
|
import { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';
|
|
15
|
+
import { XButton } from '../internal/x-button/x-button.js';
|
|
15
16
|
import { Spinner } from '../spinner/spinner.js';
|
|
16
17
|
import { textStyle } from '../typography/utils.js';
|
|
17
18
|
const VIRTUAL_LAYOUT_OPTIONS = {
|
|
@@ -21,7 +22,7 @@ const VIRTUAL_LAYOUT_OPTIONS = {
|
|
|
21
22
|
padding: 0,
|
|
22
23
|
gap: 0,
|
|
23
24
|
};
|
|
24
|
-
function ComboBox({ label, description, error, items, children, placeholder, UNSAFE_className, UNSAFE_style, isReadOnly, onScroll, isVirtualized = false, UNSTABLE_isLoading: isLoading, UNSTABLE_onLoadMore: onLoadMore, apiRef, selectedKey, defaultSelectedKey, onSelectionChange, validate, ...props }, ref) {
|
|
25
|
+
function ComboBox({ label, description, error, items, children, placeholder, UNSAFE_className, UNSAFE_style, isReadOnly, onScroll, isVirtualized = false, UNSTABLE_isLoading: isLoading, UNSTABLE_onLoadMore: onLoadMore, UNSTABLE_isClearable: isClearable = false, apiRef, selectedKey, defaultSelectedKey, onSelectionChange, validate, ...props }, ref) {
|
|
25
26
|
const inputRef = useRef(null);
|
|
26
27
|
const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
|
|
27
28
|
useProductionWarning(() => {
|
|
@@ -36,12 +37,13 @@ function ComboBox({ label, description, error, items, children, placeholder, UNS
|
|
|
36
37
|
focus: () => inputRef.current?.focus(),
|
|
37
38
|
select: () => inputRef.current?.select(),
|
|
38
39
|
}), []);
|
|
40
|
+
const isFieldClearable = isClearable && !props.isDisabled && !isReadOnly;
|
|
39
41
|
const listBox = (_jsx(ComboBoxList, { items: items, isLoading: isLoading, onLoadMore: onLoadMore, onScroll: onScroll, children: children }));
|
|
40
42
|
return (_jsxs(RACComboBox, { ...props, ref: ref, className: clsx('cim-combo-box', UNSAFE_className), style: UNSAFE_style, selectionMode: "single", value: selectedKey, defaultValue: defaultSelectedKey, onChange: onSelectionChange, menuTrigger: "focus", isReadOnly: isReadOnly, "data-readonly": isReadOnly ? true : undefined, validate: validate
|
|
41
43
|
? ({ inputValue, value }) => {
|
|
42
44
|
return validate({ inputValue, selectedKey: value });
|
|
43
45
|
}
|
|
44
|
-
: undefined, children: [_jsx(FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), _jsxs(RACGroup, { className: "cim-combo-box-input-group", children: [_jsx(ComboBoxInput, { inputRef: inputRef, isReadOnly: isReadOnly, placeholder: placeholder }), _jsx(RACButton, { className: "cim-combo-box-button", children: _jsx(IconChevronDown, {}) })] }), _jsx(FormFieldError, { children: error }), _jsx(FormFieldDescription, { children: description }), _jsx(CollapsibleList, { offset: 5, maxHeight: 315, children: isVirtualized ? (_jsx(RACVirtualizer, { layout: RACListLayout, layoutOptions: VIRTUAL_LAYOUT_OPTIONS, children: listBox })) : (listBox) })] }));
|
|
46
|
+
: undefined, children: [_jsx(FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), _jsxs(RACGroup, { className: "cim-combo-box-input-group", children: [_jsx(ComboBoxInput, { inputRef: inputRef, isReadOnly: isReadOnly, placeholder: placeholder, isClearable: isFieldClearable }), isFieldClearable && _jsx(ComboBoxClearButton, {}), _jsx(RACButton, { className: "cim-combo-box-button", children: _jsx(IconChevronDown, {}) })] }), _jsx(FormFieldError, { children: error }), _jsx(FormFieldDescription, { children: description }), _jsx(CollapsibleList, { offset: 5, maxHeight: 315, children: isVirtualized ? (_jsx(RACVirtualizer, { layout: RACListLayout, layoutOptions: VIRTUAL_LAYOUT_OPTIONS, children: listBox })) : (listBox) })] }));
|
|
45
47
|
}
|
|
46
48
|
/**
|
|
47
49
|
* Allows users to filter a collapsible list and select one item from it.
|
|
@@ -50,12 +52,28 @@ function ComboBox({ label, description, error, items, children, placeholder, UNS
|
|
|
50
52
|
*/
|
|
51
53
|
const _ComboBox = withStyleProps(forwardRef(ComboBox), 'ComboBox');
|
|
52
54
|
export { _ComboBox as ComboBox };
|
|
53
|
-
function
|
|
55
|
+
function ComboBoxClearButton() {
|
|
56
|
+
const comboBoxState = useContext(RACComboBoxStateContext);
|
|
57
|
+
const inputValue = comboBoxState?.inputValue;
|
|
58
|
+
if (!comboBoxState || inputValue === '') {
|
|
59
|
+
return null;
|
|
60
|
+
}
|
|
61
|
+
return (_jsx(XButton, { onPress: () => {
|
|
62
|
+
comboBoxState?.setValue(null);
|
|
63
|
+
}, iconType: "circled", "aria-label": "Clear selection",
|
|
64
|
+
// Prevent this button from acting as a trigger for opening/closing the ComboBox
|
|
65
|
+
slot: null, excludeFromTabOrder: true }));
|
|
66
|
+
}
|
|
67
|
+
function ComboBoxInput({ inputRef, isReadOnly, placeholder, isClearable, }) {
|
|
54
68
|
const comboBoxState = useContext(RACComboBoxStateContext);
|
|
55
69
|
return (_jsx(RACInput, { ref: inputRef, className: clsx('cim-combo-box-input', textStyle({ variant: 'body' })),
|
|
56
70
|
// Ensure the popover opens when the input is clicked.
|
|
57
71
|
// By default, React Aria only opens the popover when the input is focused.
|
|
58
|
-
onClick: () => !isReadOnly && comboBoxState.open(), placeholder: placeholder
|
|
72
|
+
onClick: () => !isReadOnly && comboBoxState.open(), placeholder: placeholder, onKeyDown: (e) => {
|
|
73
|
+
if (e.key === 'Escape' && !comboBoxState?.isOpen && isClearable) {
|
|
74
|
+
comboBoxState?.setValue(null);
|
|
75
|
+
}
|
|
76
|
+
} }));
|
|
59
77
|
}
|
|
60
78
|
function ComboBoxList({ items, children, isLoading, onLoadMore, onScroll, }) {
|
|
61
79
|
const comboBoxState = useContext(RACComboBoxStateContext);
|
|
@@ -66,7 +84,7 @@ function ComboBoxList({ items, children, isLoading, onLoadMore, onScroll, }) {
|
|
|
66
84
|
/** Renders a single list item within `ComboBox`. */
|
|
67
85
|
export function ComboBoxItem({ children, ...props }) {
|
|
68
86
|
const textValue = typeof children === 'string' ? children : typeof children === 'number' ? String(children) : children.join('');
|
|
69
|
-
return (_jsx(RACListBoxItem, { ...props, className: "cim-combo-box-item", textValue: textValue, children: ({ isDisabled }) => (_jsxs(_Fragment, { children: [_jsx(
|
|
87
|
+
return (_jsx(RACListBoxItem, { ...props, className: "cim-combo-box-item", textValue: textValue, children: ({ isDisabled }) => (_jsxs(_Fragment, { children: [_jsx(IconCheckBold, {}), _jsx(RACText, { slot: "label", className: textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' }), children: children })] })) }));
|
|
70
88
|
}
|
|
71
89
|
ComboBoxItem.displayName = 'ComboBoxItem';
|
|
72
90
|
/** Groups list items within `ComboBox` into a section. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combo-box.js","sourceRoot":"","sources":["../../../../src/components/combo-box/combo-box.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport {\n type ForwardedRef,\n type MutableRefObject,\n type UIEventHandler,\n useContext,\n useImperativeHandle,\n useRef,\n} from 'react';\nimport { usePreventScroll } from 'react-aria';\nimport {\n Button as RACButton,\n Collection as RACCollection,\n ComboBox as RACComboBox,\n ComboBoxStateContext as RACComboBoxStateContext,\n Group as RACGroup,\n Header as RACHeader,\n Input as RACInput,\n ListBox as RACListBox,\n ListBoxLoadMoreItem as RACListBoxLoadMoreItem,\n ListBoxItem as RACListBoxItem,\n ListBoxSection as RACListBoxSection,\n ListLayout as RACListLayout,\n type ListLayoutOptions as RACListLayoutOptions,\n Text as RACText,\n type ComboBoxProps as RACComboBoxProps,\n type ListBoxItemProps as RACListBoxItemProps,\n Virtualizer as RACVirtualizer,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { IconCheck, IconChevronDown } from '../../icons/index.js';\nimport { isProduction } from '../../utils/is-production.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { Spinner } from '../spinner/spinner.js';\nimport type {\n ApiProps,\n AsyncItemLoadingProps,\n CollectionItem,\n CollectionProps,\n CommonProps,\n FieldWithPlaceholderProps,\n Key,\n StringLikeChildren,\n} from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nconst VIRTUAL_LAYOUT_OPTIONS: RACListLayoutOptions = {\n estimatedRowHeight: 40,\n estimatedHeadingHeight: 32,\n loaderHeight: 40,\n padding: 0,\n gap: 0,\n};\n\n/** Represents the state of the `ComboBox` component for validation purposes. */\nexport interface ComboBoxValidationValue {\n /** The selected key in the ComboBox. */\n selectedKey: Key | null;\n /** The value of the ComboBox input. */\n inputValue: string;\n}\n\nexport interface ComboBoxProps<T extends CollectionItem = CollectionItem>\n extends\n CommonProps,\n FieldWithPlaceholderProps<ComboBoxValidationValue>,\n CollectionProps<T>,\n AsyncItemLoadingProps,\n ApiProps<ComboBoxApi>,\n Pick<\n RACComboBoxProps<T>,\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'inputValue'\n | 'defaultInputValue'\n | 'autoFocus'\n | 'onInputChange'\n | 'onFocus'\n | 'onBlur'\n | 'onOpenChange'\n > {\n /** The currently selected key in the collection (controlled). */\n selectedKey?: Key | null;\n /** The initial selected key in the collection (uncontrolled). */\n defaultSelectedKey?: Key;\n /** Handler that is called when the selection changes. */\n onSelectionChange?: (key: Key | null) => void;\n /**\n * Whether the list of options should be virtualized. Use this as a performance optimization for large lists.\n * @default false\n */\n isVirtualized?: boolean;\n /** Handler that is called when the list of items is scrolled. */\n onScroll?: UIEventHandler<HTMLDivElement>;\n}\n\n/** The imperative API exposed by the `ComboBox` component. */\nexport interface ComboBoxApi {\n /** Focuses the input field and opens the list of items. */\n focus: () => void;\n /** Selects the contents of the input field. */\n select: () => void;\n}\n\nfunction ComboBox<T extends CollectionItem>(\n {\n label,\n description,\n error,\n items,\n children,\n placeholder,\n UNSAFE_className,\n UNSAFE_style,\n isReadOnly,\n onScroll,\n isVirtualized = false,\n UNSTABLE_isLoading: isLoading,\n UNSTABLE_onLoadMore: onLoadMore,\n apiRef,\n selectedKey,\n defaultSelectedKey,\n onSelectionChange,\n validate,\n ...props\n }: ComboBoxProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const inputRef = useRef<HTMLInputElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('ComboBox requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`ComboBox` requires `children` to be a function when using `items` prop');\n }\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => inputRef.current?.focus(),\n select: () => inputRef.current?.select(),\n }),\n [],\n );\n\n const listBox = (\n <ComboBoxList<T> items={items} isLoading={isLoading} onLoadMore={onLoadMore} onScroll={onScroll}>\n {children}\n </ComboBoxList>\n );\n\n return (\n <RACComboBox\n {...props}\n ref={ref}\n className={clsx('cim-combo-box', UNSAFE_className)}\n style={UNSAFE_style}\n selectionMode=\"single\"\n value={selectedKey}\n defaultValue={defaultSelectedKey}\n onChange={onSelectionChange}\n menuTrigger=\"focus\"\n isReadOnly={isReadOnly}\n data-readonly={isReadOnly ? true : undefined}\n validate={\n validate\n ? ({ inputValue, value }) => {\n return validate({ inputValue, selectedKey: value });\n }\n : undefined\n }\n >\n <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-combo-box-input-group\">\n <ComboBoxInput inputRef={inputRef} isReadOnly={isReadOnly} placeholder={placeholder} />\n <RACButton className=\"cim-combo-box-button\">\n <IconChevronDown />\n </RACButton>\n </RACGroup>\n <FormFieldError>{error}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n <CollapsibleList\n offset={5} // 1px border + 4px actual offset\n maxHeight={315}\n >\n {isVirtualized ? (\n <RACVirtualizer layout={RACListLayout} layoutOptions={VIRTUAL_LAYOUT_OPTIONS}>\n {listBox}\n </RACVirtualizer>\n ) : (\n listBox\n )}\n </CollapsibleList>\n </RACComboBox>\n );\n}\n\n/**\n * Allows users to filter a collapsible list and select one item from it.\n *\n * See [combo box usage guidelines](https://ui.cimpress.io/components/combo-box)\n */\nconst _ComboBox = withStyleProps(forwardRef(ComboBox), 'ComboBox');\n\nexport { _ComboBox as ComboBox };\n\nfunction ComboBoxInput({\n inputRef,\n isReadOnly,\n placeholder,\n}: {\n inputRef: MutableRefObject<HTMLInputElement | null>;\n isReadOnly: boolean | undefined;\n placeholder: string | undefined;\n}) {\n const comboBoxState = useContext(RACComboBoxStateContext);\n\n return (\n <RACInput\n ref={inputRef}\n className={clsx('cim-combo-box-input', textStyle({ variant: 'body' }))}\n // Ensure the popover opens when the input is clicked.\n // By default, React Aria only opens the popover when the input is focused.\n onClick={() => !isReadOnly && comboBoxState!.open()}\n placeholder={placeholder}\n />\n );\n}\n\nfunction ComboBoxList<T extends CollectionItem = CollectionItem>({\n items,\n children,\n isLoading,\n onLoadMore,\n onScroll,\n}: Pick<ComboBoxProps<T>, 'items' | 'children' | 'onScroll'> & {\n isLoading: ComboBoxProps['UNSTABLE_isLoading'];\n onLoadMore: ComboBoxProps['UNSTABLE_onLoadMore'];\n}) {\n const comboBoxState = useContext(RACComboBoxStateContext);\n const collectionMessages = useLocalizedMessages('UNSTABLE_collection');\n\n usePreventScroll({ isDisabled: !comboBoxState?.isOpen });\n\n return (\n <RACListBox\n className=\"cim-combo-box-listbox\"\n onScroll={onScroll}\n renderEmptyState={() =>\n isLoading ? <Spinner aria-label={collectionMessages.format('loading')} size=\"small\" marginY={8} /> : null\n }\n >\n <RACCollection items={items}>{children}</RACCollection>\n <RACListBoxLoadMoreItem onLoadMore={onLoadMore} isLoading={isLoading}>\n <Spinner aria-label={collectionMessages.format('loadingMore')} size=\"small\" marginY={8} />\n </RACListBoxLoadMoreItem>\n </RACListBox>\n );\n}\n\nexport interface ComboBoxItemProps<T extends CollectionItem> extends Pick<\n RACListBoxItemProps<T>,\n 'isDisabled' | 'onHoverStart' | 'onHoverEnd'\n> {\n /** The ID of the item. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the label. */\n children: StringLikeChildren;\n}\n\n/** Renders a single list item within `ComboBox`. */\nexport function ComboBoxItem<T extends CollectionItem>({ children, ...props }: ComboBoxItemProps<T>) {\n const textValue =\n typeof children === 'string' ? children : typeof children === 'number' ? String(children) : children.join('');\n\n return (\n <RACListBoxItem {...props} className=\"cim-combo-box-item\" textValue={textValue}>\n {({ isDisabled }) => (\n <>\n <IconCheck />\n\n <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n {children}\n </RACText>\n </>\n )}\n </RACListBoxItem>\n );\n}\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport interface ComboBoxSectionProps<T extends CollectionItem> extends CollectionProps<T> {\n /** The ID of the section. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the section title. */\n title: string;\n}\n\n/** Groups list items within `ComboBox` into a section. */\nexport function ComboBoxSection<T extends CollectionItem>({\n title,\n children,\n items,\n ...props\n}: ComboBoxSectionProps<T>) {\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`ComboBoxSection` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACListBoxSection {...props} className=\"cim-combo-box-section\">\n <RACHeader\n className={clsx('cim-combo-box-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}\n >\n {title}\n </RACHeader>\n <RACCollection items={items}>{children}</RACCollection>\n </RACListBoxSection>\n );\n}\n\nComboBoxSection.displayName = 'ComboBoxSection';\n"]}
|
|
1
|
+
{"version":3,"file":"combo-box.js","sourceRoot":"","sources":["../../../../src/components/combo-box/combo-box.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport {\n type ForwardedRef,\n type MutableRefObject,\n type UIEventHandler,\n useContext,\n useImperativeHandle,\n useRef,\n} from 'react';\nimport { usePreventScroll } from 'react-aria';\nimport {\n Button as RACButton,\n Collection as RACCollection,\n ComboBox as RACComboBox,\n ComboBoxStateContext as RACComboBoxStateContext,\n Group as RACGroup,\n Header as RACHeader,\n Input as RACInput,\n ListBox as RACListBox,\n ListBoxLoadMoreItem as RACListBoxLoadMoreItem,\n ListBoxItem as RACListBoxItem,\n ListBoxSection as RACListBoxSection,\n ListLayout as RACListLayout,\n type ListLayoutOptions as RACListLayoutOptions,\n Text as RACText,\n type ComboBoxProps as RACComboBoxProps,\n type ListBoxItemProps as RACListBoxItemProps,\n Virtualizer as RACVirtualizer,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { IconCheckBold, IconChevronDown } from '../../icons/index.js';\nimport { isProduction } from '../../utils/is-production.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { XButton } from '../internal/x-button/x-button.js';\nimport { Spinner } from '../spinner/spinner.js';\nimport type {\n ApiProps,\n AsyncItemLoadingProps,\n CollectionItem,\n CollectionProps,\n CommonProps,\n FieldWithPlaceholderProps,\n Key,\n StringLikeChildren,\n} from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nconst VIRTUAL_LAYOUT_OPTIONS: RACListLayoutOptions = {\n estimatedRowHeight: 40,\n estimatedHeadingHeight: 32,\n loaderHeight: 40,\n padding: 0,\n gap: 0,\n};\n\n/** Represents the state of the `ComboBox` component for validation purposes. */\nexport interface ComboBoxValidationValue {\n /** The selected key in the ComboBox. */\n selectedKey: Key | null;\n /** The value of the ComboBox input. */\n inputValue: string;\n}\n\nexport interface ComboBoxProps<T extends CollectionItem = CollectionItem>\n extends\n CommonProps,\n FieldWithPlaceholderProps<ComboBoxValidationValue>,\n CollectionProps<T>,\n AsyncItemLoadingProps,\n ApiProps<ComboBoxApi>,\n Pick<\n RACComboBoxProps<T>,\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'isReadOnly'\n | 'inputValue'\n | 'defaultInputValue'\n | 'autoFocus'\n | 'onInputChange'\n | 'onFocus'\n | 'onBlur'\n | 'onOpenChange'\n > {\n /** The currently selected key in the collection (controlled). */\n selectedKey?: Key | null;\n /** The initial selected key in the collection (uncontrolled). */\n defaultSelectedKey?: Key;\n /** Handler that is called when the selection changes. */\n onSelectionChange?: (key: Key | null) => void;\n /**\n * Whether the list of options should be virtualized. Use this as a performance optimization for large lists.\n * @default false\n */\n isVirtualized?: boolean;\n /** Handler that is called when the list of items is scrolled. */\n onScroll?: UIEventHandler<HTMLDivElement>;\n UNSTABLE_isClearable?: boolean;\n}\n\n/** The imperative API exposed by the `ComboBox` component. */\nexport interface ComboBoxApi {\n /** Focuses the input field and opens the list of items. */\n focus: () => void;\n /** Selects the contents of the input field. */\n select: () => void;\n}\n\nfunction ComboBox<T extends CollectionItem>(\n {\n label,\n description,\n error,\n items,\n children,\n placeholder,\n UNSAFE_className,\n UNSAFE_style,\n isReadOnly,\n onScroll,\n isVirtualized = false,\n UNSTABLE_isLoading: isLoading,\n UNSTABLE_onLoadMore: onLoadMore,\n UNSTABLE_isClearable: isClearable = false,\n apiRef,\n selectedKey,\n defaultSelectedKey,\n onSelectionChange,\n validate,\n ...props\n }: ComboBoxProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const inputRef = useRef<HTMLInputElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('ComboBox requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`ComboBox` requires `children` to be a function when using `items` prop');\n }\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => inputRef.current?.focus(),\n select: () => inputRef.current?.select(),\n }),\n [],\n );\n\n const isFieldClearable = isClearable && !props.isDisabled && !isReadOnly;\n\n const listBox = (\n <ComboBoxList<T> items={items} isLoading={isLoading} onLoadMore={onLoadMore} onScroll={onScroll}>\n {children}\n </ComboBoxList>\n );\n\n return (\n <RACComboBox\n {...props}\n ref={ref}\n className={clsx('cim-combo-box', UNSAFE_className)}\n style={UNSAFE_style}\n selectionMode=\"single\"\n value={selectedKey}\n defaultValue={defaultSelectedKey}\n onChange={onSelectionChange}\n menuTrigger=\"focus\"\n isReadOnly={isReadOnly}\n data-readonly={isReadOnly ? true : undefined}\n validate={\n validate\n ? ({ inputValue, value }) => {\n return validate({ inputValue, selectedKey: value });\n }\n : undefined\n }\n >\n <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n {label}\n </FormFieldLabel>\n <RACGroup className=\"cim-combo-box-input-group\">\n <ComboBoxInput\n inputRef={inputRef}\n isReadOnly={isReadOnly}\n placeholder={placeholder}\n isClearable={isFieldClearable}\n />\n {isFieldClearable && <ComboBoxClearButton />}\n <RACButton className=\"cim-combo-box-button\">\n <IconChevronDown />\n </RACButton>\n </RACGroup>\n <FormFieldError>{error}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n <CollapsibleList\n offset={5} // 1px border + 4px actual offset\n maxHeight={315}\n >\n {isVirtualized ? (\n <RACVirtualizer layout={RACListLayout} layoutOptions={VIRTUAL_LAYOUT_OPTIONS}>\n {listBox}\n </RACVirtualizer>\n ) : (\n listBox\n )}\n </CollapsibleList>\n </RACComboBox>\n );\n}\n\n/**\n * Allows users to filter a collapsible list and select one item from it.\n *\n * See [combo box usage guidelines](https://ui.cimpress.io/components/combo-box)\n */\nconst _ComboBox = withStyleProps(forwardRef(ComboBox), 'ComboBox');\n\nexport { _ComboBox as ComboBox };\n\nfunction ComboBoxClearButton() {\n const comboBoxState = useContext(RACComboBoxStateContext);\n const inputValue = comboBoxState?.inputValue;\n\n if (!comboBoxState || inputValue === '') {\n return null;\n }\n\n return (\n <XButton\n onPress={() => {\n comboBoxState?.setValue(null);\n }}\n iconType=\"circled\"\n // TODO: i18n once stabilized\n aria-label=\"Clear selection\"\n // Prevent this button from acting as a trigger for opening/closing the ComboBox\n slot={null}\n excludeFromTabOrder\n />\n );\n}\n\nfunction ComboBoxInput({\n inputRef,\n isReadOnly,\n placeholder,\n isClearable,\n}: {\n inputRef: MutableRefObject<HTMLInputElement | null>;\n isReadOnly: boolean | undefined;\n placeholder: string | undefined;\n isClearable: boolean;\n}) {\n const comboBoxState = useContext(RACComboBoxStateContext);\n\n return (\n <RACInput\n ref={inputRef}\n className={clsx('cim-combo-box-input', textStyle({ variant: 'body' }))}\n // Ensure the popover opens when the input is clicked.\n // By default, React Aria only opens the popover when the input is focused.\n onClick={() => !isReadOnly && comboBoxState!.open()}\n placeholder={placeholder}\n onKeyDown={(e) => {\n if (e.key === 'Escape' && !comboBoxState?.isOpen && isClearable) {\n comboBoxState?.setValue(null);\n }\n }}\n />\n );\n}\n\nfunction ComboBoxList<T extends CollectionItem = CollectionItem>({\n items,\n children,\n isLoading,\n onLoadMore,\n onScroll,\n}: Pick<ComboBoxProps<T>, 'items' | 'children' | 'onScroll'> & {\n isLoading: ComboBoxProps['UNSTABLE_isLoading'];\n onLoadMore: ComboBoxProps['UNSTABLE_onLoadMore'];\n}) {\n const comboBoxState = useContext(RACComboBoxStateContext);\n const collectionMessages = useLocalizedMessages('UNSTABLE_collection');\n\n usePreventScroll({ isDisabled: !comboBoxState?.isOpen });\n\n return (\n <RACListBox\n className=\"cim-combo-box-listbox\"\n onScroll={onScroll}\n renderEmptyState={() =>\n isLoading ? <Spinner aria-label={collectionMessages.format('loading')} size=\"small\" marginY={8} /> : null\n }\n >\n <RACCollection items={items}>{children}</RACCollection>\n <RACListBoxLoadMoreItem onLoadMore={onLoadMore} isLoading={isLoading}>\n <Spinner aria-label={collectionMessages.format('loadingMore')} size=\"small\" marginY={8} />\n </RACListBoxLoadMoreItem>\n </RACListBox>\n );\n}\n\nexport interface ComboBoxItemProps<T extends CollectionItem> extends Pick<\n RACListBoxItemProps<T>,\n 'isDisabled' | 'onHoverStart' | 'onHoverEnd'\n> {\n /** The ID of the item. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the label. */\n children: StringLikeChildren;\n}\n\n/** Renders a single list item within `ComboBox`. */\nexport function ComboBoxItem<T extends CollectionItem>({ children, ...props }: ComboBoxItemProps<T>) {\n const textValue =\n typeof children === 'string' ? children : typeof children === 'number' ? String(children) : children.join('');\n\n return (\n <RACListBoxItem {...props} className=\"cim-combo-box-item\" textValue={textValue}>\n {({ isDisabled }) => (\n <>\n <IconCheckBold />\n\n <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n {children}\n </RACText>\n </>\n )}\n </RACListBoxItem>\n );\n}\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport interface ComboBoxSectionProps<T extends CollectionItem> extends CollectionProps<T> {\n /** The ID of the section. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the section title. */\n title: string;\n}\n\n/** Groups list items within `ComboBox` into a section. */\nexport function ComboBoxSection<T extends CollectionItem>({\n title,\n children,\n items,\n ...props\n}: ComboBoxSectionProps<T>) {\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`ComboBoxSection` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACListBoxSection {...props} className=\"cim-combo-box-section\">\n <RACHeader\n className={clsx('cim-combo-box-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}\n >\n {title}\n </RACHeader>\n <RACCollection items={items}>{children}</RACCollection>\n </RACListBoxSection>\n );\n}\n\nComboBoxSection.displayName = 'ComboBoxSection';\n"]}
|
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import clsx from 'clsx';
|
|
3
3
|
import { IconCheckBold, IconSubtractBold } from '../../../icons/index.js';
|
|
4
|
-
// TODO: refactor so that state is accepted through props/context instead of a parent className
|
|
5
4
|
/**
|
|
6
5
|
* Displays a non-interactive, purely visual checkbox indicator.
|
|
7
|
-
* Requires adding a `cim-checkbox-indicator-wrapper` className to the parent element.
|
|
8
6
|
*
|
|
9
7
|
* @internal
|
|
10
8
|
*/
|
|
11
|
-
export function CheckboxIndicator({ isSelected, isIndeterminate, UNSAFE_className, UNSAFE_style, ...props }) {
|
|
12
|
-
return (_jsx("div", { ...props, className: clsx('cim-checkbox-indicator', UNSAFE_className), style: UNSAFE_style, "data-selected": isSelected, "aria-hidden": true, children: _jsx("div", { className: "cim-checkbox-indicator-icon", children: isIndeterminate ? _jsx(IconSubtractBold, {}) : _jsx(IconCheckBold, {}) }) }));
|
|
9
|
+
export function CheckboxIndicator({ isSelected, isIndeterminate, isDisabled, isReadOnly, isInvalid, isHovered, isPressed, isFocusVisible, UNSAFE_className, UNSAFE_style, ...props }) {
|
|
10
|
+
return (_jsx("div", { ...props, className: clsx('cim-checkbox-indicator', UNSAFE_className), style: UNSAFE_style, "data-selected": isSelected || undefined, "data-indeterminate": isIndeterminate || undefined, "data-disabled": isDisabled || undefined, "data-readonly": isReadOnly || undefined, "data-invalid": isInvalid || undefined, "data-hovered": isHovered || undefined, "data-pressed": isPressed || undefined, "data-focus-visible": isFocusVisible || undefined, "aria-hidden": true, children: _jsx("div", { className: "cim-checkbox-indicator-icon", children: isIndeterminate ? _jsx(IconSubtractBold, {}) : _jsx(IconCheckBold, {}) }) }));
|
|
13
11
|
}
|
|
14
12
|
CheckboxIndicator.displayName = 'CheckboxIndicator';
|
|
15
13
|
//# sourceMappingURL=checkbox-indicator.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox-indicator.js","sourceRoot":"","sources":["../../../../../src/components/internal/checkbox-indicator/checkbox-indicator.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"checkbox-indicator.js","sourceRoot":"","sources":["../../../../../src/components/internal/checkbox-indicator/checkbox-indicator.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAc1E;;;;GAIG;AACH,MAAM,UAAU,iBAAiB,CAAC,EAChC,UAAU,EACV,eAAe,EACf,UAAU,EACV,UAAU,EACV,SAAS,EACT,SAAS,EACT,SAAS,EACT,cAAc,EACd,gBAAgB,EAChB,YAAY,EACZ,GAAG,KAAK,EACe;IACvB,OAAO,CACL,iBACM,KAAK,EACT,SAAS,EAAE,IAAI,CAAC,wBAAwB,EAAE,gBAAgB,CAAC,EAC3D,KAAK,EAAE,YAAY,mBACJ,UAAU,IAAI,SAAS,wBAClB,eAAe,IAAI,SAAS,mBACjC,UAAU,IAAI,SAAS,mBACvB,UAAU,IAAI,SAAS,kBACxB,SAAS,IAAI,SAAS,kBACtB,SAAS,IAAI,SAAS,kBACtB,SAAS,IAAI,SAAS,wBAChB,cAAc,IAAI,SAAS,iCAG/C,cAAK,SAAS,EAAC,6BAA6B,YAAE,eAAe,CAAC,CAAC,CAAC,KAAC,gBAAgB,KAAG,CAAC,CAAC,CAAC,KAAC,aAAa,KAAG,GAAO,GAC3G,CACP,CAAC;AACJ,CAAC;AAED,iBAAiB,CAAC,WAAW,GAAG,mBAAmB,CAAC","sourcesContent":["import clsx from 'clsx';\nimport { IconCheckBold, IconSubtractBold } from '../../../icons/index.js';\nimport type { CommonProps } from '../../types.js';\n\ninterface CheckboxIndicatorProps extends CommonProps {\n isSelected?: boolean;\n isIndeterminate?: boolean;\n isDisabled?: boolean;\n isReadOnly?: boolean;\n isInvalid?: boolean;\n isHovered?: boolean;\n isPressed?: boolean;\n isFocusVisible?: boolean;\n}\n\n/**\n * Displays a non-interactive, purely visual checkbox indicator.\n *\n * @internal\n */\nexport function CheckboxIndicator({\n isSelected,\n isIndeterminate,\n isDisabled,\n isReadOnly,\n isInvalid,\n isHovered,\n isPressed,\n isFocusVisible,\n UNSAFE_className,\n UNSAFE_style,\n ...props\n}: CheckboxIndicatorProps) {\n return (\n <div\n {...props}\n className={clsx('cim-checkbox-indicator', UNSAFE_className)}\n style={UNSAFE_style}\n data-selected={isSelected || undefined}\n data-indeterminate={isIndeterminate || undefined}\n data-disabled={isDisabled || undefined}\n data-readonly={isReadOnly || undefined}\n data-invalid={isInvalid || undefined}\n data-hovered={isHovered || undefined}\n data-pressed={isPressed || undefined}\n data-focus-visible={isFocusVisible || undefined}\n aria-hidden\n >\n <div className=\"cim-checkbox-indicator-icon\">{isIndeterminate ? <IconSubtractBold /> : <IconCheckBold />}</div>\n </div>\n );\n}\n\nCheckboxIndicator.displayName = 'CheckboxIndicator';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"collapsible-list.js","sourceRoot":"","sources":["../../../../../src/components/internal/collapsible-list/collapsible-list.tsx"],"names":[],"mappings":";AAAA,iDAAiD;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,OAAO,IAAI,UAAU,EAAwC,MAAM,uBAAuB,CAAC;AAOpG;;;;GAIG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,UAAU,CAAuC,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAC/G,KAAC,UAAU,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAC,sBAAsB,EAAC,gBAAgB,EAAE,EAAE,yCACnF,QAAQ,GACE,CACd,CAAC,CAAC;AAEH,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC","sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { forwardRef } from 'react';\nimport { Popover as RACPopover, type PopoverProps as RACPopoverProps } from 'react-aria-components';\n\ninterface CollapsibleListProps extends Pick<\n RACPopoverProps,\n 'placement' | 'offset' | 'maxHeight' | 'children' | 'triggerRef' | 'isNonModal'\n> {}\n\n/**\n * Displays a collapsible list activated via a trigger element.\n *\n * @internal\n */\nexport const CollapsibleList = forwardRef<HTMLDivElement, CollapsibleListProps>(({ children, ...props }, ref) => (\n <RACPopover {...props} ref={ref} className=\"cim-collapsible-list\" containerPadding={16} data-cim-style-root>\n {children}\n </RACPopover>\n));\n\nCollapsibleList.displayName = 'CollapsibleList';\n"]}
|
|
1
|
+
{"version":3,"file":"collapsible-list.js","sourceRoot":"","sources":["../../../../../src/components/internal/collapsible-list/collapsible-list.tsx"],"names":[],"mappings":";AAAA,iDAAiD;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,OAAO,IAAI,UAAU,EAAwC,MAAM,uBAAuB,CAAC;AAOpG;;;;GAIG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,UAAU,CAAuC,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAC/G,KAAC,UAAU,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAC,sBAAsB,EAAC,gBAAgB,EAAE,EAAE,yCACnF,QAAQ,GACE,CACd,CAAC,CAAC;AAEH,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC","sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { forwardRef } from 'react';\nimport { Popover as RACPopover, type PopoverProps as RACPopoverProps } from 'react-aria-components';\n\ninterface CollapsibleListProps extends Pick<\n RACPopoverProps,\n 'placement' | 'offset' | 'crossOffset' | 'maxHeight' | 'children' | 'triggerRef' | 'isNonModal'\n> {}\n\n/**\n * Displays a collapsible list activated via a trigger element.\n *\n * @internal\n */\nexport const CollapsibleList = forwardRef<HTMLDivElement, CollapsibleListProps>(({ children, ...props }, ref) => (\n <RACPopover {...props} ref={ref} className=\"cim-collapsible-list\" containerPadding={16} data-cim-style-root>\n {children}\n </RACPopover>\n));\n\nCollapsibleList.displayName = 'CollapsibleList';\n"]}
|