@workday/canvas-kit-react 15.0.0-alpha.1326-next.0 → 15.0.1

package/dist/es6/segmented-control/lib/hooks/useSegmentedControlModel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSegmentedControlModel.d.ts","sourceRoot":"","sources":["../../../../../segmented-control/lib/hooks/useSegmentedControlModel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,eAAO,MAAM,wBAAwB;IAGjC;;;OAGG;;IAEH;;;OAGG;;IAEH;;;OAGG;;IAEH;;;OAGG;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAxBH;;;OAGG;;IAEH;;;OAGG;;IAEH;;;OAGG;;IAEH;;;OAGG;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2CL,CAAC"}

package/dist/es6/segmented-control/lib/hooks/useSegmentedControlModel.js

@@ -0,0 +1,69 @@
+import React from 'react';
+import { defaultGetId, useListModel } from '@workday/canvas-kit-react/collection';
+import { createModelHook } from '@workday/canvas-kit-react/common';
+export const useSegmentedControlModel = createModelHook({
+    defaultConfig: {
+        ...useListModel.defaultConfig,
+        /**
+         * Optional id for the whole `SegmentedControl` group. If not provided, a unique id will be created.
+         * @default useUniqueId()
+         */
+        id: '',
+        /**
+         * An initially selected value. This value must match the `data-id` of the `SegmentedControl.Item` component.
+         * If not provided, the first value will be selected.
+         */
+        initialValue: '',
+        /**
+         * Sets disabled state for all segmented control buttons
+         * @default false
+         */
+        disabled: false,
+        /**
+         * Sets the size of the segmented control container and its buttons. Can be `small`, `medium` or `large`.
+         * @default 'medium'
+         */
+        size: 'medium',
+        /**
+         * The SegmentedControl can rendered in a horizontal or vertical orientation.
+         * We suggest to use the `vertical` orientation only for icon only variant.
+         * @default 'horizontal'
+         */
+        orientation: 'horizontal',
+    },
+    requiredConfig: useListModel.requiredConfig,
+})(config => {
+    var _a;
+    const getId = config.getId || defaultGetId;
+    const initialSelectedRef = React.useRef(config.initialValue);
+    const items = config.items;
+    const model = useListModel(useListModel.mergeConfig(config, {
+        orientation: config.orientation || 'horizontal',
+        items,
+        onRegisterItem(data) {
+            if (!initialSelectedRef.current) {
+                initialSelectedRef.current = data.id;
+                events.select({ id: initialSelectedRef.current });
+            }
+        },
+        initialSelectedIds: config.initialValue
+            ? [config.initialValue]
+            : ((_a = config.items) === null || _a === void 0 ? void 0 : _a.length)
+                ? [getId(config.items[0])]
+                : [],
+        shouldVirtualize: false,
+    }));
+    const state = {
+        ...model.state,
+        disabled: config.disabled,
+        size: config.size,
+    };
+    const events = {
+        ...model.events,
+    };
+    return {
+        ...model,
+        state,
+        events,
+    };
+});

package/dist/es6/select/lib/Select.d.ts

@@ -41,24 +41,7 @@ export declare const Select: import("@workday/canvas-kit-react/common").Componen
     nonInteractiveIds: string[];
     orientation: import("../..").Orientation;
     defaultItemHeight: number;
-    items: any[]; /**
-     * `Select.List` renders a {@link ComboboxMenuList Combobox.Menu.List}. You have access to all `ListBox` props.
-     *
-     * ```tsx
-     * <Select items={options}>
-     *  <FormField label="Your Label">
-     *    <Select.Input onChange={(event) => handleChange(event)}>
-     *    <Select.Popper>
-     *      <Select.Card>
-     *        <Select.List>
-     *          {(item) => <Select.Item>{item}</Select.Item>}
-     *        </Select.List
-     *      </Select.Card>
-     *    </Select.Popper>
-     *  </FormField>
-     * </Select>
-     * ```
-     */
+    items: any[];
     UNSTABLE_parentModel: {
         state: {
             selectedIds: string[] | "all";

package/dist/es6/select/lib/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../select/lib/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,QAAQ,EAAC,MAAM,oCAAoC,CAAC;AAE5D,OAAO,EAAC,YAAY,EAAkB,MAAM,kCAAkC,CAAC;AAK/E,MAAM,WAAW,WAAY,SAAQ,YAAY,CAAC,OAAO,QAAQ,CAAC;CAAG;AACrE;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;kBAoDf;;;;;;;;;;;;;;;;;OAiBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAjEH;;;;;;;;;;;;OAYG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;OAaG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;OAiBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;OAiBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;OAiBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CASL,CAAC"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../select/lib/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,QAAQ,EAAC,MAAM,oCAAoC,CAAC;AAC5D,OAAO,EAAC,YAAY,EAAkB,MAAM,kCAAkC,CAAC;AAO/E,MAAM,WAAW,WAAY,SAAQ,YAAY,CAAC,OAAO,QAAQ,CAAC;CAAG;AACrE;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIf;;;;;;;;;;;;OAYG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;OAaG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;OAiBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;OAiBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;OAiBG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CASL,CAAC"}

package/dist/es6/select/lib/Select.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Combobox } from '@workday/canvas-kit-react/combobox';
-import { useSelectModel } from './hooks/useSelectModel';
 import { createContainer } from '@workday/canvas-kit-react/common';
-import { SelectInput } from './SelectInput';
 import { SelectCard } from './SelectCard';
+import { SelectInput } from './SelectInput';
 import { SelectItem } from './SelectItem';
+import { useSelectModel } from './hooks/useSelectModel';
 /**
  * Use `Select` to allow users to choose an option from a list or type characters to select a matching option.
  *

package/dist/es6/select/lib/SelectCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectCard.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectCard.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,iBAAiB,iJAI5B,CAAC;AAEH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASrB,CAAC"}
+{"version":3,"file":"SelectCard.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectCard.tsx"],"names":[],"mappings":"AAQA,eAAO,MAAM,iBAAiB,iJAI5B,CAAC;AAEH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASrB,CAAC"}

package/dist/es6/select/lib/SelectCard.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Combobox } from '@workday/canvas-kit-react/combobox';
+import { createSubcomponent } from '@workday/canvas-kit-react/common';
+import { menuCardStencil } from '@workday/canvas-kit-react/menu';
 import { createStencil, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
 import { useSelectCard } from './hooks/useSelectCard';
 import { useSelectModel } from './hooks/useSelectModel';
-import { createSubcomponent } from '@workday/canvas-kit-react/common';
-import { menuCardStencil } from '@workday/canvas-kit-react/menu';
 export const selectCardStencil = createStencil({
-    base: { name: "342ifw", styles: "box-sizing:border-box;--maxHeight-menu-card-379062:18.75rem;" }
-}, "select-card-40598d");
+    base: { name: "2j0n3j", styles: "box-sizing:border-box;--maxHeight-menu-card-88fe55:18.75rem;" }
+}, "select-card-249ab5");
 export const SelectCard = createSubcomponent('div')({
     modelHook: useSelectModel,
     elemPropsHook: useSelectCard,

package/dist/es6/select/lib/SelectInput.d.ts

@@ -1,7 +1,7 @@
-import { CanvasSystemIcon } from '@workday/design-assets-types';
-import { CSProps } from '@workday/canvas-kit-styling';
-import { TextInput } from '@workday/canvas-kit-react/text-input';
 import { ExtractProps } from '@workday/canvas-kit-react/common';
+import { TextInput } from '@workday/canvas-kit-react/text-input';
+import { CSProps } from '@workday/canvas-kit-styling';
+import { CanvasSystemIcon } from '@workday/canvas-system-icons-web';
 export interface SelectInputProps extends ExtractProps<typeof TextInput, never>, CSProps {
     /**
      * The Icon to render at the start of the `input`. Use this prop if your options
@@ -22,7 +22,7 @@ export declare const selectInputStencil: import("@workday/canvas-kit-styling").S
             readonly visualInput: "select-visual-input";
         }>) => {
             "[data-part=\"select-visual-input\"]": {
-                backgroundColor: "--cnvs-brand-error-lightest";
+                backgroundColor: "var(--cnvs-sys-color-brand-surface-critical-default, oklch(0.6289 0.2567 29.11 / 0.04))";
             };
         };
         caution: ({ visualInputPart }: {} & import("@workday/canvas-kit-styling").StencilVarsParts<{
@@ -35,7 +35,7 @@ export declare const selectInputStencil: import("@workday/canvas-kit-styling").S
             readonly visualInput: "select-visual-input";
         }>) => {
             "[data-part=\"select-visual-input\"]": {
-                backgroundColor: "--cnvs-brand-alert-lightest";
+                backgroundColor: "var(--cnvs-sys-color-brand-surface-caution-default, oklch(0.7982 0.159 92.57 / 0.1))";
             };
         };
     };

package/dist/es6/select/lib/SelectInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInput.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAE9D,OAAO,EAAgB,OAAO,EAAC,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAa,SAAS,EAAC,MAAM,sCAAsC,CAAC;AAK3E,OAAO,EAAqB,YAAY,EAAC,MAAM,kCAAkC,CAAC;AAGlF,MAAM,WAAW,gBAAiB,SAAQ,YAAY,CAAC,OAAO,SAAS,EAAE,KAAK,CAAC,EAAE,OAAO;IACtF;;;;OAIG;IACH,cAAc,CAAC,EAAE,gBAAgB,CAAC;CACnC;AAED,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBAoE7B,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0BtB,CAAC"}
+{"version":3,"file":"SelectInput.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAqB,MAAM,kCAAkC,CAAC;AAElF,OAAO,EAAa,SAAS,EAAC,MAAM,sCAAsC,CAAC;AAC3E,OAAO,EAAC,OAAO,EAAgB,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAC,gBAAgB,EAAqB,MAAM,kCAAkC,CAAC;AAMtF,MAAM,WAAW,gBAAiB,SAAQ,YAAY,CAAC,OAAO,SAAS,EAAE,KAAK,CAAC,EAAE,OAAO;IACtF;;;;OAIG;IACH,cAAc,CAAC,EAAE,gBAAgB,CAAC;CACnC;AAED,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oBAuE7B,CAAC;AAEH,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0BtB,CAAC"}

package/dist/es6/select/lib/SelectInput.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { caretDownSmallIcon } from '@workday/canvas-system-icons-web';
-import { createStencil } from '@workday/canvas-kit-styling';
-import { InputGroup, TextInput } from '@workday/canvas-kit-react/text-input';
+import { createSubcomponent } from '@workday/canvas-kit-react/common';
 import { SystemIcon, systemIconStencil } from '@workday/canvas-kit-react/icon';
+import { InputGroup, TextInput } from '@workday/canvas-kit-react/text-input';
+import { createStencil } from '@workday/canvas-kit-styling';
+import { caretDownSmallIcon } from '@workday/canvas-system-icons-web';
+import { system } from '@workday/canvas-tokens-web';
 import { useSelectInput } from './hooks/useSelectInput';
 import { useSelectModel } from './hooks/useSelectModel';
-import { createSubcomponent } from '@workday/canvas-kit-react/common';
-import { system, brand } from '@workday/canvas-tokens-web';
 export const selectInputStencil = createStencil({
     parts: {
         caret: 'select-caret-icon',
@@ -17,14 +17,14 @@ export const selectInputStencil = createStencil({
         hiddenInput: 'select-hidden-input',
         visualInput: 'select-visual-input',
     },
-    base: { name: "1zbt91", styles: "box-sizing:border-box;[data-part=\"select-hidden-input\"]{position:absolute;top:var(--cnvs-sys-space-zero);bottom:var(--cnvs-sys-space-zero);left:var(--cnvs-sys-space-zero);right:var(--cnvs-sys-space-zero);opacity:var(--cnvs-sys-opacity-zero);cursor:default;pointer-events:none;min-width:100%;width:100%;}[data-part=\"select-start-icon\"], [data-part=\"select-end-icon\"], [data-part=\"select-caret-container\"], [data-part=\"select-start-icon-container\"]{position:absolute;pointer-events:none;}[data-part=\"select-visual-input\"]{caret-color:transparent;background-color:var(--cnvs-sys-color-bg-default);color:var(--cnvs-sys-color-text-default);cursor:default;&::placeholder{color:var(--cnvs-sys-color-text-default);}&::selection{background-color:transparent;}}&:has(:disabled, .disabled){[data-part=\"select-caret-icon\"]{--color-system-icon-3a4847:var(--cnvs-sys-color-fg-disabled);}}" },
+    base: { name: "23pwe8", styles: "box-sizing:border-box;[data-part=\"select-hidden-input\"]{position:absolute;top:0;bottom:0;left:0;right:0;opacity:var(--cnvs-sys-opacity-zero);cursor:default;pointer-events:none;min-width:100%;width:100%;}[data-part=\"select-start-icon\"], [data-part=\"select-end-icon\"], [data-part=\"select-caret-container\"], [data-part=\"select-start-icon-container\"]{position:absolute;pointer-events:none;}[data-part=\"select-visual-input\"]{caret-color:transparent;background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));color:var(--cnvs-sys-color-fg-default);cursor:default;&::placeholder{color:var(--cnvs-sys-color-fg-default);}&::selection{background-color:transparent;}}[data-part=\"select-caret-icon\"]{--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-default);}&:has(:disabled, .disabled){[data-part=\"select-caret-icon\"]{--color-system-icon-c9acc3:var(--cnvs-sys-color-fg-disabled);}}" },
     modifiers: {
         error: {
-            error: { name: "2m4ltx", styles: "[data-part=\"select-visual-input\"]{background-color:var(--cnvs-brand-error-lightest);}" },
-            caution: { name: "tmqwr", styles: "[data-part=\"select-visual-input\"]{background-color:var(--cnvs-brand-alert-lightest);}" }
+            error: { name: "2y2zhm", styles: "[data-part=\"select-visual-input\"]{background-color:var(--cnvs-sys-color-brand-surface-critical-default, oklch(0.6289 0.2567 29.11 / 0.04));}" },
+            caution: { name: "16qil9", styles: "[data-part=\"select-visual-input\"]{background-color:var(--cnvs-sys-color-brand-surface-caution-default, oklch(0.7982 0.159 92.57 / 0.1));}" }
         }
     }
-}, "select-input-9444aa");
+}, "select-input-8483f2");
 export const SelectInput = createSubcomponent(TextInput)({
     modelHook: useSelectModel,
     elemPropsHook: useSelectInput,

package/dist/es6/select/lib/SelectItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectItem.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectItem.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAWrB,CAAC"}
+{"version":3,"file":"SelectItem.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectItem.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAWrB,CAAC"}

package/dist/es6/select/lib/SelectItem.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Combobox } from '@workday/canvas-kit-react/combobox';
-import { useSelectModel } from './hooks/useSelectModel';
 import { createSubcomponent } from '@workday/canvas-kit-react/common';
+import { useSelectModel } from './hooks/useSelectModel';
 export const SelectItem = createSubcomponent('li')({
     modelHook: useSelectModel,
     subComponents: {

package/dist/es6/select/lib/hooks/useSelectCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSelectCard.d.ts","sourceRoot":"","sources":["../../../../../select/lib/hooks/useSelectCard.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAIxB,CAAC"}
+{"version":3,"file":"useSelectCard.d.ts","sourceRoot":"","sources":["../../../../../select/lib/hooks/useSelectCard.ts"],"names":[],"mappings":"AAIA;;GAEG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAIxB,CAAC"}

package/dist/es6/select/lib/hooks/useSelectInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSelectInput.d.ts","sourceRoot":"","sources":["../../../../../select/lib/hooks/useSelectInput.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAiB1B;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCA2CF,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAsC3C,CAAC"}
+{"version":3,"file":"useSelectInput.d.ts","sourceRoot":"","sources":["../../../../../select/lib/hooks/useSelectInput.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAmB1B;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gCA2CF,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAsC3C,CAAC"}

package/dist/es6/select/lib/hooks/useSelectInput.js

@@ -1,7 +1,7 @@
 import React from 'react';
-import { composeHooks, createElemPropsHook, useLocalRef, useResizeObserver, } from '@workday/canvas-kit-react/common';
 import { getCursor } from '@workday/canvas-kit-react/collection';
 import { useComboboxInput, useComboboxInputConstrained, useComboboxKeyboardTypeAhead, useComboboxMoveCursorToSelected, useComboboxResetCursorToSelected, } from '@workday/canvas-kit-react/combobox';
+import { composeHooks, createElemPropsHook, useLocalRef, useResizeObserver, } from '@workday/canvas-kit-react/common';
 import { useSelectModel } from './useSelectModel';
 /**
  * `useSelectInput` extends {@link useComboboxInput useComboboxInput}  and {@link useComboboxKeyboardTypeAhead useComboboxKeyboardTypeAhead} and adds type ahead functionality and Select-specific [keyboard support](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-select-only/).

package/dist/es6/select/lib/hooks/useSelectModel.js

@@ -1,5 +1,5 @@
-import { createModelHook } from '@workday/canvas-kit-react/common';
 import { useComboboxModel } from '@workday/canvas-kit-react/combobox';
+import { createModelHook } from '@workday/canvas-kit-react/common';
 /**
  * `SelectModel` extends the {@link ComboboxModel}. Selecting items from
  * the menu will dispatch an

package/dist/es6/side-panel/index.d.ts

@@ -1,2 +1,4 @@
 export * from './lib/SidePanel';
+export * from './lib/SidePanelToggleButton';
+export * from './lib/useSidePanelModel';
 //# sourceMappingURL=index.d.ts.map

package/dist/es6/side-panel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../side-panel/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../side-panel/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC"}

package/dist/es6/side-panel/index.js

@@ -1 +1,3 @@
 export * from './lib/SidePanel';
+export * from './lib/SidePanelToggleButton';
+export * from './lib/useSidePanelModel';

package/dist/es6/side-panel/lib/SidePanel.d.ts

@@ -1,97 +1,227 @@
 import * as React from 'react';
-import { CanvasSpaceValues } from '@workday/canvas-kit-react/tokens';
+import { CSProps } from '@workday/canvas-kit-styling';
 /**
- * @deprecated ⚠️ `SidePanelProps` in Main has been deprecated and will be removed in a future major version. Please use [`SidePanel` in Preview](https://workday.github.io/canvas-kit/?path=/docs/preview-side-panel--docs) instead.
+ * Adds the necessary props to the SidePanel container element.
+ * This includes the `id` and `aria-labelledby` attributes for accessibility.
  */
-export interface SidePanelProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * If true, set the SidePanel to the open state.
-     * @default false;
-     */
-    open: boolean;
-    /**
-     * The function called when the toggle button is clicked. The toggle button is only shown if this prop is defined.
-     */
-    onToggleClick?: () => void;
-    /**
-     * The text or element to display as the SidePanel header.
-     */
-    header?: string | React.ReactNode;
-    /**
-     * The side from which the SidePanel opens. Accepts `Left` or `Right`.
-     * @default SidePanelOpenDirection.Left
-     */
-    openDirection?: SidePanelOpenDirection;
-    /**
-     * The function called when the window width changes and reaches a width equivalent to `breakpoint`. For example, if the window is resized from a width of `1000px`, this will be called when the window reaches a width equivalent to `breakpoint`. The `aboveBreakpoint` argument passed to the callback function indicates whether the current window width is above or below `breakpoint` so you can control `open` based on the change.
-     */
-    onBreakpointChange?: (aboveBreakpoint: boolean) => void;
-    /**
-     * The padding of the SidePanel when it's open.
-     */
-    padding?: CanvasSpaceValues;
+export declare const useSidePanelContainer: import("@workday/canvas-kit-react/common").BehaviorHook<{
+    state: {
+        panelId: string;
+        labelId: string;
+        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        origin: "end" | "start";
+        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+    };
+    events: {
+        expand(): void;
+        collapse(): void;
+        handleAnimationEnd(event: React.TransitionEvent<HTMLDivElement>): React.TransitionEvent<HTMLDivElement>;
+        handleAnimationStart(): undefined;
+    };
+}, {
+    readonly id: string;
+    readonly 'aria-labelledby': string;
+    readonly onTransitionEnd: (event: React.TransitionEvent<HTMLDivElement>) => React.TransitionEvent<HTMLDivElement>;
+}>;
+export type SidePanelVariant = 'standard' | 'alternate';
+export interface SidePanelProps extends CSProps {
     /**
-     * The window width at which the SidePanel triggers `onBreakPointChange`.
-     * @default 768px
+     * The width of the component (in `px` if it's a `number`) when it is collapsed.
+     *
+     * @default 64
      */
-    breakpoint?: number;
+    collapsedWidth?: number | string;
     /**
-     * The width of the SidePanel when it's open.
-     * @default 300px
+     * The width of the component (in `px` if it's a `number`) when it is expanded.
+     *
+     * @default 320
      */
-    openWidth?: number;
+    expandedWidth?: number | string;
     /**
-     * The background color of the SidePanel when it's open.
-     * @default SidePanelBackgroundColor.White
+     * The style variant of the side panel. 'standard' uses a lighter gray background (`system.color.bg.alt.softer`), no depth. 'alternate' uses a white background with depth (`system.color.bg.default` and level 3 depth).
+     *
+     * @default 'standard'
      */
-    backgroundColor?: SidePanelBackgroundColor;
+    variant?: SidePanelVariant;
+    children?: React.ReactNode;
+}
+export declare const panelStencil: import("@workday/canvas-kit-styling").Stencil<{
+    variant: {
+        alternate: {
+            backgroundColor: "var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)))";
+            boxShadow: "--cnvs-sys-depth-3";
+        };
+        standard: {
+            backgroundColor: "var(--cnvs-sys-color-surface-navigation, oklch(0.9692 0.0035 248.23 / 1))";
+        };
+    };
+    expanded: {
+        expanded: ({ expandedWidth }: {
+            expandedWidth: `--${string}`;
+            collapsedWidth: `--${string}`;
+        } & import("@workday/canvas-kit-styling").StencilVarsParts<{}>) => {
+            width: `--${string}`;
+            maxWidth: `--${string}`;
+        };
+        collapsed: ({ collapsedWidth }: {
+            expandedWidth: `--${string}`;
+            collapsedWidth: `--${string}`;
+        } & import("@workday/canvas-kit-styling").StencilVarsParts<{}>) => {
+            width: `--${string}`;
+            maxWidth: `--${string}`;
+        };
+        expanding: ({ expandedWidth }: {
+            expandedWidth: `--${string}`;
+            collapsedWidth: `--${string}`;
+        } & import("@workday/canvas-kit-styling").StencilVarsParts<{}>) => {
+            width: `--${string}`;
+            maxWidth: `--${string}`;
+        };
+        collapsing: ({ collapsedWidth }: {
+            expandedWidth: `--${string}`;
+            collapsedWidth: `--${string}`;
+        } & import("@workday/canvas-kit-styling").StencilVarsParts<{}>) => {
+            width: `--${string}`;
+            maxWidth: `--${string}`;
+        };
+    };
+}, {}, {
+    expandedWidth: string;
+    collapsedWidth: string;
+}, never, never>;
+export declare const SidePanel: import("@workday/canvas-kit-react/common").ElementComponentM<"section", SidePanelProps & Partial<{
+    initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+    origin: "end" | "start";
+    panelId: string;
+    labelId: string;
+    onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+}> & {
+    onExpand?: ((data: undefined, prevState: {
+        panelId: string;
+        labelId: string;
+        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        origin: "end" | "start";
+        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+    }) => void) | undefined;
+    onCollapse?: ((data: undefined, prevState: {
+        panelId: string;
+        labelId: string;
+        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        origin: "end" | "start";
+        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+    }) => void) | undefined;
+    onHandleAnimationEnd?: ((data: React.TransitionEvent<HTMLDivElement>, prevState: {
+        panelId: string;
+        labelId: string;
+        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        origin: "end" | "start";
+        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+    }) => void) | undefined;
+    onHandleAnimationStart?: ((data: undefined, prevState: {
+        panelId: string;
+        labelId: string;
+        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        origin: "end" | "start";
+        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+    }) => void) | undefined;
+} & {
+    shouldExpand?: ((data: undefined, state: {
+        panelId: string;
+        labelId: string;
+        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        origin: "end" | "start";
+        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+    }) => boolean) | undefined;
+    shouldCollapse?: ((data: undefined, state: {
+        panelId: string;
+        labelId: string;
+        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        origin: "end" | "start";
+        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+    }) => boolean) | undefined;
+    shouldHandleAnimationEnd?: ((data: React.TransitionEvent<HTMLDivElement>, state: {
+        panelId: string;
+        labelId: string;
+        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        origin: "end" | "start";
+        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+    }) => boolean) | undefined;
+    shouldHandleAnimationStart?: ((data: undefined, state: {
+        panelId: string;
+        labelId: string;
+        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        origin: "end" | "start";
+        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+    }) => boolean) | undefined;
+}, {
+    state: {
+        panelId: string;
+        labelId: string;
+        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+        origin: "end" | "start";
+        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+    };
+    events: {
+        expand(): void;
+        collapse(): void;
+        handleAnimationEnd(event: React.TransitionEvent<HTMLDivElement>): React.TransitionEvent<HTMLDivElement>;
+        handleAnimationStart(): undefined;
+    };
+}> & {
     /**
-     * The `aria-label` that describes closing the navigation.
-     * @default 'close navigation'
+     * `SidePanel.ToggleButton` is a control that toggles between expanded and collapsed states.
+     * It must be used within the `SidePanel` component as a child. For accessibility purposes,
+     * it should be the first focusable element in the panel.
+     *
+     * The button automatically receives `aria-controls`, `aria-expanded`, and `aria-labelledby`
+     * attributes from the model.
      */
-    closeNavigationAriaLabel?: string;
+    ToggleButton: import("@workday/canvas-kit-react/common").ElementComponentM<"button", import("./SidePanelToggleButton").SidePanelToggleButtonProps, {
+        state: {
+            panelId: string;
+            labelId: string;
+            transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+            initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+            origin: "end" | "start";
+            onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+        };
+        events: {
+            expand(): void;
+            collapse(): void;
+            handleAnimationEnd(event: React.TransitionEvent<HTMLDivElement>): React.TransitionEvent<HTMLDivElement>;
+            handleAnimationStart(): undefined;
+        };
+    }>;
     /**
-     * The `aria-label` that describes opening the navigation.
-     * @default 'open navigation'
+     * `SidePanel.Heading` is a styled heading that provides the accessible name for the SidePanel.
+     * The heading's `id` is automatically linked to the panel's `aria-labelledby` attribute.
+     * By default, the heading is hidden when the panel is collapsed.
      */
-    openNavigationAriaLabel?: string;
-}
-/**
- * @deprecated ⚠️ `SidePanelState` in Main has been deprecated and will be removed in a future major version.
- */
-export interface SidePanelState {
-    screenSize: number;
-}
-/**
- * @deprecated ⚠️ `SidePanelOpenDirection` in Main has been deprecated and will be removed in a future major version.
- */
-export declare enum SidePanelOpenDirection {
-    Left = 0,
-    Right = 1
-}
-/**
- * @deprecated ⚠️ `SidePanelBackgroundColor` in Main has been deprecated and will be removed in a future major version.
- */
-export declare enum SidePanelBackgroundColor {
-    White = 0,
-    Transparent = 1,
-    Gray = 2
-}
-/**
- * @deprecated ⚠️ `SidePanel` in Main has been deprecated and will be removed in a future major version. Please use [`SidePanel` in Preview](https://workday.github.io/canvas-kit/?path=/docs/preview-side-panel--docs) instead.
- */
-export declare class SidePanel extends React.Component<SidePanelProps, SidePanelState> {
-    static OpenDirection: typeof SidePanelOpenDirection;
-    static BackgroundColor: typeof SidePanelBackgroundColor;
-    constructor(props: SidePanelProps);
-    state: {
-        screenSize: number;
-    };
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    render(): import("react/jsx-runtime").JSX.Element;
-    private handleResize;
-    private onToggleClick;
-    private toggleButtonDirection;
-}
+    Heading: import("@workday/canvas-kit-react/common").ElementComponentM<import("@workday/canvas-kit-react/common").ElementComponent<"h2", import("../..").TypeLevelProps>, import("./SidePanelHeading").SidePanelHeadingProps, {
+        state: {
+            panelId: string;
+            labelId: string;
+            transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+            initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
+            origin: "end" | "start";
+            onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
+        };
+        events: {
+            expand(): void;
+            collapse(): void;
+            handleAnimationEnd(event: React.TransitionEvent<HTMLDivElement>): React.TransitionEvent<HTMLDivElement>;
+            handleAnimationStart(): undefined;
+        };
+    }>;
+};
 //# sourceMappingURL=SidePanel.d.ts.map

package/dist/es6/side-panel/lib/SidePanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SidePanel.d.ts","sourceRoot":"","sources":["../../../../side-panel/lib/SidePanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAgB,iBAAiB,EAAC,MAAM,kCAAkC,CAAC;AAKlF;;GAEG;AACH,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC1E;;;OAGG;IACH,IAAI,EAAE,OAAO,CAAC;IACd;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAClC;;;OAGG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC;IACvC;;OAEG;IACH,kBAAkB,CAAC,EAAE,CAAC,eAAe,EAAE,OAAO,KAAK,IAAI,CAAC;IACxD;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,eAAe,CAAC,EAAE,wBAAwB,CAAC;IAC3C;;;OAGG;IACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC;;;OAGG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,UAAU,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,oBAAY,sBAAsB;IAChC,IAAI,IAAA;IACJ,KAAK,IAAA;CACN;AAED;;GAEG;AACH,oBAAY,wBAAwB;IAClC,KAAK,IAAA;IACL,WAAW,IAAA;IACX,IAAI,IAAA;CACL;AAwFD;;GAEG;AACH,qBAAa,SAAU,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,EAAE,cAAc,CAAC;IAC5E,MAAM,CAAC,aAAa,gCAA0B;IAC9C,MAAM,CAAC,eAAe,kCAA4B;gBAEtC,KAAK,EAAE,cAAc;IAKjC,KAAK;;MAEH;IAEK,iBAAiB;IAGjB,oBAAoB;IAIpB,MAAM;IAgDb,OAAO,CAAC,YAAY,CAWlB;IAEF,OAAO,CAAC,aAAa,CAInB;IAEF,OAAO,CAAC,qBAAqB,CAS3B;CACH"}
+{"version":3,"file":"SidePanel.d.ts","sourceRoot":"","sources":["../../../../side-panel/lib/SidePanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,OAAO,EAAsC,MAAM,6BAA6B,CAAC;AAOzF;;;GAGG;AACH,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;EAMhC,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,UAAU,GAAG,WAAW,CAAC;AAExD,MAAM,WAAW,cAAe,SAAQ,OAAO;IAC7C;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC;;;;OAIG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;gBAyCvB,CAAC;AAEH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAKlB;;;;;;;OAOG;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;CAgCN,CAAC"}