@astryxdesign/core 0.7.2-canary.caec7ca → 0.7.2-canary.cbb7fa3
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/AspectRatio/AspectRatio.d.ts +6 -8
- package/dist/AspectRatio/AspectRatio.d.ts.map +1 -1
- package/dist/AspectRatio/AspectRatio.js +44 -3
- package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
- package/dist/Breadcrumbs/BreadcrumbItem.js +5 -2
- package/dist/CheckboxInput/CheckboxInput.d.ts +1 -1
- package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +3 -1
- package/dist/CommandPalette/CommandPaletteInput.d.ts +1 -1
- package/dist/CommandPalette/CommandPaletteInput.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPaletteInput.js +37 -5
- package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
- package/dist/ContextMenu/ContextMenu.js +5 -2
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +20 -8
- package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenu.js +46 -3
- package/dist/DropdownMenu/DropdownMenuContext.d.ts +17 -0
- package/dist/DropdownMenu/DropdownMenuContext.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuContext.js +21 -0
- package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuSubMenu.js +15 -4
- package/dist/EmptyState/EmptyState.d.ts.map +1 -1
- package/dist/EmptyState/EmptyState.js +4 -10
- package/dist/Field/Field.d.ts +1 -1
- package/dist/Field/Field.d.ts.map +1 -1
- package/dist/Field/Field.js +8 -4
- package/dist/Grid/GridSpan.d.ts.map +1 -1
- package/dist/Grid/GridSpan.js +1 -0
- package/dist/List/List.d.ts +46 -19
- package/dist/List/List.d.ts.map +1 -1
- package/dist/List/List.js +28 -10
- package/dist/List/ListContext.d.ts +8 -3
- package/dist/List/ListContext.d.ts.map +1 -1
- package/dist/List/ListContext.js +7 -2
- package/dist/List/ListItem.d.ts +4 -3
- package/dist/List/ListItem.d.ts.map +1 -1
- package/dist/List/ListItem.js +19 -8
- package/dist/List/index.d.ts +1 -1
- package/dist/List/index.d.ts.map +1 -1
- package/dist/Markdown/Markdown.d.ts.map +1 -1
- package/dist/Markdown/Markdown.js +8 -1
- package/dist/MetadataList/MetadataList.d.ts.map +1 -1
- package/dist/MetadataList/MetadataList.js +5 -1
- package/dist/MetadataList/MetadataListContext.d.ts +1 -1
- package/dist/MetadataList/MetadataListContext.d.ts.map +1 -1
- package/dist/RadioList/RadioList.d.ts +1 -1
- package/dist/RadioList/RadioList.d.ts.map +1 -1
- package/dist/RadioList/RadioList.js +6 -2
- package/dist/ToggleButton/ToggleButton.d.ts +3 -2
- package/dist/ToggleButton/ToggleButton.d.ts.map +1 -1
- package/dist/ToggleButton/ToggleButton.js +12 -1
- package/dist/TreeList/TreeList.d.ts.map +1 -1
- package/dist/TreeList/TreeList.js +1 -0
- package/dist/TreeList/TreeListBranches.d.ts.map +1 -1
- package/dist/TreeList/TreeListBranches.js +2 -2
- package/dist/TreeList/TreeListItem.d.ts.map +1 -1
- package/dist/TreeList/TreeListItem.js +57 -9
- package/dist/astryx.css +16 -3
- package/dist/hooks/useMenuHover.d.ts.map +1 -1
- package/dist/hooks/useMenuHover.js +18 -13
- package/dist/utils/plainDate.d.ts.map +1 -1
- package/dist/utils/plainDate.js +15 -9
- package/package.json +3 -3
- package/src/AspectRatio/AspectRatio.test.tsx +44 -43
- package/src/AspectRatio/AspectRatio.tsx +38 -18
- package/src/AspectRatio/__tests__/AspectRatioFitLayers.a11y.browser.spec.ts +157 -0
- package/src/Avatar/Avatar.doc.mjs +5 -3
- package/src/AvatarGroup/AvatarGroup.doc.mjs +3 -2
- package/src/Breadcrumbs/BreadcrumbItem.tsx +4 -1
- package/src/Chat/__tests__/ChatMessageMetadata.a11y.chromium.spec.ts +3 -1
- package/src/CheckboxInput/CheckboxInput.test.tsx +34 -0
- package/src/CheckboxInput/CheckboxInput.tsx +3 -1
- package/src/CommandPalette/CommandPaletteInput.test.tsx +53 -4
- package/src/CommandPalette/CommandPaletteInput.tsx +33 -3
- package/src/CommandPalette/__tests__/CommandPaletteInputAudit.a11y.chromium.spec.ts +335 -0
- package/src/ContextMenu/ContextMenu.tsx +4 -1
- package/src/Dialog/Dialog.test.tsx +46 -0
- package/src/Dialog/Dialog.tsx +20 -7
- package/src/Dialog/__tests__/Dialog.a11y.known-failures.ts +0 -14
- package/src/DropdownMenu/DropdownMenu.tsx +45 -2
- package/src/DropdownMenu/DropdownMenuContext.tsx +24 -0
- package/src/DropdownMenu/DropdownMenuSubMenu.test.tsx +185 -0
- package/src/DropdownMenu/DropdownMenuSubMenu.tsx +17 -3
- package/src/EmptyState/EmptyState.doc.mjs +3 -2
- package/src/EmptyState/EmptyState.spec.md +189 -0
- package/src/EmptyState/EmptyState.test.tsx +74 -3
- package/src/EmptyState/EmptyState.tsx +4 -8
- package/src/Field/Field.doc.mjs +14 -8
- package/src/Field/Field.spec.md +217 -0
- package/src/Field/Field.test.tsx +60 -2
- package/src/Field/Field.tsx +17 -8
- package/src/Grid/GridSpan.tsx +3 -0
- package/src/Item/Item.doc.mjs +1 -1
- package/src/Item/Item.tsx +1 -1
- package/src/List/List.doc.mjs +14 -1
- package/src/List/List.spec.md +129 -77
- package/src/List/List.test.tsx +144 -94
- package/src/List/List.tsx +74 -18
- package/src/List/ListContext.tsx +9 -3
- package/src/List/ListItem.tsx +46 -26
- package/src/List/index.ts +1 -1
- package/src/Markdown/Markdown.tsx +14 -1
- package/src/MetadataList/MetadataList.doc.mjs +2 -2
- package/src/MetadataList/MetadataList.test.tsx +38 -0
- package/src/MetadataList/MetadataList.tsx +8 -1
- package/src/MetadataList/MetadataListContext.tsx +1 -1
- package/src/RadioList/RadioList.fr10.test.tsx +45 -2
- package/src/RadioList/RadioList.tsx +4 -1
- package/src/Slider/Slider.spec.md +39 -18
- package/src/TabList/TabList.spec.md +57 -44
- package/src/TimeInput/TimeInput.fr10.test.tsx +15 -0
- package/src/ToggleButton/ToggleButton.test.tsx +95 -0
- package/src/ToggleButton/ToggleButton.tsx +12 -1
- package/src/TreeList/TreeList.doc.mjs +1 -0
- package/src/TreeList/TreeList.test.tsx +327 -6
- package/src/TreeList/TreeList.tsx +5 -1
- package/src/TreeList/TreeListBranches.tsx +6 -0
- package/src/TreeList/TreeListItem.tsx +88 -13
- package/src/docPropLiterals.test.ts +36 -10
- package/src/hooks/useMenuHover.ts +18 -13
- package/src/reset.css +0 -29
- package/src/theme/derivedVarRegistry.test.ts +7 -0
- package/src/utils/plainDate.test.ts +37 -1
- package/src/utils/plainDate.ts +15 -5
|
@@ -18,7 +18,7 @@ import { createElement } from 'react';
|
|
|
18
18
|
import * as stylex from '@stylexjs/stylex';
|
|
19
19
|
import "../theme/tokens.stylex.js";
|
|
20
20
|
import { colorVars, spacingVars, fontWeightVars, typeScaleVars } from "../theme/tokens.stylex.js";
|
|
21
|
-
import { mergeProps } from "../utils/index.js";
|
|
21
|
+
import { isRenderable, mergeProps } from "../utils/index.js";
|
|
22
22
|
import { themeProps } from "../utils/themeProps.js";
|
|
23
23
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
24
24
|
const styles = {
|
|
@@ -82,7 +82,7 @@ export function EmptyState({
|
|
|
82
82
|
...mergeProps(themeProps('empty-state', {
|
|
83
83
|
variant: isCompact ? 'compact' : null
|
|
84
84
|
}), stylex.props(styles.container, isCompact && styles.containerCompact, xstyle), className, style),
|
|
85
|
-
children: [icon
|
|
85
|
+
children: [isRenderable(icon) && /*#__PURE__*/_jsx("div", {
|
|
86
86
|
"aria-hidden": "true",
|
|
87
87
|
children: icon
|
|
88
88
|
}), /*#__PURE__*/_jsxs("div", {
|
|
@@ -98,13 +98,7 @@ export function EmptyState({
|
|
|
98
98
|
1: {
|
|
99
99
|
className: "x1ghz6dp xjb2p0i x2mo6ok xf74fhv x1tgivj0 xcr08ib"
|
|
100
100
|
}
|
|
101
|
-
}[!!isCompact << 0]), title), description
|
|
102
|
-
/*#__PURE__*/
|
|
103
|
-
// Rendered as <div> (not <p>): description accepts ReactNode and a
|
|
104
|
-
// <p> cannot legally contain block children, which causes hydration
|
|
105
|
-
// mismatches. The StyleX style sets margin: 0, so appearance is
|
|
106
|
-
// unchanged.
|
|
107
|
-
_jsx("div", {
|
|
101
|
+
}[!!isCompact << 0]), title), isRenderable(description) && /*#__PURE__*/_jsx("div", {
|
|
108
102
|
...mergeProps(themeProps('empty-state-description', {
|
|
109
103
|
variant: isCompact ? 'compact' : null
|
|
110
104
|
}), {
|
|
@@ -117,7 +111,7 @@ export function EmptyState({
|
|
|
117
111
|
}[!!isCompact << 0]),
|
|
118
112
|
children: description
|
|
119
113
|
})]
|
|
120
|
-
}), actions
|
|
114
|
+
}), isRenderable(actions) && /*#__PURE__*/_jsx("div", {
|
|
121
115
|
...{
|
|
122
116
|
0: {
|
|
123
117
|
className: "x78zum5 x1q0g3np x6s0dn4 x1txdalj xcsaf9d"
|
package/dist/Field/Field.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file Field.tsx
|
|
3
|
-
* @input Uses React,
|
|
3
|
+
* @input Uses React, StyleX, BaseProps, FieldLabel/FieldStatus, FormLayoutContext, Text, VisuallyHidden, theme/status utilities
|
|
4
4
|
* @output Exports Field component, FieldProps
|
|
5
5
|
* @position Core implementation; consumed by index.ts, tested by Field.test.tsx
|
|
6
6
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/Field/Field.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAM,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,4BAA4B,CAAC;AAGnE,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/Field/Field.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAM,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,4BAA4B,CAAC;AAGnE,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AA+DtC,YAAY,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAE9C,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AAE9D,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,IAAI,EAAE,eAAe,CAAC;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,UAAW,SAAQ,IAAI,CACtC,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;;OAGG;IACH,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,OAAO,EACP,OAAO,EACP,YAAoB,EACpB,aAAa,EACb,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,SAAS,EACT,MAAM,EACN,YAAY,EACZ,aAA0B,EAC1B,KAAK,EACL,MAAM,EACN,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,UAAU,+BA0HZ;yBAhJe,KAAK"}
|
package/dist/Field/Field.js
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* @file Field.tsx
|
|
7
|
-
* @input Uses React,
|
|
7
|
+
* @input Uses React, StyleX, BaseProps, FieldLabel/FieldStatus, FormLayoutContext, Text, VisuallyHidden, theme/status utilities
|
|
8
8
|
* @output Exports Field component, FieldProps
|
|
9
9
|
* @position Core implementation; consumed by index.ts, tested by Field.test.tsx
|
|
10
10
|
*
|
|
@@ -26,6 +26,7 @@ import { mergeProps } from "../utils/index.js";
|
|
|
26
26
|
import { useDevWarning } from "../hooks/useDevWarning.js";
|
|
27
27
|
import { FormLayoutContext } from "../FormLayout/FormLayoutContext.js";
|
|
28
28
|
import { Text } from "../Text/index.js";
|
|
29
|
+
import { VisuallyHidden } from "../VisuallyHidden/index.js";
|
|
29
30
|
import { themeProps } from "../utils/themeProps.js";
|
|
30
31
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
31
32
|
const styles = {
|
|
@@ -140,10 +141,10 @@ export function Field({
|
|
|
140
141
|
if (isHorizontalLabels) {
|
|
141
142
|
return /*#__PURE__*/_jsxs("div", {
|
|
142
143
|
ref: ref,
|
|
144
|
+
...props,
|
|
143
145
|
...mergeProps(themeProps('field', {
|
|
144
146
|
layout: 'horizontal-labels'
|
|
145
147
|
}), stylex.props(styles.horizontalLabels, xstyle), className, style),
|
|
146
|
-
...props,
|
|
147
148
|
children: [/*#__PURE__*/_jsx("div", {
|
|
148
149
|
...{
|
|
149
150
|
className: "x1enrzb7"
|
|
@@ -153,12 +154,15 @@ export function Field({
|
|
|
153
154
|
...{
|
|
154
155
|
className: "x78zum5 xdt5ytf xc8icb0 x19nvjgn xlumz0n x1qs65gq"
|
|
155
156
|
},
|
|
156
|
-
children: [description && /*#__PURE__*/_jsx(
|
|
157
|
+
children: [description && (isLabelHidden ? /*#__PURE__*/_jsx(VisuallyHidden, {
|
|
158
|
+
id: resolvedDescriptionID,
|
|
159
|
+
children: description
|
|
160
|
+
}) : /*#__PURE__*/_jsx(Text, {
|
|
157
161
|
type: "supporting",
|
|
158
162
|
display: "block",
|
|
159
163
|
id: resolvedDescriptionID,
|
|
160
164
|
children: description
|
|
161
|
-
}), children, statusNode]
|
|
165
|
+
})), children, statusNode]
|
|
162
166
|
})]
|
|
163
167
|
});
|
|
164
168
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GridSpan.d.ts","sourceRoot":"","sources":["../../src/Grid/GridSpan.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE1B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;
|
|
1
|
+
{"version":3,"file":"GridSpan.d.ts","sourceRoot":"","sources":["../../src/Grid/GridSpan.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE1B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAeD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,QAAQ,CAAC,EACvB,OAAO,EACP,IAAI,EACJ,MAAM,EACN,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,EACH,GAAG,KAAK,EACT,EAAE,aAAa,+BAwBf;yBAjCe,QAAQ"}
|
package/dist/Grid/GridSpan.js
CHANGED
package/dist/List/List.d.ts
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file List.tsx
|
|
3
|
-
* @input Uses React, ReactNode, StyleXStyles, theme tokens,
|
|
4
|
-
* with
|
|
5
|
-
* @output Exports List component, ListProps, ListDensity, ListStyle
|
|
3
|
+
* @input Uses React, ReactNode, StyleXStyles, theme tokens, useDevWarning,
|
|
4
|
+
* and ListContext with the row edge treatment
|
|
5
|
+
* @output Exports List component, ListProps, ListDensity, ListEdge, ListStyle
|
|
6
|
+
* types
|
|
6
7
|
* @position Core implementation; consumed by index.ts, tested by List.test.tsx
|
|
7
8
|
*
|
|
8
9
|
* SYNC: When modified, update these files to stay in sync:
|
|
@@ -14,8 +15,8 @@
|
|
|
14
15
|
*/
|
|
15
16
|
import { type ReactNode } from 'react';
|
|
16
17
|
import type { BaseProps } from '../BaseProps';
|
|
17
|
-
import { type ListDensity, type ListMarkerStyle } from './ListContext';
|
|
18
|
-
export { type ListDensity, type ListMarkerStyle as ListStyle, } from './ListContext';
|
|
18
|
+
import { type ListDensity, type ListEdge, type ListMarkerStyle } from './ListContext';
|
|
19
|
+
export { type ListDensity, type ListEdge, type ListMarkerStyle as ListStyle, } from './ListContext';
|
|
19
20
|
export interface ListProps extends BaseProps<HTMLUListElement | HTMLOListElement> {
|
|
20
21
|
/** Ref forwarded to the root element */
|
|
21
22
|
ref?: React.Ref<HTMLUListElement | HTMLOListElement>;
|
|
@@ -37,16 +38,38 @@ export interface ListProps extends BaseProps<HTMLUListElement | HTMLOListElement
|
|
|
37
38
|
*/
|
|
38
39
|
hasDividers?: boolean;
|
|
39
40
|
/**
|
|
40
|
-
*
|
|
41
|
-
*
|
|
42
|
-
*
|
|
43
|
-
*
|
|
44
|
-
*
|
|
45
|
-
*
|
|
46
|
-
*
|
|
47
|
-
*
|
|
48
|
-
*
|
|
49
|
-
*
|
|
41
|
+
* Where each row's text, dividers, and hover and selection backgrounds sit,
|
|
42
|
+
* relative to the list's edges and the container around it.
|
|
43
|
+
* - 'padded': text sits inside each row's padding, so it starts a little in
|
|
44
|
+
* from a heading above the list and backgrounds have room around it
|
|
45
|
+
* - 'flush': rows drop their side padding, so text starts on the heading's
|
|
46
|
+
* line and dividers and backgrounds stop at the row's content, with no
|
|
47
|
+
* room beyond it on either side. Works anywhere. Suits static rows
|
|
48
|
+
* - 'outset': text sits on the heading's line, and dividers and backgrounds
|
|
49
|
+
* reach a little past it into the container's padding. Suits interactive
|
|
50
|
+
* rows in a container
|
|
51
|
+
* - 'bleed': text sits on the heading's line, and dividers and backgrounds
|
|
52
|
+
* reach the container's edges with square corners, like Table rows in a
|
|
53
|
+
* Card
|
|
54
|
+
*
|
|
55
|
+
* A row's first content is what lines up with the heading: its marker,
|
|
56
|
+
* icon, or avatar when it has one, otherwise its label. 'outset' and
|
|
57
|
+
* 'bleed' reach into the padding of the nearest container that shares its
|
|
58
|
+
* padding: a Card, Section, Dialog, or BottomSheet, or a transparent
|
|
59
|
+
* container such as a Layout region with explicit padding or a padded
|
|
60
|
+
* ScrollableArea. Place the List directly in that container's padding:
|
|
61
|
+
* padding that Stack, Center, or your own styles add in between is not
|
|
62
|
+
* counted. Drawers and the automatic padding of LayoutContent and
|
|
63
|
+
* LayoutPanel aren't supported yet. With no such container, including in a Popover, they look
|
|
64
|
+
* like 'padded'. In a container with less padding than the rows' own, text
|
|
65
|
+
* starts a little after the heading's line. A theme's inline padding on `item` replaces the row
|
|
66
|
+
* padding of every value, including the zero padding of 'flush'.
|
|
67
|
+
* @default 'padded'
|
|
68
|
+
*/
|
|
69
|
+
edge?: ListEdge;
|
|
70
|
+
/**
|
|
71
|
+
* @deprecated Use `edge="outset"`, which this sets. Still works; `edge`
|
|
72
|
+
* wins when both are set. `astryx upgrade` rewrites existing usage.
|
|
50
73
|
*/
|
|
51
74
|
edgeCompensation?: 'inline';
|
|
52
75
|
/**
|
|
@@ -77,9 +100,10 @@ export interface ListProps extends BaseProps<HTMLUListElement | HTMLOListElement
|
|
|
77
100
|
* Renders semantic `<ul>` or `<ol>` elements with configurable density,
|
|
78
101
|
* dividers, marker styles, and an optional header.
|
|
79
102
|
*
|
|
80
|
-
* Set `
|
|
81
|
-
*
|
|
82
|
-
*
|
|
103
|
+
* Set `edge` to choose where row text, dividers, and backgrounds sit: inside
|
|
104
|
+
* each row's padding (`padded`, the default), at the list's edges (`flush`),
|
|
105
|
+
* on a heading's line with backgrounds reaching into the container's padding
|
|
106
|
+
* (`outset`), or reaching the container's edges like Table rows (`bleed`).
|
|
83
107
|
*
|
|
84
108
|
* @example
|
|
85
109
|
* ```
|
|
@@ -91,9 +115,12 @@ export interface ListProps extends BaseProps<HTMLUListElement | HTMLOListElement
|
|
|
91
115
|
* <ListItem label="First step" />
|
|
92
116
|
* <ListItem label="Second step" />
|
|
93
117
|
* </List>
|
|
118
|
+
* <List edge="flush" hasDividers>
|
|
119
|
+
* <ListItem label="Solstice Mug" description="Ceramic, 12 oz" />
|
|
120
|
+
* </List>
|
|
94
121
|
* ```
|
|
95
122
|
*/
|
|
96
|
-
export declare function List({ children, density, hasDividers, edgeCompensation, header, listStyle, start, xstyle, className, style, 'data-testid': testId, ref, ...props }: ListProps): import("react").JSX.Element;
|
|
123
|
+
export declare function List({ children, density, hasDividers, edge: edgeProp, edgeCompensation, header, listStyle, start, xstyle, className, style, 'data-testid': testId, ref, ...props }: ListProps): import("react").JSX.Element;
|
|
97
124
|
export declare namespace List {
|
|
98
125
|
var displayName: string;
|
|
99
126
|
}
|
package/dist/List/List.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../src/List/List.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../src/List/List.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAiB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAGrD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,EAEL,KAAK,WAAW,EAChB,KAAK,QAAQ,EACb,KAAK,eAAe,EACrB,MAAM,eAAe,CAAC;AAKvB,OAAO,EACL,KAAK,WAAW,EAChB,KAAK,QAAQ,EACb,KAAK,eAAe,IAAI,SAAS,GAClC,MAAM,eAAe,CAAC;AAEvB,MAAM,WAAW,SAAU,SAAQ,SAAS,CAC1C,gBAAgB,GAAG,gBAAgB,CACpC;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,GAAG,gBAAgB,CAAC,CAAC;IACrD;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,QAAQ,CAAC;IAE5B;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;;OAIG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;IAE5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAyDD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,OAAoB,EACpB,WAAmB,EACnB,IAAI,EAAE,QAAQ,EACd,gBAAgB,EAChB,MAAM,EACN,SAAkB,EAClB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,KAAK,EACT,EAAE,SAAS,+BAwEX;yBAvFe,IAAI"}
|
package/dist/List/List.js
CHANGED
|
@@ -4,9 +4,10 @@
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* @file List.tsx
|
|
7
|
-
* @input Uses React, ReactNode, StyleXStyles, theme tokens,
|
|
8
|
-
* with
|
|
9
|
-
* @output Exports List component, ListProps, ListDensity, ListStyle
|
|
7
|
+
* @input Uses React, ReactNode, StyleXStyles, theme tokens, useDevWarning,
|
|
8
|
+
* and ListContext with the row edge treatment
|
|
9
|
+
* @output Exports List component, ListProps, ListDensity, ListEdge, ListStyle
|
|
10
|
+
* types
|
|
10
11
|
* @position Core implementation; consumed by index.ts, tested by List.test.tsx
|
|
11
12
|
*
|
|
12
13
|
* SYNC: When modified, update these files to stay in sync:
|
|
@@ -23,6 +24,7 @@ import { spacingVars } from "../theme/tokens.stylex.js";
|
|
|
23
24
|
import { ListContext } from "./ListContext.js";
|
|
24
25
|
import { mergeProps } from "../utils/index.js";
|
|
25
26
|
import { themeProps } from "../utils/themeProps.js";
|
|
27
|
+
import { useDevWarning } from "../hooks/useDevWarning.js";
|
|
26
28
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
27
29
|
// =============================================================================
|
|
28
30
|
// Styles
|
|
@@ -39,6 +41,12 @@ const styles = {
|
|
|
39
41
|
kXHlph: "x101abm8",
|
|
40
42
|
$$css: true
|
|
41
43
|
},
|
|
44
|
+
reachesContainerPadding: {
|
|
45
|
+
keTefX: "xojxgvx",
|
|
46
|
+
k71WvV: "x1fcf3bl",
|
|
47
|
+
kzqmXN: "xx6qvi6",
|
|
48
|
+
$$css: true
|
|
49
|
+
},
|
|
42
50
|
withDividers: {
|
|
43
51
|
kOIVth: "xxhr3t",
|
|
44
52
|
$$css: true
|
|
@@ -68,9 +76,10 @@ const dynamicStyles = {
|
|
|
68
76
|
* Renders semantic `<ul>` or `<ol>` elements with configurable density,
|
|
69
77
|
* dividers, marker styles, and an optional header.
|
|
70
78
|
*
|
|
71
|
-
* Set `
|
|
72
|
-
*
|
|
73
|
-
*
|
|
79
|
+
* Set `edge` to choose where row text, dividers, and backgrounds sit: inside
|
|
80
|
+
* each row's padding (`padded`, the default), at the list's edges (`flush`),
|
|
81
|
+
* on a heading's line with backgrounds reaching into the container's padding
|
|
82
|
+
* (`outset`), or reaching the container's edges like Table rows (`bleed`).
|
|
74
83
|
*
|
|
75
84
|
* @example
|
|
76
85
|
* ```
|
|
@@ -82,12 +91,16 @@ const dynamicStyles = {
|
|
|
82
91
|
* <ListItem label="First step" />
|
|
83
92
|
* <ListItem label="Second step" />
|
|
84
93
|
* </List>
|
|
94
|
+
* <List edge="flush" hasDividers>
|
|
95
|
+
* <ListItem label="Solstice Mug" description="Ceramic, 12 oz" />
|
|
96
|
+
* </List>
|
|
85
97
|
* ```
|
|
86
98
|
*/
|
|
87
99
|
export function List({
|
|
88
100
|
children,
|
|
89
101
|
density = 'balanced',
|
|
90
102
|
hasDividers = false,
|
|
103
|
+
edge: edgeProp,
|
|
91
104
|
edgeCompensation,
|
|
92
105
|
header,
|
|
93
106
|
listStyle = 'none',
|
|
@@ -102,12 +115,17 @@ export function List({
|
|
|
102
115
|
const headerId = useId();
|
|
103
116
|
const isOrdered = listStyle === 'decimal';
|
|
104
117
|
const Tag = isOrdered ? 'ol' : 'ul';
|
|
118
|
+
// Plain use of the deprecated prop is reported by its @deprecated type;
|
|
119
|
+
// development warns only when the two names conflict (spec:AST-017 FR29).
|
|
120
|
+
useDevWarning('List', '`edge` and the deprecated `edgeCompensation` are both set; `edge` wins. ' + 'Remove `edgeCompensation`. `astryx upgrade` rewrites existing usage.', edgeProp != null && edgeCompensation != null);
|
|
121
|
+
const edge = edgeProp ?? (edgeCompensation === 'inline' ? 'outset' : 'padded');
|
|
122
|
+
const reachesContainerPadding = edge === 'outset' || edge === 'bleed';
|
|
105
123
|
const contextValue = useMemo(() => ({
|
|
106
124
|
density,
|
|
107
125
|
hasDividers,
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
}), [density, hasDividers,
|
|
126
|
+
edge,
|
|
127
|
+
listStyle
|
|
128
|
+
}), [density, hasDividers, edge, listStyle]);
|
|
111
129
|
const listElement = /*#__PURE__*/_jsx(Tag, {
|
|
112
130
|
ref: ref
|
|
113
131
|
// Consumer props first: everything the component sets for itself below
|
|
@@ -134,7 +152,7 @@ export function List({
|
|
|
134
152
|
...mergeProps(themeProps('list', {
|
|
135
153
|
density,
|
|
136
154
|
listStyle
|
|
137
|
-
}), stylex.props(styles.list, hasDividers && styles.withDividers, listStyle !== 'none' && (start != null && start !== 1 ? dynamicStyles.counterStart(start - 1) : styles.withCounter), xstyle), className, style),
|
|
155
|
+
}), stylex.props(styles.list, hasDividers && styles.withDividers, reachesContainerPadding && styles.reachesContainerPadding, listStyle !== 'none' && (start != null && start !== 1 ? dynamicStyles.counterStart(start - 1) : styles.withCounter), xstyle), className, style),
|
|
138
156
|
children: children
|
|
139
157
|
});
|
|
140
158
|
if (header == null) {
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file ListContext.tsx
|
|
3
3
|
* @input Layer-scoped React context
|
|
4
|
-
* @output Exports ListContext for sharing density, dividers,
|
|
5
|
-
* and
|
|
4
|
+
* @output Exports ListContext for sharing density, dividers, the row edge
|
|
5
|
+
* treatment, and marker style between List and ListItem, and
|
|
6
6
|
* ListMarkerScope, which sets the marker for the items inside it, or a
|
|
7
7
|
* task item's checkbox in its place
|
|
8
8
|
* @position Internal context; consumed by List.tsx and ListItem.tsx
|
|
@@ -10,6 +10,11 @@
|
|
|
10
10
|
import { type ReactNode } from 'react';
|
|
11
11
|
export type ListDensity = 'compact' | 'balanced' | 'spacious';
|
|
12
12
|
export type ListMarkerStyle = 'none' | 'disc' | 'decimal' | 'circle';
|
|
13
|
+
/**
|
|
14
|
+
* Where each row's content and its lines and backgrounds sit relative to the
|
|
15
|
+
* list's edges and the padding of the container around the list.
|
|
16
|
+
*/
|
|
17
|
+
export type ListEdge = 'padded' | 'flush' | 'outset' | 'bleed';
|
|
13
18
|
/**
|
|
14
19
|
* Every marker ListItem draws: the public styles, and the square, letter,
|
|
15
20
|
* and roman markers Markdown's nested lists use (spec:AST-061 DEC-6).
|
|
@@ -24,8 +29,8 @@ export interface ListTaskMarker {
|
|
|
24
29
|
export interface ListContextValue {
|
|
25
30
|
density: ListDensity;
|
|
26
31
|
hasDividers: boolean;
|
|
32
|
+
edge: ListEdge;
|
|
27
33
|
listStyle: ListMarkerStyle;
|
|
28
|
-
edgeCompensation?: 'inline';
|
|
29
34
|
/**
|
|
30
35
|
* The marker items draw instead of the one `listStyle` names, set by
|
|
31
36
|
* ListMarkerScope; internal. Ignored when `listStyle` is `'none'`.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListContext.d.ts","sourceRoot":"","sources":["../../src/List/ListContext.tsx"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AAEH,OAAO,EAAe,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAGnD,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;AAC9D,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAC;AAErE;;;GAGG;AACH,MAAM,MAAM,UAAU,GACpB,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,aAAa,GAAG,aAAa,CAAC;AAE3E,gFAAgF;AAChF,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B,uDAAuD;IACvD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,WAAW,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,
|
|
1
|
+
{"version":3,"file":"ListContext.d.ts","sourceRoot":"","sources":["../../src/List/ListContext.tsx"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AAEH,OAAO,EAAe,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAGnD,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;AAC9D,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAC;AAErE;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE/D;;;GAGG;AACH,MAAM,MAAM,UAAU,GACpB,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,aAAa,GAAG,aAAa,CAAC;AAE3E,gFAAgF;AAChF,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B,uDAAuD;IACvD,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,WAAW,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,IAAI,EAAE,QAAQ,CAAC;IACf,SAAS,EAAE,eAAe,CAAC;IAC3B;;;OAGG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB;;;;OAIG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC;CACvB;AAED,eAAO,MAAM,WAAW,kDAA+C,CAAC;AAGxE;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,IAAI,EACJ,QAAQ,GACT,EAAE;IACD,QAAQ,CAAC,MAAM,EAAE,UAAU,CAAC;IAC5B,QAAQ,CAAC,IAAI,CAAC,EAAE,cAAc,CAAC;IAC/B,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC;CAC9B,GAAG,SAAS,CAWZ"}
|
package/dist/List/ListContext.js
CHANGED
|
@@ -5,8 +5,8 @@
|
|
|
5
5
|
/**
|
|
6
6
|
* @file ListContext.tsx
|
|
7
7
|
* @input Layer-scoped React context
|
|
8
|
-
* @output Exports ListContext for sharing density, dividers,
|
|
9
|
-
* and
|
|
8
|
+
* @output Exports ListContext for sharing density, dividers, the row edge
|
|
9
|
+
* treatment, and marker style between List and ListItem, and
|
|
10
10
|
* ListMarkerScope, which sets the marker for the items inside it, or a
|
|
11
11
|
* task item's checkbox in its place
|
|
12
12
|
* @position Internal context; consumed by List.tsx and ListItem.tsx
|
|
@@ -14,6 +14,11 @@
|
|
|
14
14
|
import { use, useMemo } from 'react';
|
|
15
15
|
import { createLayerScopedContext as createContext } from "../Layer/layerScopedContext.js";
|
|
16
16
|
|
|
17
|
+
/**
|
|
18
|
+
* Where each row's content and its lines and backgrounds sit relative to the
|
|
19
|
+
* list's edges and the padding of the container around the list.
|
|
20
|
+
*/
|
|
21
|
+
|
|
17
22
|
/**
|
|
18
23
|
* Every marker ListItem draws: the public styles, and the square, letter,
|
|
19
24
|
* and roman markers Markdown's nested lists use (spec:AST-061 DEC-6).
|
package/dist/List/ListItem.d.ts
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file ListItem.tsx
|
|
3
|
-
* @input Uses React, ReactNode, StyleXStyles, theme tokens, List edge
|
|
4
|
-
* CheckboxInput, and the marker or task checkbox a
|
|
5
|
-
* (Markdown's nested lists and the task items of mixed
|
|
3
|
+
* @input Uses React, ReactNode, StyleXStyles, theme tokens, the List row edge
|
|
4
|
+
* treatment, CheckboxInput, and the marker or task checkbox a
|
|
5
|
+
* ListMarkerScope sets (Markdown's nested lists and the task items of mixed
|
|
6
|
+
* lists)
|
|
6
7
|
* @output Exports ListItem component, ListItemProps type
|
|
7
8
|
* @position Core implementation; consumed by List, index.ts, tested by List.test.tsx
|
|
8
9
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../src/List/ListItem.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../src/List/ListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,EAAM,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAS1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,OAAO,KAAK,EAAC,SAAS,EAAE,gBAAgB,EAAE,iBAAiB,EAAC,MAAM,SAAS,CAAC;AAO5E,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,aAAa,CAAC;IAC7D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;OAMG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;;OAGG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAExC;;;;;;;;OAQG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAErD;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAEhC;;;;OAIG;IACH,aAAa,CAAC,EAAE,iBAAiB,CAAC;CACnC;AAwJD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,WAAW,EACX,YAAY,EACZ,UAAU,EACV,OAAO,EACP,cAAc,EACd,IAAI,EACJ,MAAM,EACN,GAAG,EACH,UAAkB,EAClB,UAAkB,EAClB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,SAAS,EACb,EAAE,aAAa,+BA4Ef;yBA9Fe,QAAQ"}
|
package/dist/List/ListItem.js
CHANGED
|
@@ -4,9 +4,10 @@
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* @file ListItem.tsx
|
|
7
|
-
* @input Uses React, ReactNode, StyleXStyles, theme tokens, List edge
|
|
8
|
-
* CheckboxInput, and the marker or task checkbox a
|
|
9
|
-
* (Markdown's nested lists and the task items of mixed
|
|
7
|
+
* @input Uses React, ReactNode, StyleXStyles, theme tokens, the List row edge
|
|
8
|
+
* treatment, CheckboxInput, and the marker or task checkbox a
|
|
9
|
+
* ListMarkerScope sets (Markdown's nested lists and the task items of mixed
|
|
10
|
+
* lists)
|
|
10
11
|
* @output Exports ListItem component, ListItemProps type
|
|
11
12
|
* @position Core implementation; consumed by List, index.ts, tested by List.test.tsx
|
|
12
13
|
*
|
|
@@ -43,9 +44,19 @@ const styles = {
|
|
|
43
44
|
kAmcRD: "xfrknyr",
|
|
44
45
|
$$css: true
|
|
45
46
|
},
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
47
|
+
edgeFlush: {
|
|
48
|
+
"--_item-inset-inline": "x1nwg5ib",
|
|
49
|
+
$$css: true
|
|
50
|
+
},
|
|
51
|
+
edgeOutset: {
|
|
52
|
+
keTefX: "xch736x",
|
|
53
|
+
k71WvV: "x2gtn1o",
|
|
54
|
+
$$css: true
|
|
55
|
+
},
|
|
56
|
+
edgeBleed: {
|
|
57
|
+
kZCmMZ: "xua885n",
|
|
58
|
+
kwRFfy: "x1pyz5s7",
|
|
59
|
+
kaIpWk: "x2u8bby",
|
|
49
60
|
$$css: true
|
|
50
61
|
},
|
|
51
62
|
withDivider: {
|
|
@@ -165,8 +176,8 @@ export function ListItem({
|
|
|
165
176
|
const ctx = use(ListContext);
|
|
166
177
|
const density = ctx?.density ?? 'balanced';
|
|
167
178
|
const hasDividers = ctx?.hasDividers ?? false;
|
|
179
|
+
const edge = ctx?.edge ?? 'padded';
|
|
168
180
|
const listStyle = ctx?.listStyle ?? 'none';
|
|
169
|
-
const edgeCompensation = ctx?.edgeCompensation;
|
|
170
181
|
const hasMarkers = listStyle !== 'none';
|
|
171
182
|
// ListMarkerScope may name another marker for this item.
|
|
172
183
|
const markerKind = listStyle === 'none' ? null : ctx?.marker ?? listStyle;
|
|
@@ -211,7 +222,7 @@ export function ListItem({
|
|
|
211
222
|
isSelected: isSelected,
|
|
212
223
|
align: align,
|
|
213
224
|
density: density,
|
|
214
|
-
xstyle: [hasMarkers && styles.withCounter, hasDividers && styles.withDivider, hasDividers && embeddedStyles.noRadius,
|
|
225
|
+
xstyle: [hasMarkers && styles.withCounter, hasDividers && styles.withDivider, hasDividers && embeddedStyles.noRadius, edge === 'flush' && styles.edgeFlush, edge === 'outset' && styles.edgeOutset, edge === 'bleed' && styles.edgeBleed, xstyle],
|
|
215
226
|
...mergeProps(themeProps('list-item'), {
|
|
216
227
|
className,
|
|
217
228
|
style
|
package/dist/List/index.d.ts
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
* SYNC: When modified, update /packages/core/src/List/List.doc.mjs
|
|
8
8
|
*/
|
|
9
9
|
export { List } from './List';
|
|
10
|
-
export type { ListProps, ListStyle, ListDensity } from './List';
|
|
10
|
+
export type { ListProps, ListStyle, ListDensity, ListEdge } from './List';
|
|
11
11
|
export { ListItem } from './ListItem';
|
|
12
12
|
export type { ListItemProps } from './ListItem';
|
|
13
13
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/List/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/List/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAEH,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAC5B,YAAY,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAC,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/List/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAEH,OAAO,EAAC,IAAI,EAAC,MAAM,QAAQ,CAAC;AAC5B,YAAY,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAC,MAAM,QAAQ,CAAC;AACxE,OAAO,EAAC,QAAQ,EAAC,MAAM,YAAY,CAAC;AACpC,YAAY,EAAC,aAAa,EAAC,MAAM,YAAY,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../src/Markdown/Markdown.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../src/Markdown/Markdown.tsx"],"names":[],"mappings":"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"}
|
|
@@ -194,6 +194,12 @@ const markdownTableCellStyles = {
|
|
|
194
194
|
code: {
|
|
195
195
|
kTgw9: "x1lldw8n",
|
|
196
196
|
$$css: true
|
|
197
|
+
},
|
|
198
|
+
tableOuterEdge: {
|
|
199
|
+
kMzoRj: "x1litavf",
|
|
200
|
+
ksu8eU: "x1y0btm7",
|
|
201
|
+
kVAM5u: "x14i3s5s",
|
|
202
|
+
$$css: true
|
|
197
203
|
}
|
|
198
204
|
};
|
|
199
205
|
|
|
@@ -1222,8 +1228,9 @@ listDepth = 0) {
|
|
|
1222
1228
|
}), stylex.props(styles.tableWrapper, spacing, contentWidthValue != null ? dynamicStyles.blockWidth(contentWidthValue) : null, BLOCK_ALIGN_MARGIN[contentAlign] != null ? dynamicStyles.blockAlign(BLOCK_ALIGN_MARGIN[contentAlign]) : null, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd)),
|
|
1223
1229
|
...lineStamps,
|
|
1224
1230
|
children: /*#__PURE__*/_jsxs(Table, {
|
|
1225
|
-
dividers: "
|
|
1231
|
+
dividers: "grid",
|
|
1226
1232
|
textOverflow: "wrap",
|
|
1233
|
+
xstyle: markdownTableCellStyles.tableOuterEdge,
|
|
1227
1234
|
children: [/*#__PURE__*/_jsx(TableHeader, {
|
|
1228
1235
|
children: /*#__PURE__*/_jsx(TableRow, {
|
|
1229
1236
|
children: header?.children.map((h, i) => /*#__PURE__*/_jsx(TableHeaderCell
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetadataList.d.ts","sourceRoot":"","sources":["../../src/MetadataList/MetadataList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAqC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAQzE,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE9D,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAC7C,SAAS,CAAC,cAAc,CAAC,EACzB,OAAO,CACR;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,uBAAuB,CAAC;IAChC;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;;;;;OASG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAiGD,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,OAAkB,EAClB,KAAK,EACL,aAAa,EACb,WAAwB,EACxB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,SAAS,EACb,EAAE,iBAAiB,+
|
|
1
|
+
{"version":3,"file":"MetadataList.d.ts","sourceRoot":"","sources":["../../src/MetadataList/MetadataList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAqC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAQzE,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE9D,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAC7C,SAAS,CAAC,cAAc,CAAC,EACzB,OAAO,CACR;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,uBAAuB,CAAC;IAChC;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;;;;;OASG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAiGD,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,OAAkB,EAClB,KAAK,EACL,aAAa,EACb,WAAwB,EACxB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,SAAS,EACb,EAAE,iBAAiB,+BA8HnB;yBA3Ie,YAAY"}
|
|
@@ -129,7 +129,11 @@ export function MetadataList({
|
|
|
129
129
|
const isMultiColumn = columns === 'multi' || typeof columns === 'number' && columns > 1;
|
|
130
130
|
// Default to 'top' for multi-column and horizontal layouts since side labels
|
|
131
131
|
// don't work well when items are in separate grid cells.
|
|
132
|
-
const
|
|
132
|
+
const defaultLabelConfig = isMultiColumn ? LABEL_TOP : LABEL_START;
|
|
133
|
+
const labelConfig = useMemo(() => ({
|
|
134
|
+
...label,
|
|
135
|
+
position: label?.position ?? defaultLabelConfig.position
|
|
136
|
+
}), [label, defaultLabelConfig]);
|
|
133
137
|
const [isShowAll, setIsShowAll] = useState(false);
|
|
134
138
|
const contentId = useId();
|
|
135
139
|
const t = useTranslator();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetadataListContext.d.ts","sourceRoot":"","sources":["../../src/MetadataList/MetadataListContext.tsx"],"names":[],"mappings":"AAaA,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,OAAO,GAAG,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"MetadataListContext.d.ts","sourceRoot":"","sources":["../../src/MetadataList/MetadataListContext.tsx"],"names":[],"mappings":"AAaA,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,wBAAwB;IACvC,WAAW,EAAE,uBAAuB,CAAC;IACrC,WAAW,EAAE,UAAU,GAAG,YAAY,CAAC;CACxC;AAED,eAAO,MAAM,mBAAmB,0DACsB,CAAC"}
|
|
@@ -130,7 +130,7 @@ export interface RadioListProps extends Omit<FieldInputBaseProps<HTMLDivElement>
|
|
|
130
130
|
* </RadioList>
|
|
131
131
|
* ```
|
|
132
132
|
*/
|
|
133
|
-
export declare function RadioList({ ref, label, isLabelHidden, description, value, onChange, orientation, isDisabled, disabledMessage, isRequired, isOptional, size, status, labelTooltip, width, containerXstyle, containerClassName, containerStyle, controlXstyle, controlClassName, controlStyle, htmlName, children, onFocus, 'aria-describedby': ariaDescribedByProp, ...restProps }: RadioListProps): React.JSX.Element;
|
|
133
|
+
export declare function RadioList({ ref, label, isLabelHidden, description, value, onChange, orientation, isDisabled, disabledMessage, isRequired, isOptional, size, status, labelTooltip, width, containerXstyle, containerClassName, containerStyle, controlXstyle, controlClassName, controlStyle, htmlName, children, onFocus, 'aria-labelledby': ariaLabelledByProp, 'aria-describedby': ariaDescribedByProp, ...restProps }: RadioListProps): React.JSX.Element;
|
|
134
134
|
export declare namespace RadioList {
|
|
135
135
|
var displayName: string;
|
|
136
136
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioList.d.ts","sourceRoot":"","sources":["../../src/RadioList/RadioList.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAK,EAAE,EAKZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"RadioList.d.ts","sourceRoot":"","sources":["../../src/RadioList/RadioList.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAK,EAAE,EAKZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAKhD,OAAO,EACL,KAAK,mBAAmB,EAEzB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,CAAC;AAExC,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,kBAAkB,EAAE,OAAO,CAAC;IAC5B,UAAU,EAAE,OAAO,CAAC;IACpB,IAAI,EAAE,aAAa,CAAC;IACpB,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAED,eAAO,MAAM,gBAAgB,6CAE5B,CAAC;AAiBF,MAAM,WAAW,cAAe,SAAQ,IAAI,CAC1C,mBAAmB,CAAC,cAAc,CAAC,EACnC,UAAU,CACX;IACC,wDAAwD;IACxD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;OASG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,KAAK,EACL,QAAQ,EACR,WAAwB,EACxB,UAAkB,EAClB,eAAe,EACf,UAAkB,EAClB,UAAkB,EAClB,IAAW,EACX,MAAM,EACN,YAAY,EACZ,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,iBAAiB,EAAE,kBAAkB,EACrC,kBAAkB,EAAE,mBAAmB,EACvC,GAAG,SAAS,EACb,EAAE,cAAc,qBAoNhB;yBAhPe,SAAS"}
|