@oxy.so/bloom 2.9.0 → 2.11.0

package/lib/commonjs/chip/Chip.js

@@ -8,48 +8,24 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _useTheme = require("../theme/use-theme.js");
 var _Typography = require("../typography/Typography.js");
-var _scale = require("../typography/scale.js");
 var _tokens = require("../styles/tokens.js");
-var _accentColors = require("../theme/accent-colors.js");
-var _hueColors = require("./hue-colors.js");
-var _pressColors = require("../theme/press-colors.js");
 var _useInteractionState = require("../hooks/use-interaction-state.js");
 var _RiCloseLine = require("../icons/remix/RiCloseLine.js");
 var _interactiveWebCss = require("../styles/interactive-web-css.js");
+var _shared = require("./shared.js");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /**
- * The chip, one Bloom size per emphasis level:
+ * The chip, five rungs and four fills. The rung table and the paint recipe are
+ * in `shared.ts` — including why `inverted` is a different idea rather than a
+ * fourth loudness, and why the scale had to grow past 28 (five families had
+ * drawn their own pill because it did not).
  *
- *   small   caption  caption-1-medium (12/16, tracking .15), py 4  → 24 tall
- *   medium  bold     body-medium (14/20),                   py 2  → 24 tall
- *   large   subtle   body-medium (14/20),                   py 4  → 28 tall
- *
- * All px 6. Bloom keeps the full pill, like `Button`, rather than a 6px corner.
- * The icon and close slots are Bloom's own, sized to
- * the label, with Remix's `close-line` (16) as the close glyph.
+ * Bloom keeps the full pill, like `Button`, rather than a 6px corner. The icon
+ * and close slots are Bloom's own, sized to the rung, with Remix's
+ * `close-line` (16) as the close glyph.
  */
 const CLOSE_ICON = 16;
-const SIZE_CONFIG = {
-  small: {
-    height: 24,
-    type: 'caption-1-medium',
-    paddingHorizontal: 6,
-    iconGap: 4
-  },
-  medium: {
-    height: 24,
-    type: 'body-medium',
-    paddingHorizontal: 6,
-    iconGap: 4
-  },
-  large: {
-    height: 28,
-    type: 'body-medium',
-    paddingHorizontal: 6,
-    iconGap: 4
-  }
-};
 
 // ---------------------------------------------------------------------------
 //  Keyboard focus on web
@@ -67,6 +43,15 @@ const SIZE_CONFIG = {
 //  attribute rather than a class because a class never reaches the DOM here:
 //  react-native-css consumes `className` into `style` before that could happen.
 //
+//  THE RING COLOUR IS THE ACCENT RAMP'S 500, not the chip's own label. It was
+//  the label, which is the one colour guaranteed to be invisible on the chip:
+//  a solid chip's ring was white on white (measured 1.09:1 in light mode, black
+//  on black in dark). Every other ring in the library — sidebar, menus, the map
+//  markers, the category bar, the filter pills — is `accent[500]`, and it is a
+//  ring on the PAGE, so it must contrast with what is behind the chip rather
+//  than with the chip. Nothing in jest can see this: the custom property is
+//  present, spelled correctly, and carries a real colour either way.
+//
 //  `adoptStyleSheet` no-ops without a `document`, so this file stays universal
 //  and native pays for a hook call and nothing else.
 // ---------------------------------------------------------------------------
@@ -93,10 +78,25 @@ const BLOOM_CHIP_CSS = (0, _interactiveWebCss.interactiveWebCss)({
   hover: {
     declarations: 'opacity: 0.9;'
   },
-  outlineOffset: 2
+  outlineOffset: 2,
+  extraRules: `
+/* The rung with a minWidth ("Any", "1", "8+" in a counts row) centres its
+   label. The style prop cannot say so: the reset above is an adopted sheet and
+   wins over react-native-web's atomic classes, so it has to be said here too. */
+[data-bloom-chip][data-bloom-chip-center] {
+  justify-content: center;
+}
+/* An inverted chip answers hover with its BORDER, in JS, because the colour is
+   a resolved token. The shared opacity hover would fire as well and fade the
+   label of a pill that has no fill to fade. The disabled filter is not optional:
+   without it this would undo the 0.5 a disabled chip is dimmed to, on hover. */
+[data-bloom-chip][data-bloom-chip-inverted]${_interactiveWebCss.NOT_DISABLED}:hover {
+  opacity: 1;
+}
+`
 });
 const IS_WEB = _reactNative.Platform.OS === 'web';
-const ChipComponent = ({
+const ChipComponent = /*#__PURE__*/(0, _react.forwardRef)(function ChipComponent({
   children,
   variant = 'subtle',
   color = 'default',
@@ -108,12 +108,15 @@ const ChipComponent = ({
   onPress,
   onClose,
   selected = false,
+  role = 'button',
   disabled = false,
+  tabIndex,
+  onKeyDown,
   style,
   textStyle,
   accessibilityLabel,
   testID
-}) => {
+}, ref) {
   const theme = (0, _useTheme.useTheme)();
   (0, _interactiveWebCss.useInteractiveWebCss)(STYLE_ID, BLOOM_CHIP_CSS);
   // No press scale, like `Button`: a press is the background change alone,
@@ -123,63 +126,65 @@ const ChipComponent = ({
     onIn: onPressIn,
     onOut: onPressOut
   } = (0, _useInteractionState.useInteractionState)();
-  // Selection promotes the chip to the brand tone \u2014 the filter-pill behaviour \u2014
-  // rather than to a second colour system of its own.
-  const colors = (0, _react.useMemo)(() => {
-    if (!hue || selected) return (0, _accentColors.resolveAccentColors)(theme.colors, selected ? 'primary' : color, variant);
-    const pair = (0, _hueColors.resolveChipHueColors)(theme, hue, surface);
-    return {
-      ...pair,
-      border: 'transparent'
-    };
-  }, [theme, hue, surface, selected, color, variant]);
-  const sizeConfig = SIZE_CONFIG[size];
-  // All three fills go through the one resolver and land somewhere different
-  // because their REST surfaces do: `solid` keeps its tone and gains a state
-  // layer of its own label colour, `subtle` deepens the tint AND its alpha
-  // rather than flattening it, `outlined` has no fill so the press IS the fill.
-  const pressedBackground = (0, _react.useMemo)(() => (0, _pressColors.pressedSurface)(theme.colors, colors.background, colors.foreground), [theme.colors, colors.background, colors.foreground]);
+  // Hover is JS only for the fill that answers it with a border colour; every
+  // other fill answers in CSS, and wiring the handlers unconditionally would
+  // re-render every chip in a tag list on pointer move for nothing.
+  const {
+    state: hovered,
+    onIn: onHoverIn,
+    onOut: onHoverOut
+  } = (0, _useInteractionState.useInteractionState)();
+  const paint = (0, _react.useMemo)(() => (0, _shared.resolveChipPaint)(theme, {
+    tone: color,
+    variant,
+    selected,
+    hue,
+    surface
+  }), [theme, color, variant, selected, hue, surface]);
+  const ring = (0, _react.useMemo)(() => (0, _shared.resolveChipRing)(theme), [theme]);
+  const geometry = _shared.CHIP_GEOMETRY[size];
   const containerStyle = (0, _react.useMemo)(() => ({
-    height: sizeConfig.height,
+    height: geometry.height,
     borderRadius: _tokens.borderRadius.full,
-    paddingHorizontal: sizeConfig.paddingHorizontal,
-    backgroundColor: colors.background,
-    borderWidth: variant === 'outlined' && !(hue && !selected) ? 1 : 0,
-    borderColor: colors.border,
+    paddingHorizontal: geometry.paddingHorizontal,
+    backgroundColor: paint.background,
+    borderWidth: paint.borderWidth,
+    borderColor: paint.border,
     flexDirection: 'row',
     alignItems: 'center',
-    gap: sizeConfig.iconGap,
+    gap: geometry.iconGap,
     alignSelf: 'flex-start',
+    ...(geometry.minWidth ? {
+      minWidth: geometry.minWidth,
+      justifyContent: 'center'
+    } : null),
     // A pill is a fixed-size token. In a flex row of chips (a filter bar, a tag
     // list) the default `flexShrink: 1` lets a long label squeeze its
-    // neighbours into ellipsis; shadcn's badge says the same thing as
-    // `shrink-0`. `overflow: hidden` keeps the content inside the radius.
+    // neighbours into ellipsis. `overflow: hidden` keeps the content inside the
+    // radius.
     flexShrink: 0,
     overflow: 'hidden',
     // The `:focus-visible` ring colour, read by the adopted sheet. A custom
     // property because the value is a resolved theme token the static sheet
     // cannot know; native has no such style key and ignores it.
-    '--bloom-chip-ring': colors.foreground
-  }), [sizeConfig, colors, variant, hue, selected]);
+    '--bloom-chip-ring': ring
+  }), [geometry, paint, ring]);
   const labelStyle = (0, _react.useMemo)(() => ({
-    color: colors.foreground,
+    color: paint.foreground,
     // The label yields before the pill does: a chip narrower than its text
     // ellipsises rather than overflowing its own radius.
     flexShrink: 1
-  }), [sizeConfig, colors]);
+  }), [paint]);
 
-  // Icons inside the pill are sized to the pill, not to whatever the caller
-  // happened to pass \u2014 shadcn's badge pins them with `[&>svg]:size-3`. A slot
-  // with a fixed box does the same thing without reaching into the child.
-  const iconSlotStyle = (0, _react.useMemo)(() => {
-    const box = Math.round(_scale.TYPE_SCALE[sizeConfig.type].fontSize * 1.15);
-    return {
-      width: box,
-      height: box,
-      alignItems: 'center',
-      justifyContent: 'center'
-    };
-  }, [sizeConfig]);
+  // Icons inside the pill are sized to the RUNG, not to whatever the caller
+  // happened to pass. A slot with a fixed box does that without reaching into
+  // the child.
+  const iconSlotStyle = (0, _react.useMemo)(() => ({
+    width: geometry.icon,
+    height: geometry.icon,
+    alignItems: 'center',
+    justifyContent: 'center'
+  }), [geometry]);
   const closeButton = onClose ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
     onPress: onClose,
     hitSlop: {
@@ -194,7 +199,7 @@ const ChipComponent = ({
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_RiCloseLine.RiCloseLine, {
       width: CLOSE_ICON,
       height: CLOSE_ICON,
-      fill: colors.foreground
+      fill: paint.foreground
     })
   }) : null;
   const content = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
@@ -202,7 +207,7 @@ const ChipComponent = ({
       style: iconSlotStyle,
       children: startIcon
     }) : null, typeof children === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.Text, {
-      variant: sizeConfig.type,
+      variant: geometry.type,
       numberOfLines: 1,
       style: [labelStyle, textStyle],
       children: children
@@ -212,59 +217,94 @@ const ChipComponent = ({
     }) : null, closeButton]
   });
   if (onPress) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable
-    // The DOM hook the adopted sheet above hangs off.
-    //
-    // It MUST go through `dataSet`. react-native-web filters props against
-    // a fixed list and drops anything it does not know, so a literal
-    // `'data-bloom-chip'` prop never reaches the DOM — measured in a real
-    // browser: the attribute was absent, the sheet matched nothing, and
-    // the ring that appeared under keyboard focus was Chrome's own default,
-    // which is exactly what a working ring looks like from a distance.
-    // `dataSet` is the one channel react-native-web turns into `data-*`.
-    //
-    // A cast because react-native has no type for it (it is a
-    // react-native-web prop, inert on native). Same web-only-attribute case
-    // as `TextField`'s DOM mouse handlers, registered in
-    // `classname-interop.test.ts`'s exemption list. It is NOT a `className`
-    // smuggled past `styled()`, which is what that gate forbids.
-    , {
+    // Both spellings of the state, because neither platform reads the other's
+    // and there is no single prop that serves both: react-native-web ignores
+    // `accessibilityState`, while React Native has no `aria-pressed` at all
+    // (its `AccessibilityState` is disabled/selected/checked/busy/expanded).
+    // WHICH attribute is a property of the ROLE, not a preference — a `radio`
+    // carries `aria-checked` and a `tab` `aria-selected`; `aria-pressed` on
+    // either is invalid, and `aria-selected` on a `button` is too.
+    const stateProps = role === 'radio' ? {
+      accessibilityState: {
+        checked: selected,
+        disabled
+      },
+      'aria-checked': selected
+    } : role === 'tab' ? {
+      accessibilityState: {
+        selected,
+        disabled
+      },
+      'aria-selected': selected
+    } : {
+      accessibilityState: {
+        disabled,
+        selected
+      },
+      'aria-pressed': selected
+    };
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
+      ref: ref
+      // The DOM hook the adopted sheet above hangs off.
+      //
+      // It MUST go through `dataSet`. react-native-web filters props against
+      // a fixed list and drops anything it does not know, so a literal
+      // `'data-bloom-chip'` prop never reaches the DOM — measured in a real
+      // browser: the attribute was absent, the sheet matched nothing, and
+      // the ring that appeared under keyboard focus was Chrome's own default,
+      // which is exactly what a working ring looks like from a distance.
+      // `dataSet` is the one channel react-native-web turns into `data-*`.
+      //
+      // A cast because react-native has no type for it (it is a
+      // react-native-web prop, inert on native). Same web-only-attribute case
+      // as `TextField`'s DOM mouse handlers, registered in
+      // `classname-interop.test.ts`'s exemption list. It is NOT a `className`
+      // smuggled past `styled()`, which is what that gate forbids.
+      ,
       ...(IS_WEB ? {
         dataSet: {
-          bloomChip: ''
-        }
+          bloomChip: '',
+          ...(geometry.minWidth ? {
+            bloomChipCenter: ''
+          } : null),
+          ...(variant === 'inverted' ? {
+            bloomChipInverted: ''
+          } : null)
+        },
+        ...(tabIndex !== undefined ? {
+          tabIndex
+        } : null),
+        ...(onKeyDown ? {
+          onKeyDown
+        } : null)
       } : {}),
       style: [containerStyle, disabled && {
         opacity: 0.5
-      },
+      }, hovered && !disabled && paint.hoveredBorder ? {
+        borderColor: paint.hoveredBorder
+      } : null,
       // Before the caller's `style`, so `style` still wins the array.
       pressed && !disabled && {
-        backgroundColor: pressedBackground
+        backgroundColor: paint.pressedBackground
       }, style],
       onPress: onPress,
       onPressIn: onPressIn,
       onPressOut: onPressOut,
+      ...(paint.hoveredBorder ? {
+        onHoverIn,
+        onHoverOut
+      } : null),
       disabled: disabled,
       accessibilityLabel: accessibilityLabel,
-      accessibilityRole: "button"
-      // Both spellings, because neither platform reads the other's and
-      // there is no single prop that serves both here: react-native-web
-      // ignores `accessibilityState`, while React Native has no
-      // `aria-pressed` at all (its `AccessibilityState` is
-      // disabled/selected/checked/busy/expanded). `aria-pressed` is also
-      // the state ARIA defines for a toggle with `role="button"` —
-      // `aria-selected` would be invalid on that role.
-      ,
-      accessibilityState: {
-        disabled,
-        selected
-      },
-      "aria-pressed": selected,
+      role: role,
+      ...stateProps,
+      "aria-disabled": disabled || undefined,
       testID: testID,
       children: content
     });
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    ref: ref,
     style: [containerStyle, disabled && {
       opacity: 0.5
     }, style],
@@ -272,7 +312,7 @@ const ChipComponent = ({
     testID: testID,
     children: content
   });
-};
+});
 const Chip = exports.Chip = /*#__PURE__*/(0, _react.memo)(ChipComponent);
 Chip.displayName = 'Chip';
 //# sourceMappingURL=Chip.js.map

package/lib/commonjs/chip/Chip.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_useTheme","_Typography","_scale","_tokens","_accentColors","_hueColors","_pressColors","_useInteractionState","_RiCloseLine","_interactiveWebCss","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","CLOSE_ICON","SIZE_CONFIG","small","height","type","paddingHorizontal","iconGap","medium","large","STYLE_ID","BLOOM_CHIP_CSS","interactiveWebCss","selector","varPrefix","base","transition","hover","declarations","outlineOffset","IS_WEB","Platform","OS","ChipComponent","children","variant","color","hue","surface","size","startIcon","endIcon","onPress","onClose","selected","disabled","style","textStyle","accessibilityLabel","testID","theme","useTheme","useInteractiveWebCss","state","pressed","onIn","onPressIn","onOut","onPressOut","useInteractionState","colors","useMemo","resolveAccentColors","pair","resolveChipHueColors","border","sizeConfig","pressedBackground","pressedSurface","background","foreground","containerStyle","borderRadius","full","backgroundColor","borderWidth","borderColor","flexDirection","alignItems","gap","alignSelf","flexShrink","overflow","labelStyle","iconSlotStyle","box","Math","round","TYPE_SCALE","fontSize","width","justifyContent","closeButton","jsx","Pressable","hitSlop","top","bottom","left","right","accessibilityRole","RiCloseLine","fill","content","jsxs","Fragment","View","Text","numberOfLines","dataSet","bloomChip","opacity","accessibilityState","Chip","exports","memo","displayName"],"sourceRoot":"../../../src","sources":["chip/Chip.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_useTheme","_Typography","_tokens","_useInteractionState","_RiCloseLine","_interactiveWebCss","_shared","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","CLOSE_ICON","STYLE_ID","BLOOM_CHIP_CSS","interactiveWebCss","selector","varPrefix","base","transition","hover","declarations","outlineOffset","extraRules","NOT_DISABLED","IS_WEB","Platform","OS","ChipComponent","forwardRef","children","variant","color","hue","surface","size","startIcon","endIcon","onPress","onClose","selected","role","disabled","tabIndex","onKeyDown","style","textStyle","accessibilityLabel","testID","ref","theme","useTheme","useInteractiveWebCss","state","pressed","onIn","onPressIn","onOut","onPressOut","useInteractionState","hovered","onHoverIn","onHoverOut","paint","useMemo","resolveChipPaint","tone","ring","resolveChipRing","geometry","CHIP_GEOMETRY","containerStyle","height","borderRadius","full","paddingHorizontal","backgroundColor","background","borderWidth","borderColor","border","flexDirection","alignItems","gap","iconGap","alignSelf","minWidth","justifyContent","flexShrink","overflow","labelStyle","foreground","iconSlotStyle","width","icon","closeButton","jsx","Pressable","hitSlop","top","bottom","left","right","accessibilityRole","RiCloseLine","fill","content","jsxs","Fragment","View","Text","type","numberOfLines","stateProps","accessibilityState","checked","dataSet","bloomChip","bloomChipCenter","bloomChipInverted","undefined","opacity","hoveredBorder","pressedBackground","Chip","exports","memo","displayName"],"sourceRoot":"../../../src","sources":["chip/Chip.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAQA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AACA,IAAAK,oBAAA,GAAAL,OAAA;AACA,IAAAM,YAAA,GAAAN,OAAA;AACA,IAAAO,kBAAA,GAAAP,OAAA;AAEA,IAAAQ,OAAA,GAAAR,OAAA;AAA4E,IAAAS,WAAA,GAAAT,OAAA;AAAA,SAAAD,wBAAAW,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAb,uBAAA,YAAAA,CAAAW,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAG5E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMkB,UAAU,GAAG,EAAE;;AAErB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,MAAMC,QAAQ,GAAG,oBAAoB;AAErC,MAAMC,cAAc,GAAG,IAAAC,oCAAiB,EAAC;EACvCC,QAAQ,EAAE,mBAAmB;EAC7BC,SAAS,EAAE,YAAY;EACvB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACAC,IAAI,EAAE;AACR;AACA;AACA;AACA;AACA,GAAG;EACDC,UAAU,EAAE,0EAA0E;EACtFC,KAAK,EAAE;IAAEC,YAAY,EAAE;EAAgB,CAAC;EACxCC,aAAa,EAAE,CAAC;EAChBC,UAAU,EAAE;AACd;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,6CAA6CC,+BAAY;AACzD;AACA;AACA;AACA,CAAC,CAAC;AAEF,MAAMC,MAAM,GAAGC,qBAAQ,CAACC,EAAE,KAAK,KAAK;AAEpC,MAAMC,aAAa,gBAAG,IAAAC,iBAAU,EAAkB,SAASD,aAAaA,CACtE;EACEE,QAAQ;EACRC,OAAO,GAAG,QAAQ;EAClBC,KAAK,GAAG,SAAS;EACjBC,GAAG;EACHC,OAAO;EACPC,IAAI,GAAG,QAAQ;EACfC,SAAS;EACTC,OAAO;EACPC,OAAO;EACPC,OAAO;EACPC,QAAQ,GAAG,KAAK;EAChBC,IAAI,GAAG,QAAQ;EACfC,QAAQ,GAAG,KAAK;EAChBC,QAAQ;EACRC,SAAS;EACTC,KAAK;EACLC,SAAS;EACTC,kBAAkB;EAClBC;AACF,CAAC,EACDC,GAAG,EACH;EACA,MAAMC,KAAK,GAAG,IAAAC,kBAAQ,EAAC,CAAC;EACxB,IAAAC,uCAAoB,EAACvC,QAAQ,EAAEC,cAAc,CAAC;EAC9C;EACA;EACA,MAAM;IAAEuC,KAAK,EAAEC,OAAO;IAAEC,IAAI,EAAEC,SAAS;IAAEC,KAAK,EAAEC;EAAW,CAAC,GAAG,IAAAC,wCAAmB,EAAC,CAAC;EACpF;EACA;EACA;EACA,MAAM;IAAEN,KAAK,EAAEO,OAAO;IAAEL,IAAI,EAAEM,SAAS;IAAEJ,KAAK,EAAEK;EAAW,CAAC,GAAG,IAAAH,wCAAmB,EAAC,CAAC;EACpF,MAAMI,KAAK,GAAG,IAAAC,cAAO,EACnB,MAAM,IAAAC,wBAAgB,EAACf,KAAK,EAAE;IAAEgB,IAAI,EAAElC,KAAK;IAAED,OAAO;IAAES,QAAQ;IAAEP,GAAG;IAAEC;EAAQ,CAAC,CAAC,EAC/E,CAACgB,KAAK,EAAElB,KAAK,EAAED,OAAO,EAAES,QAAQ,EAAEP,GAAG,EAAEC,OAAO,CAChD,CAAC;EACD,MAAMiC,IAAI,GAAG,IAAAH,cAAO,EAAC,MAAM,IAAAI,uBAAe,EAAClB,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAC3D,MAAMmB,QAAQ,GAAGC,qBAAa,CAACnC,IAAI,CAAC;EAEpC,MAAMoC,cAAc,GAAG,IAAAP,cAAO,EAAC,OAAoB;IACjDQ,MAAM,EAAEH,QAAQ,CAACG,MAAM;IACvBC,YAAY,EAAEA,oBAAY,CAACC,IAAI;IAC/BC,iBAAiB,EAAEN,QAAQ,CAACM,iBAAiB;IAC7CC,eAAe,EAAEb,KAAK,CAACc,UAAU;IACjCC,WAAW,EAAEf,KAAK,CAACe,WAAW;IAC9BC,WAAW,EAAEhB,KAAK,CAACiB,MAAM;IACzBC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,GAAG,EAAEd,QAAQ,CAACe,OAAO;IACrBC,SAAS,EAAE,YAAY;IACvB,IAAIhB,QAAQ,CAACiB,QAAQ,GAAG;MAAEA,QAAQ,EAAEjB,QAAQ,CAACiB,QAAQ;MAAEC,cAAc,EAAE;IAAS,CAAC,GAAG,IAAI,CAAC;IACzF;IACA;IACA;IACA;IACAC,UAAU,EAAE,CAAC;IACbC,QAAQ,EAAE,QAAQ;IAClB;IACA;IACA;IACA,mBAAmB,EAAEtB;EACvB,CAAC,CAAC,EAAE,CAACE,QAAQ,EAAEN,KAAK,EAAEI,IAAI,CAAC,CAAC;EAE5B,MAAMuB,UAAU,GAAG,IAAA1B,cAAO,EAAC,OAAkB;IAC3ChC,KAAK,EAAE+B,KAAK,CAAC4B,UAAU;IACvB;IACA;IACAH,UAAU,EAAE;EACd,CAAC,CAAC,EAAE,CAACzB,KAAK,CAAC,CAAC;;EAEZ;EACA;EACA;EACA,MAAM6B,aAAa,GAAG,IAAA5B,cAAO,EAC3B,OAAkB;IAChB6B,KAAK,EAAExB,QAAQ,CAACyB,IAAI;IACpBtB,MAAM,EAAEH,QAAQ,CAACyB,IAAI;IACrBZ,UAAU,EAAE,QAAQ;IACpBK,cAAc,EAAE;EAClB,CAAC,CAAC,EACF,CAAClB,QAAQ,CACX,CAAC;EAED,MAAM0B,WAAW,GAAGxD,OAAO,gBACzB,IAAA/C,WAAA,CAAAwG,GAAA,EAAChH,YAAA,CAAAiH,SAAS;IACR3D,OAAO,EAAEC,OAAQ;IACjB2D,OAAO,EAAE;MAAEC,GAAG,EAAE,CAAC;MAAEC,MAAM,EAAE,CAAC;MAAEC,IAAI,EAAE,CAAC;MAAEC,KAAK,EAAE;IAAE,CAAE;IAClDvD,kBAAkB,EAAC,QAAQ;IAC3BwD,iBAAiB,EAAC,QAAQ;IAC1B1D,KAAK,EAAE+C,aAAc;IAAA9D,QAAA,eAErB,IAAAtC,WAAA,CAAAwG,GAAA,EAAC3G,YAAA,CAAAmH,WAAW;MAACX,KAAK,EAAEjF,UAAW;MAAC4D,MAAM,EAAE5D,UAAW;MAAC6F,IAAI,EAAE1C,KAAK,CAAC4B;IAAW,CAAE;EAAC,CACrE,CAAC,GACV,IAAI;EAER,MAAMe,OAAO,gBACX,IAAAlH,WAAA,CAAAmH,IAAA,EAAAnH,WAAA,CAAAoH,QAAA;IAAA9E,QAAA,GACGM,SAAS,IAAI,IAAI,gBAAG,IAAA5C,WAAA,CAAAwG,GAAA,EAAChH,YAAA,CAAA6H,IAAI;MAAChE,KAAK,EAAE+C,aAAc;MAAA9D,QAAA,EAAEM;IAAS,CAAO,CAAC,GAAG,IAAI,EACzE,OAAON,QAAQ,KAAK,QAAQ,gBAC3B,IAAAtC,WAAA,CAAAwG,GAAA,EAAC9G,WAAA,CAAA4H,IAAI;MAAC/E,OAAO,EAAEsC,QAAQ,CAAC0C,IAAK;MAACC,aAAa,EAAE,CAAE;MAACnE,KAAK,EAAE,CAAC6C,UAAU,EAAE5C,SAAS,CAAE;MAAAhB,QAAA,EAC5EA;IAAQ,CACL,CAAC,GAEPA,QACD,EACAO,OAAO,IAAI,IAAI,gBAAG,IAAA7C,WAAA,CAAAwG,GAAA,EAAChH,YAAA,CAAA6H,IAAI;MAAChE,KAAK,EAAE+C,aAAc;MAAA9D,QAAA,EAAEO;IAAO,CAAO,CAAC,GAAG,IAAI,EACrE0D,WAAW;EAAA,CACZ,CACH;EAED,IAAIzD,OAAO,EAAE;IACX;IACA;IACA;IACA;IACA;IACA;IACA;IACA,MAAM2E,UAAU,GACdxE,IAAI,KAAK,OAAO,GACZ;MAAEyE,kBAAkB,EAAE;QAAEC,OAAO,EAAE3E,QAAQ;QAAEE;MAAS,CAAC;MAAE,cAAc,EAAEF;IAAS,CAAC,GACjFC,IAAI,KAAK,KAAK,GACZ;MAAEyE,kBAAkB,EAAE;QAAE1E,QAAQ;QAAEE;MAAS,CAAC;MAAE,eAAe,EAAEF;IAAS,CAAC,GACzE;MAAE0E,kBAAkB,EAAE;QAAExE,QAAQ;QAAEF;MAAS,CAAC;MAAE,cAAc,EAAEA;IAAS,CAAC;IAEhF,oBACE,IAAAhD,WAAA,CAAAwG,GAAA,EAAChH,YAAA,CAAAiH,SAAS;MACRhD,GAAG,EAAEA;MACL;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MAAA;MAAA,IACKxB,MAAM,GACN;QACC2F,OAAO,EAAE;UACPC,SAAS,EAAE,EAAE;UACb,IAAIhD,QAAQ,CAACiB,QAAQ,GAAG;YAAEgC,eAAe,EAAE;UAAG,CAAC,GAAG,IAAI,CAAC;UACvD,IAAIvF,OAAO,KAAK,UAAU,GAAG;YAAEwF,iBAAiB,EAAE;UAAG,CAAC,GAAG,IAAI;QAC/D,CAAC;QACD,IAAI5E,QAAQ,KAAK6E,SAAS,GAAG;UAAE7E;QAAS,CAAC,GAAG,IAAI,CAAC;QACjD,IAAIC,SAAS,GAAG;UAAEA;QAAU,CAAC,GAAG,IAAI;MACtC,CAAC,GACD,CAAC,CAAC;MACNC,KAAK,EAAE,CACL0B,cAAc,EACd7B,QAAQ,IAAI;QAAE+E,OAAO,EAAE;MAAI,CAAC,EAC5B7D,OAAO,IAAI,CAAClB,QAAQ,IAAIqB,KAAK,CAAC2D,aAAa,GAAG;QAAE3C,WAAW,EAAEhB,KAAK,CAAC2D;MAAc,CAAC,GAAG,IAAI;MACzF;MACApE,OAAO,IAAI,CAACZ,QAAQ,IAAI;QAAEkC,eAAe,EAAEb,KAAK,CAAC4D;MAAkB,CAAC,EACpE9E,KAAK,CACL;MACFP,OAAO,EAAEA,OAAQ;MACjBkB,SAAS,EAAEA,SAAU;MACrBE,UAAU,EAAEA,UAAW;MAAA,IAClBK,KAAK,CAAC2D,aAAa,GAAG;QAAE7D,SAAS;QAAEC;MAAW,CAAC,GAAG,IAAI;MAC3DpB,QAAQ,EAAEA,QAAS;MACnBK,kBAAkB,EAAEA,kBAAmB;MACvCN,IAAI,EAAEA,IAAK;MAAA,GACPwE,UAAU;MACd,iBAAevE,QAAQ,IAAI8E,SAAU;MACrCxE,MAAM,EAAEA,MAAO;MAAAlB,QAAA,EAEd4E;IAAO,CACC,CAAC;EAEhB;EAEA,oBACE,IAAAlH,WAAA,CAAAwG,GAAA,EAAChH,YAAA,CAAA6H,IAAI;IACH5D,GAAG,EAAEA,GAAI;IACTJ,KAAK,EAAE,CAAC0B,cAAc,EAAE7B,QAAQ,IAAI;MAAE+E,OAAO,EAAE;IAAI,CAAC,EAAE5E,KAAK,CAAE;IAC7DE,kBAAkB,EAAEA,kBAAmB;IACvCC,MAAM,EAAEA,MAAO;IAAAlB,QAAA,EAEd4E;EAAO,CACJ,CAAC;AAEX,CAAC,CAAC;AAEK,MAAMkB,IAAI,GAAAC,OAAA,CAAAD,IAAA,gBAAG,IAAAE,WAAI,EAAClG,aAAa,CAAC;AACvCgG,IAAI,CAACG,WAAW,GAAG,MAAM","ignoreList":[]}

package/lib/commonjs/chip/ChipRow.js

@@ -0,0 +1,182 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ChipRow = exports.CHIP_ROW_EDGE = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _adoptStyleSheet = require("../styles/adopt-style-sheet.js");
+var _useTheme = require("../theme/use-theme.js");
+var _shared = require("./shared.js");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+/**
+ * A row of pills that scrolls sideways, with a fade at whichever edge has more
+ * behind it.
+ *
+ * The fade is the thing worth sharing. Without it a clipped pill just stops
+ * mid-glyph and reads as a rendering fault rather than as "there is more"; the
+ * row `category-bar` draws is the only place in the library that had one, and
+ * five filter rows were scrolling without it. The gradient resolves into
+ * `fadeColor` — the surface BEHIND the row, which the row cannot know — so a
+ * caller on a card must say so or the fade will blend into the page instead.
+ *
+ * Web only, and deliberately: the fade is painted with a CSS gradient, and on
+ * native a scroll row already shows its own bounce. The row scrolls on both.
+ *
+ * `ringInset` keeps room on every side for a pill's focus ring and takes it
+ * back out with negative margins, so the row still lines up with the heading
+ * above it — a ring clipped by its own scroller is the usual way a focus
+ * outline half-disappears.
+ *
+ * Semantics belong to the CALLER: pass `role` and `accessibilityLabel` that
+ * match what the pills are (`group` of toggles, `radiogroup`, `tablist`). The
+ * row draws nothing of its own that assistive technology should see.
+ */
+
+const IS_WEB = _reactNative.Platform.OS === 'web';
+
+/** Width of each edge's fade. */
+const CHIP_ROW_EDGE = exports.CHIP_ROW_EDGE = 40;
+const STYLE_ID = 'bloom-chip-row-web-css';
+const TRACK = '[data-bloom-chip-row-track]';
+const BLOOM_CHIP_ROW_CSS = `
+${TRACK} {
+  scrollbar-width: none;
+  overscroll-behavior-x: contain;
+}
+${TRACK}::-webkit-scrollbar {
+  display: none;
+}
+`;
+function ChipRowComponent({
+  children,
+  gap = 8,
+  contentInset = 0,
+  fadeColor,
+  ringInset = 4,
+  role = 'group',
+  accessibilityLabel,
+  disabled,
+  style,
+  contentContainerStyle,
+  testID
+}) {
+  const theme = (0, _useTheme.useTheme)();
+  _react.default.useEffect(() => {
+    (0, _adoptStyleSheet.adoptStyleSheet)(STYLE_ID, BLOOM_CHIP_ROW_CSS);
+  }, []);
+  const [scroll, setScroll] = (0, _react.useState)({
+    x: 0,
+    viewport: 0,
+    content: 0
+  });
+  const overflow = (0, _react.useMemo)(() => (0, _shared.chipRowOverflow)(scroll), [scroll]);
+  const fade = fadeColor ?? theme.colors.background;
+  const onScroll = (0, _react.useCallback)(event => {
+    const {
+      contentOffset,
+      layoutMeasurement,
+      contentSize
+    } = event.nativeEvent;
+    setScroll({
+      x: contentOffset.x,
+      viewport: layoutMeasurement.width,
+      content: contentSize.width
+    });
+  }, []);
+  const onLayout = (0, _react.useCallback)(event => {
+    const {
+      width
+    } = event.nativeEvent.layout;
+    setScroll(previous => previous.viewport === width ? previous : {
+      ...previous,
+      viewport: width
+    });
+  }, []);
+  const onContentSizeChange = (0, _react.useCallback)(width => {
+    setScroll(previous => previous.content === width ? previous : {
+      ...previous,
+      content: width
+    });
+  }, []);
+
+  // The fade has to cover the SCROLLER, which sits `ringInset` outside the
+  // wrapper on every side (the negative margins above). Pinned to the wrapper's
+  // own edge instead, it leaves exactly that much uncovered, and a chip clipped
+  // by those few pixels reads as a hard cut with a fade beside it — measured in
+  // Chrome at 4px, which is enough to see.
+  const edgeStyle = side => ({
+    position: 'absolute',
+    top: -ringInset,
+    bottom: -ringInset,
+    ...(side === 'left' ? {
+      left: -ringInset
+    } : {
+      right: -ringInset
+    }),
+    width: CHIP_ROW_EDGE,
+    backgroundImage: `linear-gradient(to ${side === 'left' ? 'right' : 'left'}, ${fade} 0%, ${fade} 40%, transparent 100%)`
+  });
+  return (
+    /*#__PURE__*/
+    // The ROLE and the name go on the wrapper, not the scroller: the wrapper is
+    // the element a caller's `testID` lands on, and a group whose semantics
+    // hide one node deeper is a group every consumer's test misses.
+    (0, _jsxRuntime.jsxs)(_reactNative.View, {
+      role: role,
+      accessibilityLabel: accessibilityLabel,
+      "aria-disabled": disabled || undefined,
+      style: [{
+        position: 'relative'
+      }, style],
+      testID: testID,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, {
+        ...(IS_WEB ? {
+          dataSet: {
+            bloomChipRowTrack: ''
+          }
+        } : {}),
+        horizontal: true,
+        showsHorizontalScrollIndicator: false,
+        scrollEventThrottle: 16,
+        onScroll: onScroll,
+        onLayout: onLayout,
+        onContentSizeChange: onContentSizeChange
+        // The ring room, and the same amount taken back out, so a focus outline
+        // is not clipped by the scroller and the row still lines up.
+        ,
+        style: {
+          flexGrow: 0,
+          marginTop: -ringInset,
+          marginBottom: -ringInset,
+          marginLeft: -ringInset,
+          marginRight: -ringInset
+        },
+        contentContainerStyle: [{
+          flexDirection: 'row',
+          alignItems: 'center',
+          gap,
+          paddingTop: ringInset,
+          paddingBottom: ringInset,
+          paddingLeft: contentInset + ringInset,
+          paddingRight: contentInset + ringInset
+        }, contentContainerStyle],
+        testID: testID ? `${testID}-track` : undefined,
+        children: children
+      }), IS_WEB && overflow.previous ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        pointerEvents: "none",
+        style: edgeStyle('left'),
+        testID: testID ? `${testID}-fade-start` : undefined
+      }) : null, IS_WEB && overflow.next ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        pointerEvents: "none",
+        style: edgeStyle('right'),
+        testID: testID ? `${testID}-fade-end` : undefined
+      }) : null]
+    })
+  );
+}
+const ChipRow = exports.ChipRow = /*#__PURE__*/(0, _react.memo)(ChipRowComponent);
+ChipRow.displayName = 'ChipRow';
+//# sourceMappingURL=ChipRow.js.map

package/lib/commonjs/chip/ChipRow.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_adoptStyleSheet","_useTheme","_shared","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","IS_WEB","Platform","OS","CHIP_ROW_EDGE","exports","STYLE_ID","TRACK","BLOOM_CHIP_ROW_CSS","ChipRowComponent","children","gap","contentInset","fadeColor","ringInset","role","accessibilityLabel","disabled","style","contentContainerStyle","testID","theme","useTheme","React","useEffect","adoptStyleSheet","scroll","setScroll","useState","x","viewport","content","overflow","useMemo","chipRowOverflow","fade","colors","background","onScroll","useCallback","event","contentOffset","layoutMeasurement","contentSize","nativeEvent","width","onLayout","layout","previous","onContentSizeChange","edgeStyle","side","position","top","bottom","left","right","backgroundImage","jsxs","View","undefined","jsx","ScrollView","dataSet","bloomChipRowTrack","horizontal","showsHorizontalScrollIndicator","scrollEventThrottle","flexGrow","marginTop","marginBottom","marginLeft","marginRight","flexDirection","alignItems","paddingTop","paddingBottom","paddingLeft","paddingRight","pointerEvents","next","ChipRow","memo","displayName"],"sourceRoot":"../../../src","sources":["chip/ChipRow.tsx"],"mappings":"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","ignoreList":[]}