@workday/canvas-kit-react 8.0.0-alpha.111-next.0 → 8.0.0-alpha.121-next.2

package/dist/commonjs/common/lib/utils/useModalityType.d.ts

@@ -0,0 +1,17 @@
+declare type Modality = 'mouse' | 'touch' | 'pen';
+/**
+ * Uses heuristics to determine if the user is on a touch device, uses a pen, or a mouse. This hook
+ * is useful if you have styles or behaviors that depend on the user's interaction type. For
+ * example, touch users can scroll horizontally easier than mouse users, so horizontal overflow
+ * might be more desired than overflow menus on touch devices. For devices that support multiple
+ * input types, the last used input type is saved. For these devices, consider the possibility this
+ * value could change after your component is rendered, so make sure you component rerenders
+ * properly in this case.
+ *
+ * Uses `PointerEvent.pointerType` to determine last used input.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/pointerType
+ */
+export declare const useModalityType: () => Modality;
+export {};
+//# sourceMappingURL=useModalityType.d.ts.map

package/dist/commonjs/common/lib/utils/useModalityType.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useModalityType.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/useModalityType.ts"],"names":[],"mappings":"AAEA,aAAK,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,KAAK,CAAC;AA+B1C;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,eAAe,QAAO,QAkBlC,CAAC"}

package/dist/commonjs/common/lib/utils/useModalityType.js

@@ -0,0 +1,63 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useModalityType = void 0;
+var react_1 = __importDefault(require("react"));
+// Use this shared global value to reduce calls to localStorage which is a synchronous API to a
+// drive which could be slow (spinning disks could be hundreds of ms). We read only once this way.
+// The following initialization is very difficult to test via automation. Don't mess with it unless
+// you plan to manually test.
+//
+// 1. Initialize modality to localStorage
+//   a. if localStorage isn't primed, use clientWidth of the browsers
+//   b. if < 768, default to 'touch'
+//   c. else default to 'mouse'
+var localStorageValue = 'mouse'; //((typeof localStorage !== 'undefined'
+//   ? localStorage.getItem('modality')
+//   : '') ||
+//   (typeof document !== 'undefined'
+//     ? document.documentElement.clientWidth < 768
+//       ? 'touch'
+//       : ''
+//     : '') ||
+//   'mouse') as Modality;
+// Update the `localStorageValue`, but conditionally update localStorage only if the value has
+// changed. This prevents too many calls to `localStorage` which can be costly on spinning disk
+// drives
+var updateLocalStorage = function (value) {
+    // if (localStorageValue !== value) {
+    //   localStorage.setItem('modality', value);
+    // }
+    // localStorageValue = value;
+};
+/**
+ * Uses heuristics to determine if the user is on a touch device, uses a pen, or a mouse. This hook
+ * is useful if you have styles or behaviors that depend on the user's interaction type. For
+ * example, touch users can scroll horizontally easier than mouse users, so horizontal overflow
+ * might be more desired than overflow menus on touch devices. For devices that support multiple
+ * input types, the last used input type is saved. For these devices, consider the possibility this
+ * value could change after your component is rendered, so make sure you component rerenders
+ * properly in this case.
+ *
+ * Uses `PointerEvent.pointerType` to determine last used input.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/pointerType
+ */
+var useModalityType = function () {
+    var _a = react_1.default.useState(localStorageValue), modality = _a[0], setModality = _a[1];
+    react_1.default.useEffect(function () {
+        var handlePointerDown = function (event) {
+            var value = event.pointerType;
+            setModality(value);
+            updateLocalStorage(value);
+        };
+        document.addEventListener('pointerdown', handlePointerDown);
+        return function () {
+            document.removeEventListener('pointerdown', handlePointerDown);
+        };
+    }, []);
+    return modality;
+};
+exports.useModalityType = useModalityType;

package/dist/commonjs/form-field/lib/FormField.d.ts

@@ -55,7 +55,7 @@ export interface FormFieldProps extends Themeable, React.HTMLAttributes<HTMLDivE
 export interface FormFieldErrorBehavior {
     error?: ErrorType;
 }
-declare class FormField extends React.Component<FormFieldProps> {
+declare class FormField extends React.Component<React.PropsWithChildren<FormFieldProps>> {
     static LabelPosition: typeof FormFieldLabelPosition;
     static ErrorType: typeof ErrorType;
     private inputId;

package/dist/commonjs/form-field/lib/FormField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,cAAc,EACd,SAAS,EAET,SAAS,EAEV,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EAAC,sBAAsB,EAAiC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,cACf,SAAQ,SAAS,EACf,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,cAAc;IAChB;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAoED,cAAM,SAAU,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IACrD,MAAM,CAAC,aAAa,gCAA0B;IAC9C,MAAM,CAAC,SAAS,mBAAa;IAE7B,OAAO,CAAC,OAAO,CAAoD;IAEnE,OAAO,CAAC,cAAc,CA8BpB;IAEF,MAAM;CA2DP;AAKD,eAAe,SAAS,CAAC"}
+{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,cAAc,EACd,SAAS,EAET,SAAS,EAEV,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EAAC,sBAAsB,EAAiC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,cACf,SAAQ,SAAS,EACf,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,cAAc;IAChB;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAoED,cAAM,SAAU,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC;IAC9E,MAAM,CAAC,aAAa,gCAA0B;IAC9C,MAAM,CAAC,SAAS,mBAAa;IAE7B,OAAO,CAAC,OAAO,CAAoD;IAEnE,OAAO,CAAC,cAAc,CA8BpB;IAEF,MAAM;CA2DP;AAKD,eAAe,SAAS,CAAC"}

package/dist/commonjs/form-field/lib/Label.d.ts

@@ -31,7 +31,7 @@ export interface LabelProps extends FormFieldLabelPositionBehavior {
      */
     accessibleHide?: boolean;
 }
-declare class Label extends React.Component<LabelProps> {
+declare class Label extends React.Component<React.PropsWithChildren<LabelProps>> {
     static Position: typeof FormFieldLabelPosition;
     render(): JSX.Element;
 }

package/dist/commonjs/form-field/lib/Label.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Label.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/Label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,sBAAsB,EAAE,8BAA8B,EAAC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,UAAW,SAAQ,8BAA8B;IAChE;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAuDD,cAAM,KAAM,SAAQ,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC;IAC7C,MAAM,CAAC,QAAQ,gCAA0B;IAElC,MAAM;CA8Bd;AAID,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Label.d.ts","sourceRoot":"","sources":["../../../../form-field/lib/Label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,sBAAsB,EAAE,8BAA8B,EAAC,MAAM,SAAS,CAAC;AAE/E,MAAM,WAAW,UAAW,SAAQ,8BAA8B;IAChE;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAuDD,cAAM,KAAM,SAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACtE,MAAM,CAAC,QAAQ,gCAA0B;IAElC,MAAM;CA8Bd;AAID,eAAe,KAAK,CAAC"}

package/dist/commonjs/layout/lib/utils/types.d.ts

@@ -1,4 +1,13 @@
-import { Globals, GlobalsNumber, SelfPosition, DisplayOutside, DisplayInside, DisplayInternal, DisplayLegacy, LineStyle, ContentDistribution, ContentPosition } from 'csstype';
+declare type Globals = '-moz-initial' | 'inherit' | 'initial' | 'revert' | 'unset';
+declare type GlobalsNumber = Globals | number;
+declare type SelfPosition = 'center' | 'end' | 'flex-end' | 'flex-start' | 'self-end' | 'self-start' | 'start';
+declare type DisplayOutside = 'block' | 'inline' | 'run-in';
+declare type DisplayInside = '-ms-flexbox' | '-ms-grid' | '-webkit-flex' | 'flex' | 'flow' | 'flow-root' | 'grid' | 'ruby' | 'table';
+declare type DisplayInternal = 'ruby-base' | 'ruby-base-container' | 'ruby-text' | 'ruby-text-container' | 'table-caption' | 'table-cell' | 'table-column' | 'table-column-group' | 'table-footer-group' | 'table-header-group' | 'table-row' | 'table-row-group';
+declare type DisplayLegacy = '-ms-inline-flexbox' | '-ms-inline-grid' | '-webkit-inline-flex' | 'inline-block' | 'inline-flex' | 'inline-grid' | 'inline-list-item' | 'inline-table';
+declare type LineStyle = 'dashed' | 'dotted' | 'double' | 'groove' | 'hidden' | 'inset' | 'none' | 'outset' | 'ridge' | 'solid';
+declare type ContentDistribution = 'space-around' | 'space-between' | 'space-evenly' | 'stretch';
+declare type ContentPosition = 'center' | 'end' | 'flex-end' | 'flex-start' | 'start';
 export declare type PropertyBorder = Globals | LineStyle | (string & {});
 export declare type PropertyJustifySelf = Globals | SelfPosition | 'auto' | 'baseline' | 'left' | 'normal' | 'right' | 'stretch' | (string & {});
 export declare type PropertyAlignSelf = Globals | SelfPosition | 'auto' | 'baseline' | 'normal' | 'stretch' | (string & {});
@@ -17,4 +26,5 @@ export declare type PropertyJustifyItems = Globals | SelfPosition | 'baseline' |
 export declare type PropertyJustifyContent = Globals | ContentDistribution | ContentPosition | 'left' | 'normal' | 'right' | (string & {});
 export declare type PropertyFlexWrap = Globals | 'nowrap' | 'wrap' | 'wrap-reverse';
 export declare type PropertyFlexDirection = Globals | 'column' | 'column-reverse' | 'row' | 'row-reverse';
+export {};
 //# sourceMappingURL=types.d.ts.map

package/dist/commonjs/layout/lib/utils/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../layout/lib/utils/types.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,EACP,aAAa,EACb,YAAY,EACZ,cAAc,EACd,aAAa,EACb,eAAe,EACf,aAAa,EACb,SAAS,EACT,mBAAmB,EACnB,eAAe,EAChB,MAAM,SAAS,CAAC;AAMjB,oBAAY,cAAc,GAAG,OAAO,GAAG,SAAS,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAGjE,oBAAY,mBAAmB,GAC3B,OAAO,GACP,YAAY,GACZ,MAAM,GACN,UAAU,GACV,MAAM,GACN,QAAQ,GACR,OAAO,GACP,SAAS,GACT,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAElB,oBAAY,iBAAiB,GACzB,OAAO,GACP,YAAY,GACZ,MAAM,GACN,UAAU,GACV,QAAQ,GACR,SAAS,GACT,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAElB,oBAAY,aAAa,GAAG,aAAa,CAAC;AAG1C,oBAAY,eAAe,GACvB,OAAO,GACP,cAAc,GACd,aAAa,GACb,eAAe,GACf,aAAa,GACb,UAAU,GACV,WAAW,GACX,MAAM,GACN,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAElB,oBAAY,iBAAiB,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAExF,oBAAY,gBAAgB,GACxB,OAAO,GACP,0BAA0B,GAC1B,MAAM,GACN,MAAM,GACN,QAAQ,GACR,QAAQ,GACR,SAAS,GACT,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAElB,oBAAY,iBAAiB,GACzB,OAAO,GACP,0BAA0B,GAC1B,MAAM,GACN,MAAM,GACN,QAAQ,GACR,QAAQ,GACR,SAAS,CAAC;AAEd,oBAAY,iBAAiB,GACzB,OAAO,GACP,0BAA0B,GAC1B,MAAM,GACN,MAAM,GACN,QAAQ,GACR,QAAQ,GACR,SAAS,CAAC;AAEd,oBAAY,qBAAqB,GAC7B,OAAO,GACP,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,KAAK,GACL,OAAO,GACP,aAAa,GACb,UAAU,GACV,KAAK,GACL,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAGlB,oBAAY,gBAAgB,GACxB,OAAO,GACP,gBAAgB,GAChB,UAAU,GACV,OAAO,GACP,UAAU,GACV,QAAQ,GACR,QAAQ,CAAC;AAEb,oBAAY,cAAc,GAAG,aAAa,GAAG,MAAM,CAAC;AAGpD,oBAAY,kBAAkB,GAC1B,OAAO,GACP,YAAY,GACZ,UAAU,GACV,QAAQ,GACR,SAAS,GACT,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAElB,oBAAY,oBAAoB,GAC5B,OAAO,GACP,mBAAmB,GACnB,eAAe,GACf,UAAU,GACV,QAAQ,GACR,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAElB,oBAAY,oBAAoB,GAC5B,OAAO,GACP,YAAY,GACZ,UAAU,GACV,MAAM,GACN,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,SAAS,GACT,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAElB,oBAAY,sBAAsB,GAC9B,OAAO,GACP,mBAAmB,GACnB,eAAe,GACf,MAAM,GACN,QAAQ,GACR,OAAO,GACP,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AAElB,oBAAY,gBAAgB,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,cAAc,CAAC;AAE5E,oBAAY,qBAAqB,GAAG,OAAO,GAAG,QAAQ,GAAG,gBAAgB,GAAG,KAAK,GAAG,aAAa,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../layout/lib/utils/types.ts"],"names":[],"mappings":"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"}

package/dist/commonjs/layout/lib/utils/types.js

@@ -1,2 +1,4 @@
 "use strict";
+// We're temporarily creating these types from csstype
+// to improve type completion until we move to csstype v3.
 Object.defineProperty(exports, "__esModule", { value: true });

package/dist/commonjs/menu/lib/Menu.d.ts

@@ -1519,7 +1519,7 @@ export declare const Menu: import("../../common").ComponentM<MenuProps & Partial
      *   )
      * }
      */
-    List: import("../../common").ElementComponentM<"div", import("./MenuList").MenuListProps, {
+    List: import("../../common").ElementComponentM<"div", import("./MenuList").MenuListProps<any>, {
         state: {
             stackRef: React.RefObject<HTMLDivElement>;
             targetRef: React.RefObject<HTMLButtonElement>;

package/dist/commonjs/menu/lib/MenuList.d.ts

@@ -1,11 +1,11 @@
 import * as React from 'react';
 import { ExtractProps } from '@workday/canvas-kit-react/common';
 import { Stack } from '@workday/canvas-kit-react/layout';
-export interface MenuListProps extends Partial<ExtractProps<typeof Stack, never>> {
+export interface MenuListProps<T = any> extends Omit<Partial<ExtractProps<typeof Stack, never>>, 'children'> {
     /**
      * The label text of the MenuList.
      */
-    children: React.ReactNode;
+    children: React.ReactNode | ((item: T) => React.ReactNode);
 }
 export declare const useMenuList: <P extends {}, R>(model: {
     state: {
@@ -80,7 +80,7 @@ export declare const useMenuList: <P extends {}, R>(model: {
 } & P & (R extends HTMLOrSVGElement ? {
     ref: React.Ref<R>;
 } : {});
-export declare const MenuList: import("../../common").ElementComponentM<"div", MenuListProps, {
+export declare const MenuList: import("../../common").ElementComponentM<"div", MenuListProps<any>, {
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;

package/dist/commonjs/menu/lib/MenuList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAGL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,KAAK,EAAC,MAAM,kCAAkC,CAAC;AAIvD,MAAM,WAAW,aAAc,SAAQ,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC;IAC/E;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAKtB,CAAC;AAEH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqBnB,CAAC"}
+{"version":3,"file":"MenuList.d.ts","sourceRoot":"","sources":["../../../../menu/lib/MenuList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAGL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,KAAK,EAAC,MAAM,kCAAkC,CAAC;AAIvD,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,GAAG,CACpC,SAAQ,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,KAAK,EAAE,KAAK,CAAC,CAAC,EAAE,UAAU,CAAC;IACpE;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;CAC5D;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAKtB,CAAC;AAEH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqBnB,CAAC"}

package/dist/commonjs/modal/lib/ModalOverlay.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { BoxProps } from '@workday/canvas-kit-react/layout';
 export interface ModalOverlayProps extends BoxProps {
-    children: React.ReactNode;
 }
 export declare const ModalOverlay: import("../../common").ElementComponentM<"div", ModalOverlayProps, {
     state: {

package/dist/commonjs/modal/lib/ModalOverlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalOverlay.d.ts","sourceRoot":"","sources":["../../../../modal/lib/ModalOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,EAAM,QAAQ,EAAC,MAAM,kCAAkC,CAAC;AAG/D,MAAM,WAAW,iBAAkB,SAAQ,QAAQ;IACjD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AA+CD,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;EAOvB,CAAC;AAEH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;OAQ1B,CAAC"}
+{"version":3,"file":"ModalOverlay.d.ts","sourceRoot":"","sources":["../../../../modal/lib/ModalOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,OAAO,EAAM,QAAQ,EAAC,MAAM,kCAAkC,CAAC;AAG/D,MAAM,WAAW,iBAAkB,SAAQ,QAAQ;CAAG;AA+CtD,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;EAOvB,CAAC;AAEH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;OAQ1B,CAAC"}

package/dist/commonjs/pagination/lib/Pagination/AdditionalDetails.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { PaginationModel } from './types';
 import { FlexProps } from '@workday/canvas-kit-react/layout';
-export interface AdditionalDetailsProps extends FlexProps {
+export interface AdditionalDetailsProps extends Omit<FlexProps, 'children'> {
     children: (model: PaginationModel) => React.ReactNode | React.ReactNode;
     model: PaginationModel;
     shouldAnnounceToScreenReader?: boolean;

package/dist/commonjs/pagination/lib/Pagination/AdditionalDetails.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdditionalDetails.d.ts","sourceRoot":"","sources":["../../../../../pagination/lib/Pagination/AdditionalDetails.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,eAAe,EAAC,MAAM,SAAS,CAAC;AACxC,OAAO,EAAO,SAAS,EAAC,MAAM,kCAAkC,CAAC;AAGjE,MAAM,WAAW,sBAAuB,SAAQ,SAAS;IACvD,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC;IACxE,KAAK,EAAE,eAAe,CAAC;IACvB,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAuBD,eAAO,MAAM,iBAAiB,oEAK3B,sBAAsB,gBAQxB,CAAC"}
+{"version":3,"file":"AdditionalDetails.d.ts","sourceRoot":"","sources":["../../../../../pagination/lib/Pagination/AdditionalDetails.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,eAAe,EAAC,MAAM,SAAS,CAAC;AACxC,OAAO,EAAO,SAAS,EAAC,MAAM,kCAAkC,CAAC;AAGjE,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACzE,QAAQ,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC;IACxE,KAAK,EAAE,eAAe,CAAC;IACvB,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAuBD,eAAO,MAAM,iBAAiB,oEAK3B,sBAAsB,gBAQxB,CAAC"}

package/dist/commonjs/pagination/lib/Pagination/GoTo/Label.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { PaginationModel } from '../types';
-export interface GoToLabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
+export interface GoToLabelProps extends Omit<React.LabelHTMLAttributes<HTMLLabelElement>, 'children'> {
     model: PaginationModel;
     /**
      * Accepts child elements or a render prop.

package/dist/commonjs/pagination/lib/Pagination/GoTo/Label.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Label.d.ts","sourceRoot":"","sources":["../../../../../../pagination/lib/Pagination/GoTo/Label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,eAAe,EAAC,MAAM,UAAU,CAAC;AAGzC,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;IACjF,KAAK,EAAE,eAAe,CAAC;IACvB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC;CAC1E;AAQD,eAAO,MAAM,SAAS,sCAAqC,cAAc,gBAMxE,CAAC"}
+{"version":3,"file":"Label.d.ts","sourceRoot":"","sources":["../../../../../../pagination/lib/Pagination/GoTo/Label.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,eAAe,EAAC,MAAM,UAAU,CAAC;AAGzC,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,UAAU,CAAC;IACrE,KAAK,EAAE,eAAe,CAAC;IACvB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC;CAC1E;AAQD,eAAO,MAAM,SAAS,sCAAqC,cAAc,gBAMxE,CAAC"}

package/dist/commonjs/pagination/lib/Pagination/PageButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PageButton.d.ts","sourceRoot":"","sources":["../../../../../pagination/lib/Pagination/PageButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAC,eAAe,EAAC,MAAM,SAAS,CAAC;AAwCxC,oBAAY,eAAe,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAC5E,KAAK,EAAE,eAAe,CAAC;IACvB,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,UAAU,2DAMpB,eAAe,gBAoBjB,CAAC"}
+{"version":3,"file":"PageButton.d.ts","sourceRoot":"","sources":["../../../../../pagination/lib/Pagination/PageButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAC,eAAe,EAAC,MAAM,SAAS,CAAC;AA6CxC,oBAAY,eAAe,GAAG,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAC5E,KAAK,EAAE,eAAe,CAAC;IACvB,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,UAAU,2DAMpB,eAAe,gBAqBjB,CAAC"}

package/dist/commonjs/pagination/lib/Pagination/PageButton.js

@@ -57,22 +57,23 @@ var StyledPageButton = common_1.styled(button_1.BaseButton)({
         fontWeight: toggled ? 700 : 'normal',
     };
 });
-var getPaginationButtonColors = function (toggled) {
+var getPaginationButtonColors = function (toggled, theme) {
+    var themePrimary = theme.canvas.palette.primary;
     return {
         default: {
-            background: toggled ? tokens_1.colors.blueberry400 : 'transparent',
+            background: toggled ? themePrimary.main : 'transparent',
             label: toggled ? tokens_1.colors.frenchVanilla100 : tokens_1.colors.blackPepper400,
         },
         hover: {
-            background: toggled ? tokens_1.colors.blueberry400 : tokens_1.colors.soap300,
+            background: toggled ? themePrimary.main : tokens_1.colors.soap300,
             label: toggled ? tokens_1.colors.frenchVanilla100 : tokens_1.colors.blackPepper400,
         },
         active: {
-            background: toggled ? tokens_1.colors.blueberry400 : 'transparent',
+            background: toggled ? themePrimary.main : 'transparent',
             label: toggled ? tokens_1.colors.frenchVanilla100 : tokens_1.colors.blackPepper400,
         },
         focus: {
-            background: toggled ? tokens_1.colors.blueberry400 : 'transparent',
+            background: toggled ? themePrimary.main : 'transparent',
             label: toggled ? tokens_1.colors.frenchVanilla100 : tokens_1.colors.blackPepper400,
         },
         disabled: {
@@ -83,10 +84,11 @@ var getPaginationButtonColors = function (toggled) {
 var PageButton = function (_a) {
     var model = _a.model, onClick = _a.onClick, pageNumber = _a.pageNumber, children = _a.children, elemProps = __rest(_a, ["model", "onClick", "pageNumber", "children"]);
     var isCurrentPage = pageNumber === model.state.currentPage;
+    var theme = common_1.useTheme();
     var handleClick = function (e) {
         onClick === null || onClick === void 0 ? void 0 : onClick(e);
         model.events.goTo(pageNumber);
     };
-    return (React.createElement(StyledPageButton, __assign({ "aria-current": isCurrentPage ? 'page' : undefined, colors: getPaginationButtonColors(isCurrentPage), "aria-pressed": undefined, onClick: handleClick, toggled: isCurrentPage }, elemProps), children || pageNumber));
+    return (React.createElement(StyledPageButton, __assign({ "aria-current": isCurrentPage ? 'page' : undefined, colors: getPaginationButtonColors(isCurrentPage, theme), "aria-pressed": undefined, onClick: handleClick, toggled: isCurrentPage }, elemProps), children || pageNumber));
 };
 exports.PageButton = PageButton;

package/dist/commonjs/pagination/lib/Pagination/PageList.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { PaginationModel } from './types';
 import { ListItemProps } from './common/List';
 import { HStackProps } from '@workday/canvas-kit-react/layout';
-export interface PageListProps extends Omit<HStackProps, 'as' | 'spacing'> {
+export interface PageListProps extends Omit<HStackProps, 'as' | 'spacing' | 'children'> {
     model: PaginationModel;
     children?: (model: PaginationModel) => React.ReactNode[] | React.ReactNode;
 }

package/dist/commonjs/pagination/lib/Pagination/PageList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PageList.d.ts","sourceRoot":"","sources":["../../../../../pagination/lib/Pagination/PageList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,eAAe,EAAC,MAAM,SAAS,CAAC;AACxC,OAAO,EAAW,aAAa,EAAC,MAAM,eAAe,CAAC;AACtD,OAAO,EAAS,WAAW,EAAC,MAAM,kCAAkC,CAAC;AAErE,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,GAAG,SAAS,CAAC;IACxE,KAAK,EAAE,eAAe,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,EAAE,GAAG,KAAK,CAAC,SAAS,CAAC;CAC5E;AAED,eAAO,MAAM,QAAQ,sCAAqC,aAAa,gBActE,CAAC;AAEF,oBAAY,iBAAiB,GAAG,aAAa,CAAC;AAE9C,eAAO,MAAM,YAAY,+BAA8B,iBAAiB,gBAEvE,CAAC"}
+{"version":3,"file":"PageList.d.ts","sourceRoot":"","sources":["../../../../../pagination/lib/Pagination/PageList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,eAAe,EAAC,MAAM,SAAS,CAAC;AACxC,OAAO,EAAW,aAAa,EAAC,MAAM,eAAe,CAAC;AACtD,OAAO,EAAS,WAAW,EAAC,MAAM,kCAAkC,CAAC;AAErE,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,GAAG,SAAS,GAAG,UAAU,CAAC;IACrF,KAAK,EAAE,eAAe,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,EAAE,GAAG,KAAK,CAAC,SAAS,CAAC;CAC5E;AAED,eAAO,MAAM,QAAQ,sCAAqC,aAAa,gBActE,CAAC;AAEF,oBAAY,iBAAiB,GAAG,aAAa,CAAC;AAE9C,eAAO,MAAM,YAAY,+BAA8B,iBAAiB,gBAEvE,CAAC"}

package/dist/commonjs/radio/lib/Radio.d.ts

@@ -33,6 +33,7 @@ export interface RadioProps extends Themeable {
      * The value of the Radio button.
      */
     value?: string;
+    variant?: 'inverse' | undefined;
 }
 export declare const Radio: import("../../common").ElementComponent<"input", RadioProps>;
 export default Radio;

package/dist/commonjs/radio/lib/Radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../../radio/lib/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAML,SAAS,EAEV,MAAM,kCAAkC,CAAC;AAQ1C,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAyLD,eAAO,MAAM,KAAK,8DAqChB,CAAC;AAEH,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../../radio/lib/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAML,SAAS,EAEV,MAAM,kCAAkC,CAAC;AAQ1C,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AAkPD,eAAO,MAAM,KAAK,8DAgDhB,CAAC;AAEH,eAAe,KAAK,CAAC"}

package/dist/commonjs/radio/lib/Radio.js

@@ -77,7 +77,11 @@ var RadioRipple = common_1.styled('span')({
     width: radioWidth,
     position: 'absolute',
     pointerEvents: 'none',
-    zIndex: -1,
+}, function (_a) {
+    var variant = _a.variant;
+    return ({
+        opacity: variant === 'inverse' ? '0.4' : '1',
+    });
 });
 var RadioInput = common_1.styled('input')({
     borderRadius: radioBorderRadius,
@@ -92,7 +96,7 @@ var RadioInput = common_1.styled('input')({
         outline: 'none',
     },
 }, function (_a) {
-    var checked = _a.checked, disabled = _a.disabled, _b = _a.theme.canvas.palette, themePrimary = _b.primary, themeFocusOutline = _b.common.focusOutline;
+    var checked = _a.checked, disabled = _a.disabled, variant = _a.variant, _b = _a.theme.canvas.palette, themePrimary = _b.primary, themeFocusOutline = _b.common.focusOutline;
     return (__assign({ cursor: disabled ? undefined : 'pointer', 
         /**
          * These selectors are targetting various sibling elements (~) here because
@@ -111,25 +115,52 @@ var RadioInput = common_1.styled('input')({
         // input (which is visually hidden)
         '&:hover ~ div:first-of-type': {
             backgroundColor: checked
-                ? themePrimary.main
+                ? variant === 'inverse'
+                    ? tokens_1.colors.frenchVanilla100
+                    : themePrimary.main
                 : disabled
                     ? tokens_1.inputColors.disabled.background
                     : 'white',
             borderColor: checked
-                ? themePrimary.main
+                ? variant === 'inverse'
+                    ? tokens_1.colors.soap300
+                    : themePrimary.main
                 : disabled
                     ? tokens_1.inputColors.disabled.border
-                    : tokens_1.inputColors.hoverBorder,
+                    : variant === 'inverse'
+                        ? tokens_1.colors.soap300
+                        : tokens_1.inputColors.hoverBorder,
             borderWidth: '1px',
         }, '&:focus, &focus:hover': {
-            '& ~ div:first-of-type': {
-                borderColor: checked ? themePrimary.main : themeFocusOutline,
-                borderWidth: '2px',
-            },
-        }, '&:checked:focus ~ div:first-of-type': __assign({}, common_1.focusRing({ separation: 2, outerColor: themeFocusOutline })) }, common_1.mouseFocusBehavior({
-        '&:focus ~ div:first-of-type': __assign(__assign({}, common_1.focusRing({ width: 0, outerColor: themeFocusOutline })), { borderWidth: '1px', borderColor: checked ? themePrimary.main : tokens_1.inputColors.border }),
+            '& ~ div:first-of-type': __assign({ borderWidth: '2px', borderColor: variant === 'inverse' ? tokens_1.colors.blackPepper400 : themeFocusOutline, boxShadow: 'none' }, common_1.focusRing({
+                width: variant === 'inverse' ? 2 : 0,
+                separation: 0,
+                animate: false,
+                innerColor: variant === 'inverse' ? tokens_1.colors.blackPepper400 : undefined,
+                outerColor: variant === 'inverse' ? tokens_1.colors.frenchVanilla100 : undefined,
+            })),
+        }, '&:checked:focus ~ div:first-of-type': __assign(__assign({}, common_1.focusRing({
+            separation: 2,
+            width: 2,
+            innerColor: variant === 'inverse' ? tokens_1.colors.blackPepper400 : undefined,
+            outerColor: variant === 'inverse' ? tokens_1.colors.frenchVanilla100 : themeFocusOutline,
+        })), { borderColor: variant === 'inverse' ? tokens_1.colors.frenchVanilla100 : themePrimary.main, borderWidth: '2px' }) }, common_1.mouseFocusBehavior({
+        '&:focus ~ div:first-of-type': __assign(__assign({}, common_1.focusRing({
+            width: 0,
+            outerColor: variant === 'inverse' ? tokens_1.colors.frenchVanilla100 : themeFocusOutline,
+        })), { borderWidth: '1px', borderColor: checked
+                ? variant === 'inverse'
+                    ? tokens_1.colors.soap300
+                    : themePrimary.main
+                : tokens_1.inputColors.border }),
         '&:focus:hover ~ div:first-of-type, &:focus:active ~ div:first-of-type': {
-            borderColor: checked ? themePrimary.main : tokens_1.inputColors.hoverBorder,
+            borderColor: checked
+                ? variant === 'inverse'
+                    ? tokens_1.colors.soap300
+                    : themePrimary.main
+                : variant === 'inverse'
+                    ? tokens_1.colors.soap300
+                    : tokens_1.inputColors.hoverBorder,
         },
     })));
 });
@@ -149,18 +180,25 @@ var RadioBackground = common_1.styled('div')({
     transition: 'border 200ms ease, background 200ms',
     width: radioWidth,
 }, function (_a) {
-    var checked = _a.checked, disabled = _a.disabled, themePrimary = _a.theme.canvas.palette.primary;
+    var checked = _a.checked, disabled = _a.disabled, variant = _a.variant, themePrimary = _a.theme.canvas.palette.primary;
     return ({
         borderColor: checked
-            ? themePrimary.main
+            ? variant === 'inverse'
+                ? tokens_1.colors.soap300
+                : themePrimary.main
             : disabled
                 ? tokens_1.inputColors.disabled.border
-                : tokens_1.inputColors.border,
+                : variant === 'inverse'
+                    ? tokens_1.colors.soap300
+                    : tokens_1.inputColors.border,
         backgroundColor: checked
-            ? themePrimary.main
+            ? variant === 'inverse'
+                ? tokens_1.colors.frenchVanilla100
+                : themePrimary.main
             : disabled
                 ? tokens_1.inputColors.disabled.background
                 : 'white',
+        opacity: disabled && variant === 'inverse' ? '.4' : '1',
     });
 });
 var RadioCheck = common_1.styled('div')({
@@ -172,9 +210,11 @@ var RadioCheck = common_1.styled('div')({
     transition: 'transform 200ms ease, opacity 200ms ease',
     width: radioDot,
 }, function (_a) {
-    var theme = _a.theme;
+    var theme = _a.theme, variant = _a.variant;
     return ({
-        backgroundColor: theme.canvas.palette.primary.contrast,
+        backgroundColor: variant === 'inverse'
+            ? theme.canvas.palette.primary.main
+            : theme.canvas.palette.primary.contrast,
     });
 }, function (_a) {
     var checked = _a.checked;
@@ -184,21 +224,29 @@ var RadioCheck = common_1.styled('div')({
     });
 });
 var RadioLabel = common_1.styled('label')(__assign(__assign({}, tokens_1.default.type.levels.subtext.large), { paddingLeft: radioLabelDistance }), function (_a) {
-    var disabled = _a.disabled;
-    return (disabled ? { color: tokens_1.inputColors.disabled.text } : { cursor: 'pointer' });
+    var variant = _a.variant;
+    return (variant === 'inverse' ? { color: tokens_1.colors.frenchVanilla100 } : undefined);
+}, function (_a) {
+    var disabled = _a.disabled, variant = _a.variant;
+    return disabled
+        ? {
+            color: variant === 'inverse' ? tokens_1.colors.frenchVanilla100 : tokens_1.inputColors.disabled.text,
+            opacity: variant === 'inverse' ? '.4' : '1',
+        }
+        : { cursor: 'pointer' };
 });
 exports.Radio = common_1.createComponent('input')({
     displayName: 'Radio',
     Component: function (_a, ref, Element) {
-        var _b = _a.checked, checked = _b === void 0 ? false : _b, id = _a.id, _c = _a.label, label = _c === void 0 ? '' : _c, disabled = _a.disabled, name = _a.name, onChange = _a.onChange, value = _a.value, elemProps = __rest(_a, ["checked", "id", "label", "disabled", "name", "onChange", "value"]);
+        var _b = _a.checked, checked = _b === void 0 ? false : _b, id = _a.id, _c = _a.label, label = _c === void 0 ? '' : _c, disabled = _a.disabled, name = _a.name, onChange = _a.onChange, value = _a.value, variant = _a.variant, elemProps = __rest(_a, ["checked", "id", "label", "disabled", "name", "onChange", "value", "variant"]);
         var inputId = common_1.useUniqueId(id);
         return (React.createElement(RadioContainer, null,
             React.createElement(RadioInputWrapper, { disabled: disabled },
-                React.createElement(RadioInput, __assign({ as: Element, checked: checked, disabled: disabled, id: inputId, ref: ref, name: name, onChange: onChange, type: "radio", value: value, "aria-checked": checked }, elemProps)),
-                React.createElement(RadioRipple, null),
-                React.createElement(RadioBackground, { checked: checked, disabled: disabled },
-                    React.createElement(RadioCheck, { checked: checked }))),
-            label && (React.createElement(RadioLabel, { htmlFor: inputId, disabled: disabled }, label))));
+                React.createElement(RadioInput, __assign({ as: Element, checked: checked, disabled: disabled, id: inputId, ref: ref, name: name, onChange: onChange, type: "radio", value: value, "aria-checked": checked, variant: variant }, elemProps)),
+                React.createElement(RadioRipple, { variant: variant }),
+                React.createElement(RadioBackground, { checked: checked, disabled: disabled, variant: variant },
+                    React.createElement(RadioCheck, { checked: checked, variant: variant }))),
+            label && (React.createElement(RadioLabel, { htmlFor: inputId, disabled: disabled, variant: variant }, label))));
     },
 });
 exports.default = exports.Radio;

package/dist/commonjs/tabs/lib/Tabs.d.ts

@@ -31,6 +31,7 @@ export declare const Tabs: import("../../common").ComponentM<TabsProps & Partial
     }>;
     initialHiddenIds: string[];
     containerWidth: number;
+    shouldCalculateOverflow: boolean;
     initialSelectedIds: import("../../collection/lib/useSelectionListModel").SelectedIds;
     initialUnselectedIds: string[];
     selection: import("../../collection/lib/useSelectionListModel").SelectionManager;
@@ -1660,7 +1661,7 @@ export declare const Tabs: import("../../common").ComponentM<TabsProps & Partial
     navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
     getId: (item: any) => string;
 }> & {
-    List: import("../../common").ElementComponentM<"div", import("./TabsList").TabListProps<unknown>, {
+    List: import("../../common").ElementComponentM<"div", import("./TabsList").TabListProps<any>, {
         state: {
             getId: (item: any) => string;
             orientation: import("../../collection/lib/useBaseListModel").Orientation;
@@ -1977,7 +1978,7 @@ export declare const Tabs: import("../../common").ComponentM<TabsProps & Partial
         Icon: import("../../common").ElementComponent<"span", import("../..").SystemIconProps>;
         Text: import("../../common").ElementComponent<"span", {}>;
     };
-    Panel: import("../../common").ElementComponentM<"div", import("./TabsPanel").TabPanelProps<unknown>, {
+    Panel: import("../../common").ElementComponentM<"div", import("./TabsPanel").TabPanelProps, {
         state: {
             getId: (item: any) => string;
             orientation: import("../../collection/lib/useBaseListModel").Orientation;
@@ -2134,7 +2135,7 @@ export declare const Tabs: import("../../common").ComponentM<TabsProps & Partial
         navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
         getId: (item: any) => string;
     }>;
-    Panels: import("../../common").ElementComponentM<React.FC<{}>, import("./TabsPanels").TabsPanelsProps<unknown>, {
+    Panels: import("../../common").ElementComponentM<React.FC<{}>, import("./TabsPanels").TabsPanelsProps<any>, {
         state: {
             getId: (item: any) => string;
             orientation: import("../../collection/lib/useBaseListModel").Orientation;
@@ -3831,7 +3832,7 @@ export declare const Tabs: import("../../common").ComponentM<TabsProps & Partial
             navigation: import("../../collection/lib/useCursorListModel").NavigationManager;
             getId: (item: any) => string;
         }>;
-        List: import("../../common").ElementComponentM<"div", import("../../menu/lib/MenuList").MenuListProps, {
+        List: import("../../common").ElementComponentM<"div", import("../../menu/lib/MenuList").MenuListProps<any>, {
             state: {
                 stackRef: React.RefObject<HTMLDivElement>;
                 targetRef: React.RefObject<HTMLButtonElement>;

package/dist/commonjs/tabs/lib/Tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,MAAM,WAAW,SAAS;IACxB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAUb;;;;;;;;;;;OAWG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,MAAM,WAAW,SAAS;IACxB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAUb;;;;;;;;;;;OAWG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}

package/dist/commonjs/tabs/lib/TabsItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TabsItem.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAIL,UAAU,EAGV,YAAY,EAIb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,GAAG,EAAE,UAAU,EAAC,MAAM,kCAAkC,CAAC;AAYjE,MAAM,WAAW,aACf,SAAQ,YAAY,CAAC,OAAO,GAAG,EAAE,KAAK,CAAC,EACrC,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC;IACtC;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;;;;OAaG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,aAAa;;;;wDAyFzB,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAoBvB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgBnB,CAAC"}
+{"version":3,"file":"TabsItem.d.ts","sourceRoot":"","sources":["../../../../tabs/lib/TabsItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAIL,UAAU,EAGV,YAAY,EAKb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,GAAG,EAAE,UAAU,EAAC,MAAM,kCAAkC,CAAC;AAYjE,MAAM,WAAW,aACf,SAAQ,YAAY,CAAC,OAAO,GAAG,EAAE,KAAK,CAAC,EACrC,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC;IACtC;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;;;;OAaG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,aAAa;;;;wDAwFzB,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAoBvB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiBnB,CAAC"}

package/dist/commonjs/tabs/lib/TabsItem.js

@@ -54,7 +54,7 @@ exports.StyledTabItem = common_1.styled(layout_1.Box.as('button'))(function (_a)
     var theme = _a.theme, spacing = _a.spacing;
     return (__assign(__assign(__assign(__assign({}, tokens_1.type.levels.subtext.large), { '& > *:not(style) ~ *:not(style)': {
             marginLeft: spacing || tokens_1.space.xxs,
-        }, fontWeight: tokens_1.type.properties.fontWeights.medium, border: 'none', backgroundColor: 'transparent', flex: '0 0 auto', alignItems: 'center', maxWidth: '280px', padding: tokens_1.space.xs + " " + tokens_1.space.s, height: 52, boxSizing: 'border-box', cursor: 'pointer', color: tokens_1.colors.licorice300, position: 'relative', borderRadius: tokens_1.borderRadius.m + " " + tokens_1.borderRadius.m + " 0px 0px", transition: 'background 150ms ease, color 150ms ease' }), common_1.hideMouseFocus), { '.wd-icon-background ~ .wd-icon-accent, .wd-icon-background ~ .wd-icon-accent2': {
+        }, fontWeight: tokens_1.type.properties.fontWeights.medium, border: 'none', backgroundColor: 'transparent', flex: '0 0 auto', alignItems: 'center', padding: tokens_1.space.xs + " " + tokens_1.space.s, height: 52, boxSizing: 'border-box', cursor: 'pointer', color: tokens_1.colors.licorice300, position: 'relative', borderRadius: tokens_1.borderRadius.m + " " + tokens_1.borderRadius.m + " 0px 0px", transition: 'background 150ms ease, color 150ms ease' }), common_1.hideMouseFocus), { '.wd-icon-background ~ .wd-icon-accent, .wd-icon-background ~ .wd-icon-accent2': {
             fill: tokens_1.iconColors.active,
         }, '&:hover, &:focus': {
             backgroundColor: tokens_1.colors.soap200,
@@ -131,8 +131,9 @@ exports.TabsItem = common_1.createSubcomponent('button')({
         Icon: icon_1.SystemIcon,
         Text: common_1.EllipsisText,
     },
-})(function (_a, Element, model) {
+})(function (_a, Element) {
     var children = _a.children, elemProps = __rest(_a, ["children"]);
+    var modality = common_1.useModalityType();
     return (React.createElement(tooltip_1.OverflowTooltip, null,
-        React.createElement(exports.StyledTabItem, __assign({ as: Element }, elemProps), children)));
+        React.createElement(exports.StyledTabItem, __assign({ as: Element, maxWidth: modality === 'touch' ? undefined : 280 }, elemProps), children)));
 });