@wlloyalty/wll-react-sdk 1.11.0 → 1.11.1

package/dist/index.d.ts

@@ -589,8 +589,15 @@ type ChipProps = {
     testID?: string;
     style?: StyleProp<ViewStyle>;
     labelStyle?: StyleProp<TextStyle>;
+    /**
+     * Maximum number of lines the label may wrap onto before truncating.
+     * Defaults to 2 so long, tenant-configured labels wrap onto a second row
+     * and stay inside the parent (e.g. a badge tile) instead of overflowing.
+     * Pass 1 to force a single line with tail truncation.
+     */
+    numberOfLines?: number;
 };
-declare const Chip: ({ label, variant, role, ariaLive, accessibilityLabel, testID, style, labelStyle, }: ChipProps) => React__default.ReactElement;
+declare const Chip: ({ label, variant, role, ariaLive, accessibilityLabel, testID, style, labelStyle, numberOfLines, }: ChipProps) => React__default.ReactElement;
 
 declare enum SectionType {
     Grid = "GRID",

package/dist/native.js

@@ -5035,6 +5035,7 @@ var useChipStyles = function () {
             borderRadius: theme.sizes.borderRadiusRounded,
             overflow: 'hidden',
             flexShrink: 1,
+            maxWidth: '100%',
         },
         label: {
             fontFamily: theme.fontFamily,
@@ -5059,7 +5060,7 @@ var mapLiveRegion = function (ariaLive) {
     }
 };
 var Chip = function (_a) {
-    var label = _a.label, _b = _a.variant, variant = _b === void 0 ? exports.StatusVariant.PRIMARY : _b, _c = _a.role, role = _c === void 0 ? 'text' : _c, _d = _a.ariaLive, ariaLive = _d === void 0 ? 'polite' : _d, accessibilityLabel = _a.accessibilityLabel, testID = _a.testID, style = _a.style, labelStyle = _a.labelStyle;
+    var label = _a.label, _b = _a.variant, variant = _b === void 0 ? exports.StatusVariant.PRIMARY : _b, _c = _a.role, role = _c === void 0 ? 'text' : _c, _d = _a.ariaLive, ariaLive = _d === void 0 ? 'polite' : _d, accessibilityLabel = _a.accessibilityLabel, testID = _a.testID, style = _a.style, labelStyle = _a.labelStyle, _e = _a.numberOfLines, numberOfLines = _e === void 0 ? 2 : _e;
     var styles = useChipStyles();
     var theme = useWllSdk().theme;
     var variantStyles = React.useMemo(function () {
@@ -5086,9 +5087,9 @@ var Chip = function (_a) {
         }
     }, [theme, variant]);
     var computedAccessibilityLabel = accessibilityLabel !== null && accessibilityLabel !== void 0 ? accessibilityLabel : (typeof label === 'string' ? label : undefined);
-    var _e = mapLiveRegion(ariaLive), accessibilityLiveRegion = _e.native, ariaLiveValue = _e.web;
+    var _f = mapLiveRegion(ariaLive), accessibilityLiveRegion = _f.native, ariaLiveValue = _f.web;
     var isIndividuallyAccessible = computedAccessibilityLabel !== undefined;
-    return (jsxRuntimeExports.jsx(reactNative.View, { style: [styles.container, variantStyles.container, style], accessible: isIndividuallyAccessible, accessibilityRole: role, accessibilityLiveRegion: accessibilityLiveRegion, accessibilityLabel: computedAccessibilityLabel, "aria-live": ariaLiveValue, testID: testID, children: jsxRuntimeExports.jsx(reactNative.Text, { style: [styles.label, variantStyles.label, labelStyle], numberOfLines: 1, ellipsizeMode: "tail", accessible: false, importantForAccessibility: "no", children: label }) }));
+    return (jsxRuntimeExports.jsx(reactNative.View, { style: [styles.container, variantStyles.container, style], accessible: isIndividuallyAccessible, accessibilityRole: role, accessibilityLiveRegion: accessibilityLiveRegion, accessibilityLabel: computedAccessibilityLabel, "aria-live": ariaLiveValue, testID: testID, children: jsxRuntimeExports.jsx(reactNative.Text, { style: [styles.label, variantStyles.label, labelStyle], numberOfLines: numberOfLines, ellipsizeMode: "tail", accessible: false, importantForAccessibility: "no", children: label }) }));
 };
 
 var Reward = /** @class */ (function () {