@stratakit/structures 0.2.0 → 0.2.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.
Files changed (5) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/Chip.d.ts +1 -1
  3. package/dist/DEV/TreeItem.js +30 -32
  4. package/dist/TreeItem.js +30 -32
  5. package/package.json +5 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # Changelog
2
2
 
3
+ ## 0.2.1
4
+
5
+ - [#736](https://github.com/iTwin/design-system/pull/736): Updated the `label` prop type in the `<Chip />` component from `string` to `ReactNode`.
6
+ - [#740](https://github.com/iTwin/design-system/pull/740): Added `types` field to `package.json` file for better TypeScript support and TS icon on `npm`.
7
+ - [#737](https://github.com/iTwin/design-system/pull/737): Fixed console warnings raised from `<Tree.Item>` component.
8
+ - Updated dependencies:
9
+ - @stratakit/foundations@0.1.5
10
+ - @stratakit/bricks@0.2.1
11
+
3
12
  ## 0.2.0
4
13
 
5
14
  ### Breaking changes
package/dist/Chip.d.ts CHANGED
@@ -4,7 +4,7 @@ interface ChipProps extends Omit<BaseProps<"div">, "children"> {
4
4
  /**
5
5
  * The label displayed inside the chip.
6
6
  */
7
- label: string;
7
+ label: React.ReactNode;
8
8
  /**
9
9
  * The variant style of the Chip.
10
10
  * Use "solid" for primary states and "outline" for less prominent states.
package/dist/DEV/TreeItem.js CHANGED
@@ -38,15 +38,17 @@ const TreeItemOverflowActionsContext = React.createContext(void 0);
38
38
  const TreeItemHasOverflowActionsContext = React.createContext(false);
39
39
  const TreeItem = React.memo(
40
40
  forwardRef((props, forwardedRef) => {
41
- const { expanded, selected } = props;
42
41
  const {
42
+ selected,
43
43
  onSelectedChange,
44
+ expanded,
44
45
  onExpandedChange,
45
46
  icon,
46
47
  unstable_decorations,
47
48
  label,
48
49
  description,
49
50
  actions,
51
+ error: _,
50
52
  onClick: onClickProp,
51
53
  onKeyDown: onKeyDownProp,
52
54
  ...rest
@@ -74,6 +76,8 @@ const TreeItem = React.memo(
74
76
  TreeItemRoot,
75
77
  {
76
78
  ...rest,
79
+ expanded,
80
+ selected,
77
81
  onClick: useEventHandlers(onClickProp, handleClick),
78
82
  onKeyDown: useEventHandlers(onKeyDownProp, handleKeyDown),
79
83
  ref: forwardedRef,
@@ -276,39 +280,33 @@ const arrowKeys = ["ArrowDown", "ArrowUp", "ArrowLeft", "ArrowRight"];
276
280
  const TreeItemActionsOverflowMenuContext = React.createContext(false);
277
281
  function TreeItemActionsOverflowMenu() {
278
282
  const overflow = React.useContext(TreeItemHasOverflowActionsContext);
279
- const [open, setOpen] = React.useState(false);
283
+ const [open, _setOpen] = React.useState(false);
280
284
  const isArrowKeyPressed = React.useRef(false);
285
+ const setOpen = React.useCallback((value) => {
286
+ if (value && !isArrowKeyPressed.current) {
287
+ _setOpen(true);
288
+ } else {
289
+ _setOpen(false);
290
+ }
291
+ }, []);
281
292
  if (!overflow) return null;
282
- return /* @__PURE__ */ jsx(PopoverProvider, { placement: "right-start", children: /* @__PURE__ */ jsxs(
283
- DropdownMenu.Root,
284
- {
285
- open,
286
- setOpen: React.useCallback((value) => {
287
- if (value && !isArrowKeyPressed.current) {
288
- setOpen(true);
289
- } else {
290
- setOpen(false);
291
- }
292
- }, []),
293
- children: [
294
- /* @__PURE__ */ jsx(
295
- DropdownMenu.Button,
296
- {
297
- onKeyDown: (e) => {
298
- if (arrowKeys.includes(e.key)) {
299
- isArrowKeyPressed.current = true;
300
- }
301
- queueMicrotask(() => {
302
- isArrowKeyPressed.current = false;
303
- });
304
- },
305
- render: /* @__PURE__ */ jsx(TreeItemAction, { label: "More", icon: /* @__PURE__ */ jsx(MoreHorizontal, {}) })
293
+ return /* @__PURE__ */ jsx(PopoverProvider, { placement: "right-start", children: /* @__PURE__ */ jsxs(DropdownMenu.Root, { open, setOpen, children: [
294
+ /* @__PURE__ */ jsx(
295
+ DropdownMenu.Button,
296
+ {
297
+ onKeyDown: (e) => {
298
+ if (arrowKeys.includes(e.key)) {
299
+ isArrowKeyPressed.current = true;
306
300
  }
307
- ),
308
- /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContext.Provider, { value: true, children: /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContent, {}) })
309
- ]
310
- }
311
- ) });
301
+ queueMicrotask(() => {
302
+ isArrowKeyPressed.current = false;
303
+ });
304
+ },
305
+ render: /* @__PURE__ */ jsx(TreeItemAction, { label: "More", icon: /* @__PURE__ */ jsx(MoreHorizontal, {}) })
306
+ }
307
+ ),
308
+ /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContext.Provider, { value: true, children: /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContent, {}) })
309
+ ] }) });
312
310
  }
313
311
  DEV: TreeItemActionsOverflowMenu.displayName = "TreeItemActionsOverflowMenu";
314
312
  function TreeItemActionsOverflowMenuContent() {
@@ -357,7 +355,7 @@ const TreeItemAction = React.memo(
357
355
  {
358
356
  label,
359
357
  icon,
360
- inert: visible === false ? true : void 0,
358
+ inert: visible === false ? "true" : void 0,
361
359
  ...rest,
362
360
  dot,
363
361
  variant: "ghost",
package/dist/TreeItem.js CHANGED
@@ -38,15 +38,17 @@ const TreeItemOverflowActionsContext = React.createContext(void 0);
38
38
  const TreeItemHasOverflowActionsContext = React.createContext(false);
39
39
  const TreeItem = React.memo(
40
40
  forwardRef((props, forwardedRef) => {
41
- const { expanded, selected } = props;
42
41
  const {
42
+ selected,
43
43
  onSelectedChange,
44
+ expanded,
44
45
  onExpandedChange,
45
46
  icon,
46
47
  unstable_decorations,
47
48
  label,
48
49
  description,
49
50
  actions,
51
+ error: _,
50
52
  onClick: onClickProp,
51
53
  onKeyDown: onKeyDownProp,
52
54
  ...rest
@@ -74,6 +76,8 @@ const TreeItem = React.memo(
74
76
  TreeItemRoot,
75
77
  {
76
78
  ...rest,
79
+ expanded,
80
+ selected,
77
81
  onClick: useEventHandlers(onClickProp, handleClick),
78
82
  onKeyDown: useEventHandlers(onKeyDownProp, handleKeyDown),
79
83
  ref: forwardedRef,
@@ -265,39 +269,33 @@ const arrowKeys = ["ArrowDown", "ArrowUp", "ArrowLeft", "ArrowRight"];
265
269
  const TreeItemActionsOverflowMenuContext = React.createContext(false);
266
270
  function TreeItemActionsOverflowMenu() {
267
271
  const overflow = React.useContext(TreeItemHasOverflowActionsContext);
268
- const [open, setOpen] = React.useState(false);
272
+ const [open, _setOpen] = React.useState(false);
269
273
  const isArrowKeyPressed = React.useRef(false);
274
+ const setOpen = React.useCallback((value) => {
275
+ if (value && !isArrowKeyPressed.current) {
276
+ _setOpen(true);
277
+ } else {
278
+ _setOpen(false);
279
+ }
280
+ }, []);
270
281
  if (!overflow) return null;
271
- return /* @__PURE__ */ jsx(PopoverProvider, { placement: "right-start", children: /* @__PURE__ */ jsxs(
272
- DropdownMenu.Root,
273
- {
274
- open,
275
- setOpen: React.useCallback((value) => {
276
- if (value && !isArrowKeyPressed.current) {
277
- setOpen(true);
278
- } else {
279
- setOpen(false);
280
- }
281
- }, []),
282
- children: [
283
- /* @__PURE__ */ jsx(
284
- DropdownMenu.Button,
285
- {
286
- onKeyDown: (e) => {
287
- if (arrowKeys.includes(e.key)) {
288
- isArrowKeyPressed.current = true;
289
- }
290
- queueMicrotask(() => {
291
- isArrowKeyPressed.current = false;
292
- });
293
- },
294
- render: /* @__PURE__ */ jsx(TreeItemAction, { label: "More", icon: /* @__PURE__ */ jsx(MoreHorizontal, {}) })
282
+ return /* @__PURE__ */ jsx(PopoverProvider, { placement: "right-start", children: /* @__PURE__ */ jsxs(DropdownMenu.Root, { open, setOpen, children: [
283
+ /* @__PURE__ */ jsx(
284
+ DropdownMenu.Button,
285
+ {
286
+ onKeyDown: (e) => {
287
+ if (arrowKeys.includes(e.key)) {
288
+ isArrowKeyPressed.current = true;
295
289
  }
296
- ),
297
- /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContext.Provider, { value: true, children: /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContent, {}) })
298
- ]
299
- }
300
- ) });
290
+ queueMicrotask(() => {
291
+ isArrowKeyPressed.current = false;
292
+ });
293
+ },
294
+ render: /* @__PURE__ */ jsx(TreeItemAction, { label: "More", icon: /* @__PURE__ */ jsx(MoreHorizontal, {}) })
295
+ }
296
+ ),
297
+ /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContext.Provider, { value: true, children: /* @__PURE__ */ jsx(TreeItemActionsOverflowMenuContent, {}) })
298
+ ] }) });
301
299
  }
302
300
  function TreeItemActionsOverflowMenuContent() {
303
301
  const actions = React.useContext(TreeItemOverflowActionsContext);
@@ -334,7 +332,7 @@ const TreeItemAction = React.memo(
334
332
  {
335
333
  label,
336
334
  icon,
337
- inert: visible === false ? true : void 0,
335
+ inert: visible === false ? "true" : void 0,
338
336
  ...rest,
339
337
  dot,
340
338
  variant: "ghost",
package/package.json CHANGED
@@ -1,9 +1,10 @@
1
1
  {
2
2
  "name": "@stratakit/structures",
3
3
  "type": "module",
4
- "version": "0.2.0",
4
+ "version": "0.2.1",
5
5
  "license": "MIT",
6
6
  "sideEffects": false,
7
+ "types": "./dist/index.d.ts",
7
8
  "exports": {
8
9
  ".": {
9
10
  "@stratakit/source": "./src/index.ts",
@@ -41,7 +42,7 @@
41
42
  ],
42
43
  "dependencies": {
43
44
  "@ariakit/react": "^0.4.17",
44
- "@stratakit/bricks": "^0.2.0",
45
+ "@stratakit/bricks": "^0.2.1",
45
46
  "classnames": "^2.5.1"
46
47
  },
47
48
  "devDependencies": {
@@ -52,10 +53,10 @@
52
53
  "react": "^19.1.0",
53
54
  "react-dom": "^19.1.0",
54
55
  "typescript": "~5.8.3",
55
- "@stratakit/foundations": "0.1.4"
56
+ "@stratakit/foundations": "0.1.5"
56
57
  },
57
58
  "peerDependencies": {
58
- "@stratakit/foundations": "^0.1.4",
59
+ "@stratakit/foundations": "^0.1.5",
59
60
  "react": ">=18.0.0",
60
61
  "react-dom": ">=18.0.0"
61
62
  },