@astryxdesign/core 0.4.4-canary.39d8a5a → 0.4.4-canary.ea7fc8c

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 (4) hide show
  1. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts.map +1 -1
  2. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +7 -2
  3. package/package.json +2 -2
  4. package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx +20 -2
package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useTableRowExpansion.d.ts","sourceRoot":"","sources":["../../../../src/Table/plugins/rowExpansion/useTableRowExpansion.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAkB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAMtD,OAAO,KAAK,EACV,WAAW,EAIZ,MAAM,aAAa,CAAC;AAMrB;;;;;;GAMG;AACH,MAAM,WAAW,0BAA0B,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC3E,0CAA0C;IAC1C,YAAY,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC1B,2DAA2D;IAC3D,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,kDAAkD;IAClD,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAC/B;;;OAGG;IACH,cAAc,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,SAAS,CAAC;IACvC;;;OAGG;IACH,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAC;CAC5C;AAoFD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,oBAAoB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACpE,MAAM,EAAE,0BAA0B,CAAC,CAAC,CAAC,GACpC,WAAW,CAAC,CAAC,CAAC,CAqIhB"}
1
+ {"version":3,"file":"useTableRowExpansion.d.ts","sourceRoot":"","sources":["../../../../src/Table/plugins/rowExpansion/useTableRowExpansion.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAkB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAOtD,OAAO,KAAK,EACV,WAAW,EAIZ,MAAM,aAAa,CAAC;AAMrB;;;;;;GAMG;AACH,MAAM,WAAW,0BAA0B,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC3E,0CAA0C;IAC1C,YAAY,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC1B,2DAA2D;IAC3D,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,kDAAkD;IAClD,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAC/B;;;OAGG;IACH,cAAc,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,SAAS,CAAC;IACvC;;;OAGG;IACH,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAC;CAC5C;AAkGD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,oBAAoB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACpE,MAAM,EAAE,0BAA0B,CAAC,CAAC,CAAC,GACpC,WAAW,CAAC,CAAC,CAAC,CAwIhB"}
package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js CHANGED
@@ -23,6 +23,7 @@ import { spacingVars, colorVars, radiusVars } from "../../../theme/tokens.stylex
23
23
  import { Icon } from "../../../Icon/index.js";
24
24
  import { resolveContextActions } from "../../tableContextMenu.js";
25
25
  import { useTranslator } from "../../../i18n/index.js";
26
+ import { rtlStyles } from "../../../utils/index.js";
26
27
 
27
28
  // =============================================================================
28
29
  // Config
@@ -57,10 +58,10 @@ function ExpansionChevron({
57
58
  type: "button",
58
59
  ...{
59
60
  0: {
60
- className: "x3nfvp2 x6s0dn4 xl56j7k x1mtvzj0 xvpftlf xx3sua9 x1ypdohk xv9yike x12pfavo xx6bhzk x1717udv x1ilzqfv x1cqbx0l"
61
+ className: "x3nfvp2 x6s0dn4 xl56j7k x1mtvzj0 xvpftlf xx3sua9 x1ypdohk xv9yike x12pfavo xx6bhzk x1717udv x1ilzqfv x1cqbx0l x7p49u4 xaafvuh"
61
62
  },
62
63
  1: {
63
- className: "x3nfvp2 x6s0dn4 xl56j7k x1mtvzj0 xvpftlf xx3sua9 x1ypdohk xv9yike x12pfavo xx6bhzk x1717udv x1ilzqfv x1cqbx0l x1iffjtl"
64
+ className: "x3nfvp2 x6s0dn4 xl56j7k x1mtvzj0 xvpftlf xx3sua9 x1ypdohk xv9yike x12pfavo xx6bhzk x1717udv x1ilzqfv x1cqbx0l x1iffjtl x1nxqau"
64
65
  }
65
66
  }[!!isExpanded << 0],
66
67
  onClick: e => {
@@ -162,6 +163,10 @@ export function useTableRowExpansion(config) {
162
163
  icon: isExpanded ? 'chevronDown' : 'chevronRight',
163
164
  size: "xsm",
164
165
  "aria-hidden": true
166
+ // chevronDown needs no mirroring; chevronRight (collapsed,
167
+ // pointing toward the reveal direction) does.
168
+ ,
169
+ xstyle: !isExpanded && rtlStyles.mirror
165
170
  }),
166
171
  onSelect: () => onToggle(key)
167
172
  }]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@astryxdesign/core",
3
- "version": "0.4.4-canary.39d8a5a",
3
+ "version": "0.4.4-canary.ea7fc8c",
4
4
  "displayName": "Astryx Core",
5
5
  "description": "The component library. Accessible, themeable React components with built-in spacing, dark mode, and StyleX styling.",
6
6
  "author": "Meta Open Source",
@@ -656,7 +656,7 @@
656
656
  "react-dom": ">=19.0.0"
657
657
  },
658
658
  "devDependencies": {
659
- "@astryxdesign/cli": "0.4.4-canary.39d8a5a",
659
+ "@astryxdesign/cli": "0.4.4-canary.ea7fc8c",
660
660
  "@babel/cli": "^8.0.4",
661
661
  "@babel/core": "^7.29.7",
662
662
  "@babel/preset-react": "^8.0.1",
package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx CHANGED
@@ -23,6 +23,7 @@ import {spacingVars, colorVars, radiusVars} from '../../../theme/tokens.stylex';
23
23
  import {Icon} from '../../../Icon';
24
24
  import {resolveContextActions} from '../../tableContextMenu';
25
25
  import {useTranslator} from '../../../i18n';
26
+ import {rtlStyles} from '../../../utils';
26
27
  import type {
27
28
  TablePlugin,
28
29
  TableColumn,
@@ -92,8 +93,20 @@ const expansionStyles = stylex.create({
92
93
  color: colorVars['--color-icon-primary'],
93
94
  },
94
95
  },
96
+ // The RTL mirror is folded into each state's transform rather than living
97
+ // on a parent span, matching TreeListItem's chevron (both are `transform`,
98
+ // so on one element the later value would win).
95
99
  chevronExpanded: {
96
- transform: 'rotate(90deg)',
100
+ transform: {
101
+ default: 'rotate(90deg)',
102
+ ':is([dir="rtl"] *)': 'scaleX(-1) rotate(90deg)',
103
+ },
104
+ },
105
+ chevronCollapsed: {
106
+ transform: {
107
+ default: 'rotate(0deg)',
108
+ ':is([dir="rtl"] *)': 'scaleX(-1) rotate(0deg)',
109
+ },
97
110
  },
98
111
  expandedRow: {
99
112
  backgroundColor: colorVars['--color-background-muted'],
@@ -121,7 +134,9 @@ function ExpansionChevron({
121
134
  type="button"
122
135
  {...stylex.props(
123
136
  expansionStyles.chevronButton,
124
- isExpanded && expansionStyles.chevronExpanded,
137
+ isExpanded
138
+ ? expansionStyles.chevronExpanded
139
+ : expansionStyles.chevronCollapsed,
125
140
  )}
126
141
  onClick={e => {
127
142
  e.stopPropagation();
@@ -249,6 +264,9 @@ export function useTableRowExpansion<T extends Record<string, unknown>>(
249
264
  icon={isExpanded ? 'chevronDown' : 'chevronRight'}
250
265
  size="xsm"
251
266
  aria-hidden
267
+ // chevronDown needs no mirroring; chevronRight (collapsed,
268
+ // pointing toward the reveal direction) does.
269
+ xstyle={!isExpanded && rtlStyles.mirror}
252
270
  />
253
271
  ),
254
272
  onSelect: () => onToggle(key),