@workday/canvas-kit-preview-react 17.0.0-alpha.0639-next.0 → 17.0.0-alpha.0645-next.0

package/dist/es6/tabs/lib/TabsList.js

@@ -105,20 +105,20 @@ export const useTabsList = composeHooks(useTabOverflowScroll, createElemPropsHoo
     };
 }), useOverflowListMeasure, useTabsListResetCursorOnBlur);
 export const tabsListStencil = createStencil({
-    base: { name: "nzaec", styles: "box-sizing:border-box;display:flex;position:relative;min-width:0;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));@media screen and (max-width: 768px){padding-inline:var(--cnvs-sys-padding-md, var(--cnvs-sys-space-x4, 1rem));}" },
+    base: { name: "oyugm", styles: "box-sizing:border-box;display:flex;position:relative;min-width:0;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));@media screen and (max-width: 768px){padding-inline:var(--cnvs-sys-padding-md, var(--cnvs-sys-space-x4, 1rem));}" },
     modifiers: {
         modality: {
-            touch: { name: "qr38j", styles: "overflow-x:auto;padding-inline:0;&[data-scroll-position=\"start\"]{mask-image:linear-gradient(to right, white 80%, transparent);}&[data-scroll-position=\"middle\"]{mask-image:linear-gradient(to left, white 80%, transparent), linear-gradient(to right, white 80%, transparent);mask-composite:intersect;}&[data-scroll-position=\"end\"]{mask-image:linear-gradient(to left, white 80%, transparent);}" },
-            mouse: { name: "291zhq", styles: "" },
-            pen: { name: "1k5j4b", styles: "" }
+            touch: { name: "2dvxm0", styles: "overflow-x:auto;padding-inline:0;&[data-scroll-position=\"start\"]{mask-image:linear-gradient(to right, white 80%, transparent);}&[data-scroll-position=\"middle\"]{mask-image:linear-gradient(to left, white 80%, transparent), linear-gradient(to right, white 80%, transparent);mask-composite:intersect;}&[data-scroll-position=\"end\"]{mask-image:linear-gradient(to left, white 80%, transparent);}" },
+            mouse: { name: "2botzo", styles: "" },
+            pen: { name: "1v483j", styles: "" }
         },
         isDragging: {
-            true: { name: "3jtc7x", styles: "" },
-            false: { name: "7o9ys", styles: "" }
+            true: { name: "4ohag", styles: "" },
+            false: { name: "3oa811", styles: "" }
         },
         direction: {
-            left: { name: "3lon18", styles: "" },
-            right: { name: "5f6hs", styles: "" }
+            left: { name: "3jpb4f", styles: "" },
+            right: { name: "euin", styles: "" }
         }
     }
 }, "tabs-list-8b7545");

package/dist/es6/tabs/lib/TabsOverflowButton.js

@@ -11,7 +11,7 @@ import { TABS_OVERFLOW_BUTTON_ID, useTabsModel } from './useTabsModel';
 // Re-export for consumers who may need to reference the overflow button ID
 export { TABS_OVERFLOW_BUTTON_ID } from './useTabsModel';
 const tabsOverflowButtonStencil = createStencil({
-    base: { name: "1qwcw7", styles: "box-sizing:border-box;&:has([data-part=\"tabs-overflow-button-icon\"]){display:flex;gap:0;}" }
+    base: { name: "4bp4wm", styles: "box-sizing:border-box;&:has([data-part=\"tabs-overflow-button-icon\"]){display:flex;gap:0;}" }
 }, "tabs-overflow-button-5c3573");
 /**
  * Measures the overflow button and reports its size to the model for overflow calculation.

package/dist/es6/tabs/lib/useTabsModel.d.ts

@@ -41,7 +41,7 @@ export declare const useTabsModel: (<TT_Special_Generic>(config?: (Partial<{
     orientation: import("@workday/canvas-kit-react/collection").Orientation;
     /**
      * The variant of the Tabs.
-     * @default 'filled'
+     * @default 'outlined'
      */
     variant: "filled" | "outlined";
     menuConfig: Partial<{
@@ -4200,7 +4200,7 @@ export declare const useTabsModel: (<TT_Special_Generic>(config?: (Partial<{
     orientation: import("@workday/canvas-kit-react/collection").Orientation;
     /**
      * The variant of the Tabs.
-     * @default 'filled'
+     * @default 'outlined'
      */
     variant: "filled" | "outlined";
     menuConfig: Partial<{

package/dist/es6/tabs/lib/useTabsModel.js

@@ -46,9 +46,9 @@ export const useTabsModel = createModelHook({
         orientation: 'horizontal',
         /**
          * The variant of the Tabs.
-         * @default 'filled'
+         * @default 'outlined'
          */
-        variant: 'filled',
+        variant: 'outlined',
         menuConfig: {},
     },
     requiredConfig: useOverflowListModel.requiredConfig,
@@ -204,7 +204,7 @@ export const useTabsModel = createModelHook({
          * state setting phase.
          */
         panelIndexRef: panels.state.indexRef,
-        variant: config.variant || 'filled',
+        variant: config.variant,
     };
     const overflowItems = React.useMemo(() => config.items ? config.items.filter(item => state.hiddenIds.includes(getId(item))) : undefined, 
     // eslint-disable-next-line react-hooks/exhaustive-deps

package/dist/es6/version/lib/version.js

@@ -1 +1 @@
-export const version = '16.1.9';
+export const version = '16.1.10';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-preview-react",
-  "version": "17.0.0-alpha.0639-next.0",
+  "version": "17.0.0-alpha.0645-next.0",
   "description": "Canvas Kit Preview is made up of components that have the full design and a11y review, are part of the DS ecosystem and are approved for use in product. The API's could be subject to change, but not without strong communication and migration strategies.",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
@@ -48,8 +48,8 @@
   "dependencies": {
     "@emotion/react": "^11.7.1",
     "@emotion/styled": "^11.6.0",
-    "@workday/canvas-kit-react": "^17.0.0-alpha.0639-next.0",
-    "@workday/canvas-kit-styling": "^17.0.0-alpha.0639-next.0",
+    "@workday/canvas-kit-react": "^17.0.0-alpha.0645-next.0",
+    "@workday/canvas-kit-styling": "^17.0.0-alpha.0645-next.0",
     "@workday/canvas-system-icons-web": "^5.0.3",
     "@workday/canvas-tokens-web": "^4.4.0",
     "@workday/design-assets-types": "^0.3.0"
@@ -60,5 +60,5 @@
     "react-hook-form": "7.36.1",
     "yup": "^0.32.11"
   },
-  "gitHead": "8f605ef1c093e1ad20689d21e92665309c9e858d"
+  "gitHead": "c5b6c9bab2748f3519a17122c7098cee533ae95c"
 }

package/tabs/lib/TabsItem.tsx

@@ -81,11 +81,6 @@ export interface TabsItemProps
    * set while all inactive tabs should have a `tabIndex={-1}`
    */
   tabIndex?: number;
-  /**
-   * The variant of the TabsItem.
-   * @default 'filled'
-   */
-  variant?: 'filled' | 'outlined';
 }
 
 const tabItemStencil = createStencil({
@@ -219,7 +214,9 @@ const tabItemStencil = createStencil({
   },
 });
 
-export const StyledTabItem = createComponent('button')<TabsItemProps>({
+export const StyledTabItem = createComponent('button')<
+  TabsItemProps & {variant?: 'filled' | 'outlined'}
+>({
   displayName: 'StyledTabItem',
   Component: ({children, variant, ...elemProps}, ref, Element) => {
     return (

package/tabs/lib/useTabsModel.tsx

@@ -53,9 +53,9 @@ export const useTabsModel = createModelHook({
     orientation: 'horizontal' as typeof useOverflowListModel.defaultConfig.orientation,
     /**
      * The variant of the Tabs.
-     * @default 'filled'
+     * @default 'outlined'
      */
-    variant: 'filled' as 'filled' | 'outlined',
+    variant: 'outlined' as 'filled' | 'outlined',
     menuConfig: {} as typeof useMenuModel.TConfig,
   },
   requiredConfig: useOverflowListModel.requiredConfig,
@@ -229,7 +229,7 @@ export const useTabsModel = createModelHook({
      * state setting phase.
      */
     panelIndexRef: panels.state.indexRef,
-    variant: config.variant || 'filled',
+    variant: config.variant,
   };
 
   const overflowItems = React.useMemo(