@workday/canvas-kit-react 7.0.0-alpha.89-next.16 → 7.0.0-alpha.92-next.19

package/dist/es6/popup/lib/Popup.d.ts

@@ -1,22 +1,258 @@
 import * as React from 'react';
-import { PopupModel } from './hooks';
 export interface PopupProps {
     /**
      * The contents of the Popup. Can be `Popup` children or any valid elements.
      */
     children: React.ReactNode;
-    /**
-     * A PopupModel with optional behavior hooks applied.
-     */
-    model: PopupModel;
 }
-export declare const Popup: import("../../common").Component<PopupProps> & {
-    Heading: import("../../common").ElementComponent<"h2", import("./PopupHeading").PopupHeadingProps>;
-    Body: import("../../common").ElementComponent<"div", import("../..").BorderShorthandStyleProps & import("../..").BorderColorStyleProps & import("../..").BorderRadiusStyleProps & import("../..").BorderLineStyleProps & import("../..").BorderWidthStyleProps & import("../..").BorderLogicalStyleProps & import("../..").ColorStyleProps & import("../..").DepthStyleProps & import("../..").FlexItemStyleProps & import("../..").LayoutStyleProps & import("../../layout/lib/utils/other").OtherStyleProps & import("../..").PositionStandardProps & import("../..").PositionLogicalProps & import("../../layout/lib/utils/space").SpaceStandardProps & import("../../layout/lib/utils/space").SpaceLogicalProps>;
-    Card: import("../../common").ElementComponent<"div", import("./PopupCard").PopupCardProps>;
-    CloseIcon: import("../../common").ElementComponent<"button", import("./PopupCloseIcon").PopupCloseIconProps>;
-    Target: import("../../common").ElementComponent<import("../../common").ElementComponent<"button", import("../..").SecondaryButtonProps>, import("./PopupTarget").PopupTargetProps>;
-    Popper: import("../../common").ElementComponent<"div", import("./PopupPopper").PopupPopperProps>;
-    CloseButton: import("../../common").ElementComponent<import("../../common").ElementComponent<"button", import("../..").SecondaryButtonProps>, import("./PopupCloseButton").PopupCloseButtonProps>;
+export declare const Popup: import("../../common").ComponentM<PopupProps & Partial<{
+    returnFocusRef: React.RefObject<any> | undefined;
+    initialFocusRef: React.RefObject<any> | undefined;
+    id: string;
+    initialVisibility: import("../..").Visibility;
+}> & {
+    onUpdatePlacement?: ((data: {
+        placement: import("@popperjs/core").Placement;
+    }, prevState: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    }) => void) | undefined;
+    onShow?: ((data: {
+        event: Event | React.SyntheticEvent<Element, Event>;
+    } | undefined, prevState: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    }) => void) | undefined;
+    onHide?: ((data: {
+        event: Event | React.SyntheticEvent<Element, Event>;
+    } | undefined, prevState: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    }) => void) | undefined;
+} & {
+    shouldUpdatePlacement?: ((data: {
+        placement: import("@popperjs/core").Placement;
+    }, state: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    }) => boolean) | undefined;
+    shouldShow?: ((data: {
+        event: Event | React.SyntheticEvent<Element, Event>;
+    } | undefined, state: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    }) => boolean) | undefined;
+    shouldHide?: ((data: {
+        event: Event | React.SyntheticEvent<Element, Event>;
+    } | undefined, state: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    }) => boolean) | undefined;
+}, {
+    state: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    };
+    events: {
+        updatePlacement(data: {
+            placement: import("@popperjs/core").Placement;
+        }): void;
+        show(data?: {
+            event: Event | React.SyntheticEvent<Element, Event>;
+        } | undefined): void;
+        hide(data?: {
+            event: Event | React.SyntheticEvent<Element, Event>;
+        } | undefined): void;
+    };
+}> & {
+    Heading: import("../../common").ElementComponentM<"h2", import("./PopupHeading").PopupHeadingProps, {
+        state: {
+            stackRef: React.RefObject<HTMLDivElement>;
+            targetRef: React.RefObject<HTMLButtonElement>;
+            initialFocusRef: React.RefObject<any> | undefined;
+            returnFocusRef: React.RefObject<any> | undefined;
+            placement: import("@popperjs/core").Placement;
+            id: string;
+            visibility: import("../..").Visibility;
+        };
+        events: {
+            updatePlacement(data: {
+                placement: import("@popperjs/core").Placement;
+            }): void;
+            show(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+            hide(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+        };
+    }>;
+    Body: import("../../common").ElementComponentM<"div", import("../..").BorderShorthandStyleProps & import("../..").BorderColorStyleProps & import("../..").BorderRadiusStyleProps & import("../..").BorderLineStyleProps & import("../..").BorderWidthStyleProps & import("../..").BorderLogicalStyleProps & import("../..").ColorStyleProps & import("../..").DepthStyleProps & import("../..").FlexItemStyleProps & import("../..").LayoutStyleProps & import("../../layout/lib/utils/other").OtherStyleProps & import("../..").PositionStandardProps & import("../..").PositionLogicalProps & import("../../layout/lib/utils/space").SpaceStandardProps & import("../../layout/lib/utils/space").SpaceLogicalProps & React.HTMLAttributes<HTMLDivElement>, {
+        state: {
+            stackRef: React.RefObject<HTMLDivElement>;
+            targetRef: React.RefObject<HTMLButtonElement>;
+            initialFocusRef: React.RefObject<any> | undefined;
+            returnFocusRef: React.RefObject<any> | undefined;
+            placement: import("@popperjs/core").Placement;
+            id: string;
+            visibility: import("../..").Visibility;
+        };
+        events: {
+            updatePlacement(data: {
+                placement: import("@popperjs/core").Placement;
+            }): void;
+            show(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+            hide(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+        };
+    }>;
+    Card: import("../../common").ElementComponentM<"div", import("./PopupCard").PopupCardProps, {
+        state: {
+            stackRef: React.RefObject<HTMLDivElement>;
+            targetRef: React.RefObject<HTMLButtonElement>;
+            initialFocusRef: React.RefObject<any> | undefined;
+            returnFocusRef: React.RefObject<any> | undefined;
+            placement: import("@popperjs/core").Placement;
+            id: string;
+            visibility: import("../..").Visibility;
+        };
+        events: {
+            updatePlacement(data: {
+                placement: import("@popperjs/core").Placement;
+            }): void;
+            show(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+            hide(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+        };
+    }>;
+    CloseIcon: import("../../common").ElementComponentM<"button", import("./PopupCloseIcon").PopupCloseIconProps, {
+        state: {
+            stackRef: React.RefObject<HTMLDivElement>;
+            targetRef: React.RefObject<HTMLButtonElement>;
+            initialFocusRef: React.RefObject<any> | undefined;
+            returnFocusRef: React.RefObject<any> | undefined;
+            placement: import("@popperjs/core").Placement;
+            id: string;
+            visibility: import("../..").Visibility;
+        };
+        events: {
+            updatePlacement(data: {
+                placement: import("@popperjs/core").Placement;
+            }): void;
+            show(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+            hide(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+        };
+    }>;
+    Target: import("../../common").ElementComponentM<import("../../common").ElementComponent<"button", import("../..").SecondaryButtonProps>, {}, {
+        state: {
+            stackRef: React.RefObject<HTMLDivElement>;
+            targetRef: React.RefObject<HTMLButtonElement>;
+            initialFocusRef: React.RefObject<any> | undefined;
+            returnFocusRef: React.RefObject<any> | undefined;
+            placement: import("@popperjs/core").Placement;
+            id: string;
+            visibility: import("../..").Visibility;
+        };
+        events: {
+            updatePlacement(data: {
+                placement: import("@popperjs/core").Placement;
+            }): void;
+            show(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+            hide(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+        };
+    }>;
+    Popper: import("../../common").ElementComponentM<"div", import("./PopupPopper").PopupPopperProps, {
+        state: {
+            stackRef: React.RefObject<HTMLDivElement>;
+            targetRef: React.RefObject<HTMLButtonElement>;
+            initialFocusRef: React.RefObject<any> | undefined;
+            returnFocusRef: React.RefObject<any> | undefined;
+            placement: import("@popperjs/core").Placement;
+            id: string;
+            visibility: import("../..").Visibility;
+        };
+        events: {
+            updatePlacement(data: {
+                placement: import("@popperjs/core").Placement;
+            }): void;
+            show(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+            hide(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+        };
+    }>;
+    CloseButton: import("../../common").ElementComponentM<import("../../common").ElementComponent<"button", import("../..").SecondaryButtonProps>, import("./PopupCloseButton").PopupCloseButtonProps, {
+        state: {
+            stackRef: React.RefObject<HTMLDivElement>;
+            targetRef: React.RefObject<HTMLButtonElement>;
+            initialFocusRef: React.RefObject<any> | undefined;
+            returnFocusRef: React.RefObject<any> | undefined;
+            placement: import("@popperjs/core").Placement;
+            id: string;
+            visibility: import("../..").Visibility;
+        };
+        events: {
+            updatePlacement(data: {
+                placement: import("@popperjs/core").Placement;
+            }): void;
+            show(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+            hide(data?: {
+                event: Event | React.SyntheticEvent<Element, Event>;
+            } | undefined): void;
+        };
+    }>;
 };
 //# sourceMappingURL=Popup.d.ts.map

package/dist/es6/popup/lib/Popup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../popup/lib/Popup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,UAAU,EAAmC,MAAM,SAAS,CAAC;AASrE,MAAM,WAAW,UAAU;IACzB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,KAAK,EAAE,UAAU,CAAC;CACnB;AAED,eAAO,MAAM,KAAK;;;;;;;;CAehB,CAAC"}
+{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../popup/lib/Popup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,MAAM,WAAW,UAAU;IACzB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAchB,CAAC"}

package/dist/es6/popup/lib/Popup.js

@@ -1,17 +1,6 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import * as React from 'react';
-import { createComponent, useDefaultModel } from '@workday/canvas-kit-react/common';
-import { usePopupModel, PopupModelContext } from './hooks';
+import { createContainer } from '@workday/canvas-kit-react/common';
+import { usePopupModel } from './hooks';
 import { PopupCard } from './PopupCard';
 import { PopupTarget } from './PopupTarget';
 import { PopupPopper } from './PopupPopper';
@@ -19,13 +8,9 @@ import { PopupHeading } from './PopupHeading';
 import { PopupCloseIcon } from './PopupCloseIcon';
 import { PopupCloseButton } from './PopupCloseButton';
 import { PopupBody } from './PopupBody';
-export var Popup = createComponent()({
+export var Popup = createContainer()({
     displayName: 'Popup',
-    Component: function (_a) {
-        var children = _a.children, model = _a.model, config = __rest(_a, ["children", "model"]);
-        var value = useDefaultModel(model, config, usePopupModel);
-        return React.createElement(PopupModelContext.Provider, { value: value }, children);
-    },
+    modelHook: usePopupModel,
     subComponents: {
         Heading: PopupHeading,
         Body: PopupBody,
@@ -35,4 +20,7 @@ export var Popup = createComponent()({
         Popper: PopupPopper,
         CloseButton: PopupCloseButton,
     },
+})(function (_a) {
+    var children = _a.children;
+    return React.createElement(React.Fragment, null, children);
 });

package/dist/es6/popup/lib/PopupBody.d.ts

@@ -1,2 +1,24 @@
-export declare const PopupBody: import("../../common").ElementComponent<"div", import("../..").BorderShorthandStyleProps & import("../..").BorderColorStyleProps & import("../..").BorderRadiusStyleProps & import("../..").BorderLineStyleProps & import("../..").BorderWidthStyleProps & import("../..").BorderLogicalStyleProps & import("../..").ColorStyleProps & import("../..").DepthStyleProps & import("../..").FlexItemStyleProps & import("../..").LayoutStyleProps & import("../../layout/lib/utils/other").OtherStyleProps & import("../..").PositionStandardProps & import("../..").PositionLogicalProps & import("../../layout/lib/utils/space").SpaceStandardProps & import("../../layout/lib/utils/space").SpaceLogicalProps>;
+import * as React from 'react';
+export declare const PopupBody: import("../../common").ElementComponentM<"div", import("../..").BorderShorthandStyleProps & import("../..").BorderColorStyleProps & import("../..").BorderRadiusStyleProps & import("../..").BorderLineStyleProps & import("../..").BorderWidthStyleProps & import("../..").BorderLogicalStyleProps & import("../..").ColorStyleProps & import("../..").DepthStyleProps & import("../..").FlexItemStyleProps & import("../..").LayoutStyleProps & import("../../layout/lib/utils/other").OtherStyleProps & import("../..").PositionStandardProps & import("../..").PositionLogicalProps & import("../../layout/lib/utils/space").SpaceStandardProps & import("../../layout/lib/utils/space").SpaceLogicalProps & React.HTMLAttributes<HTMLDivElement>, {
+    state: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    };
+    events: {
+        updatePlacement(data: {
+            placement: import("@popperjs/core").Placement;
+        }): void;
+        show(data?: {
+            event: Event | React.SyntheticEvent<Element, Event>;
+        } | undefined): void;
+        hide(data?: {
+            event: Event | React.SyntheticEvent<Element, Event>;
+        } | undefined): void;
+    };
+}>;
 //# sourceMappingURL=PopupBody.d.ts.map

package/dist/es6/popup/lib/PopupBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PopupBody.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupBody.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,SAAS,grBAKpB,CAAC"}
+{"version":3,"file":"PopupBody.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;EAKpB,CAAC"}

package/dist/es6/popup/lib/PopupBody.js

@@ -10,11 +10,12 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import * as React from 'react';
-import { createComponent } from '@workday/canvas-kit-react/common';
+import { createSubcomponent } from '@workday/canvas-kit-react/common';
 import { Card } from '@workday/canvas-kit-react/card';
-export var PopupBody = createComponent('div')({
+import { usePopupModel } from './hooks';
+export var PopupBody = createSubcomponent('div')({
     displayName: 'Popup.Body',
-    Component: function (props, ref) {
-        return React.createElement(Card.Body, __assign({ overflowY: "auto" }, props));
-    },
+    modelHook: usePopupModel,
+})(function (elemProps) {
+    return React.createElement(Card.Body, __assign({ overflowY: "auto" }, elemProps));
 });

package/dist/es6/popup/lib/PopupCard.d.ts

@@ -2,14 +2,29 @@ import * as React from 'react';
 import { Card } from '@workday/canvas-kit-react/card';
 import { ExtractProps } from '@workday/canvas-kit-react/common';
 import { StackStyleProps } from '@workday/canvas-kit-react/layout';
-import { PopupModel } from './hooks';
 export interface PopupCardProps extends ExtractProps<typeof Card, never>, Partial<StackStyleProps> {
-    /**
-     * Optionally pass a model directly to this component. Default is to implicitly use the same
-     * model as the container component which uses React context. Only use this for advanced use-cases
-     */
-    model?: PopupModel;
     children?: React.ReactNode;
 }
-export declare const PopupCard: import("../../common").ElementComponent<"div", PopupCardProps>;
+export declare const PopupCard: import("../../common").ElementComponentM<"div", PopupCardProps, {
+    state: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    };
+    events: {
+        updatePlacement(data: {
+            placement: import("@popperjs/core").Placement;
+        }): void;
+        show(data?: {
+            event: Event | React.SyntheticEvent<Element, Event>;
+        } | undefined): void;
+        hide(data?: {
+            event: Event | React.SyntheticEvent<Element, Event>;
+        } | undefined): void;
+    };
+}>;
 //# sourceMappingURL=PopupCard.d.ts.map

package/dist/es6/popup/lib/PopupCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PopupCard.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,IAAI,EAAC,MAAM,gCAAgC,CAAC;AAEpD,OAAO,EAOL,YAAY,EAEb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAQ,eAAe,EAAC,MAAM,kCAAkC,CAAC;AAGxE,OAAO,EAAe,UAAU,EAAoB,MAAM,SAAS,CAAC;AAEpE,MAAM,WAAW,cAAe,SAAQ,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC;IAChG;;;OAGG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAmCD,eAAO,MAAM,SAAS,gEAmCpB,CAAC"}
+{"version":3,"file":"PopupCard.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAC,IAAI,EAAC,MAAM,gCAAgC,CAAC;AAEpD,OAAO,EAKL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAQ,eAAe,EAAC,MAAM,kCAAkC,CAAC;AAKxE,MAAM,WAAW,cAAe,SAAQ,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC;IAChG,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAmCD,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;EAgCpB,CAAC"}

package/dist/es6/popup/lib/PopupCard.js

@@ -28,10 +28,10 @@ import * as React from 'react';
 import { keyframes } from '@emotion/react';
 import { Card } from '@workday/canvas-kit-react/card';
 import { space, type } from '@workday/canvas-kit-react/tokens';
-import { styled, getTranslateFromOrigin, createComponent, useModelContext, useConstant, } from '@workday/canvas-kit-react/common';
+import { styled, getTranslateFromOrigin, useConstant, createSubcomponent, } from '@workday/canvas-kit-react/common';
 import { Stack } from '@workday/canvas-kit-react/layout';
 import { getTransformFromPlacement } from './getTransformFromPlacement';
-import { usePopupCard, PopupModelContext } from './hooks';
+import { usePopupCard, usePopupModel } from './hooks';
 var popupAnimation = function (transformOrigin) {
     var translate = getTranslateFromOrigin(transformOrigin, space.xxs);
     return keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    0% {\n      opacity: 0;\n      transform: translate(", "px, ", "px);\n    }\n    100% {\n      opacity: 1;\n      transform: translate(0);\n    }\n  "], ["\n    0% {\n      opacity: 0;\n      transform: translate(", "px, ", "px);\n    }\n    100% {\n      opacity: 1;\n      transform: translate(0);\n    }\n  "])), translate.x, translate.y);
@@ -52,21 +52,18 @@ var StyledPopupCard = styled(Card)(type.levels.subtext.large, function (_a) {
         },
     };
 });
-export var PopupCard = createComponent('div')({
+export var PopupCard = createSubcomponent('div')({
     displayName: 'Popup.Card',
-    Component: function (_a, ref, Element) {
-        var children = _a.children, model = _a.model, elemProps = __rest(_a, ["children", "model"]);
-        var localModel = useModelContext(PopupModelContext, model);
-        var props = usePopupCard(localModel, elemProps, ref);
-        var transformOrigin = React.useMemo(function () {
-            return getTransformFromPlacement(localModel.state.placement || 'bottom');
-        }, [localModel.state.placement]);
-        // As is a Stack that will render an element of `Element`
-        var As = useConstant(function () { return Stack.as(Element); });
-        return (React.createElement(StyledPopupCard, __assign({ as: As, transformOrigin: transformOrigin, position: "relative", padding: "l", depth: 5, maxWidth: "calc(100vw - " + space.l + ")", spacing: 0, flexDirection: "column", minHeight: 0, maxHeight: "calc(100vh - " + (elemProps.margin
-                ? space[elemProps.margin] || elemProps.margin
-                : space.xl) + " * 2)", overflowY: "auto" // force IE11 to limit the flex size of the card. Without this, the body isn't allowed to overflow properly: https://github.com/philipwalton/flexbugs/issues/216#issuecomment-453053557
-         }, props), children));
-    },
+    modelHook: usePopupModel,
+    elemPropsHook: usePopupCard,
+})(function (_a, Element, model) {
+    var children = _a.children, elemProps = __rest(_a, ["children"]);
+    var transformOrigin = React.useMemo(function () {
+        return getTransformFromPlacement(model.state.placement || 'bottom');
+    }, [model.state.placement]);
+    // As is a Stack that will render an element of `Element`
+    var As = useConstant(function () { return Stack.as(Element); });
+    return (React.createElement(StyledPopupCard, __assign({ as: As, transformOrigin: transformOrigin, position: "relative", padding: "l", depth: 5, maxWidth: "calc(100vw - " + space.l + ")", spacing: 0, flexDirection: "column", minHeight: 0, maxHeight: "calc(100vh - " + (elemProps.margin ? space[elemProps.margin] || elemProps.margin : space.xl) + " * 2)", overflowY: "auto" // force IE11 to limit the flex size of the card. Without this, the body isn't allowed to overflow properly: https://github.com/philipwalton/flexbugs/issues/216#issuecomment-453053557
+     }, elemProps), children));
 });
 var templateObject_1;

package/dist/es6/popup/lib/PopupCloseButton.d.ts

@@ -1,12 +1,27 @@
 import * as React from 'react';
-import { PopupModel } from './hooks';
 export interface PopupCloseButtonProps {
-    /**
-     * Optionally pass a model directly to this component. Default is to implicitly use the same
-     * model as the container component which uses React context. Only use this for advanced use-cases
-     */
-    model?: PopupModel;
     children?: React.ReactNode;
 }
-export declare const PopupCloseButton: import("../../common").ElementComponent<import("../../common").ElementComponent<"button", import("../../button").SecondaryButtonProps>, PopupCloseButtonProps>;
+export declare const PopupCloseButton: import("../../common").ElementComponentM<import("../../common").ElementComponent<"button", import("../../button").SecondaryButtonProps>, PopupCloseButtonProps, {
+    state: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    };
+    events: {
+        updatePlacement(data: {
+            placement: import("@popperjs/core").Placement;
+        }): void;
+        show(data?: {
+            event: Event | React.SyntheticEvent<Element, Event>;
+        } | undefined): void;
+        hide(data?: {
+            event: Event | React.SyntheticEvent<Element, Event>;
+        } | undefined): void;
+    };
+}>;
 //# sourceMappingURL=PopupCloseButton.d.ts.map

package/dist/es6/popup/lib/PopupCloseButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PopupCloseButton.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupCloseButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAsB,UAAU,EAAoB,MAAM,SAAS,CAAC;AAE3E,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,gBAAgB,gKAQ3B,CAAC"}
+{"version":3,"file":"PopupCloseButton.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupCloseButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;EAM3B,CAAC"}

package/dist/es6/popup/lib/PopupCloseButton.js

@@ -21,15 +21,14 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import * as React from 'react';
-import { createComponent, useModelContext } from '@workday/canvas-kit-react/common';
+import { createSubcomponent } from '@workday/canvas-kit-react/common';
 import { SecondaryButton } from '@workday/canvas-kit-react/button';
-import { usePopupCloseButton, PopupModelContext } from './hooks';
-export var PopupCloseButton = createComponent(SecondaryButton)({
+import { usePopupCloseButton, usePopupModel } from './hooks';
+export var PopupCloseButton = createSubcomponent(SecondaryButton)({
     displayName: 'Popup.CloseButton',
-    Component: function (_a, ref, Element) {
-        var children = _a.children, model = _a.model, elemProps = __rest(_a, ["children", "model"]);
-        var localModel = useModelContext(PopupModelContext, model);
-        var props = usePopupCloseButton(localModel, elemProps, ref);
-        return React.createElement(Element, __assign({}, props), children);
-    },
+    modelHook: usePopupModel,
+    elemPropsHook: usePopupCloseButton,
+})(function (_a, Element) {
+    var children = _a.children, elemProps = __rest(_a, ["children"]);
+    return React.createElement(Element, __assign({}, elemProps), children);
 });

package/dist/es6/popup/lib/PopupCloseIcon.d.ts

@@ -1,12 +1,28 @@
+import React from 'react';
 import { ExtractProps } from '@workday/canvas-kit-react/common';
 import { TertiaryButton } from '@workday/canvas-kit-react/button';
-import { PopupModel } from './hooks';
 export interface PopupCloseIconProps extends ExtractProps<typeof TertiaryButton, never> {
-    /**
-     * Optionally pass a model directly to this component. Default is to implicitly use the same
-     * model as the container component which uses React context. Only use this for advanced use-cases
-     */
-    model?: PopupModel;
 }
-export declare const PopupCloseIcon: import("../../common").ElementComponent<"button", PopupCloseIconProps>;
+export declare const PopupCloseIcon: import("../../common").ElementComponentM<"button", PopupCloseIconProps, {
+    state: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../..").Visibility;
+    };
+    events: {
+        updatePlacement(data: {
+            placement: import("@popperjs/core").Placement;
+        }): void;
+        show(data?: {
+            event: Event | React.SyntheticEvent<Element, Event>;
+        } | undefined): void;
+        hide(data?: {
+            event: Event | React.SyntheticEvent<Element, Event>;
+        } | undefined): void;
+    };
+}>;
 //# sourceMappingURL=PopupCloseIcon.d.ts.map

package/dist/es6/popup/lib/PopupCloseIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PopupCloseIcon.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupCloseIcon.tsx"],"names":[],"mappings":"AAGA,OAAO,EAKL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,cAAc,EAAC,MAAM,kCAAkC,CAAC;AAEhE,OAAO,EAAsB,UAAU,EAAoB,MAAM,SAAS,CAAC;AAI3E,MAAM,WAAW,mBAAoB,SAAQ,YAAY,CAAC,OAAO,cAAc,EAAE,KAAK,CAAC;IACrF;;;OAGG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;CACpB;AAYD,eAAO,MAAM,cAAc,wEAWzB,CAAC"}
+{"version":3,"file":"PopupCloseIcon.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupCloseIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAIL,YAAY,EACb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,cAAc,EAAC,MAAM,kCAAkC,CAAC;AAMhE,MAAM,WAAW,mBAAoB,SAAQ,YAAY,CAAC,OAAO,cAAc,EAAE,KAAK,CAAC;CAAG;AAQ1F,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;EAMzB,CAAC"}

package/dist/es6/popup/lib/PopupCloseIcon.js

@@ -22,25 +22,20 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React from 'react';
 import { xIcon } from '@workday/canvas-system-icons-web';
-import { styled, createComponent, useModelContext, } from '@workday/canvas-kit-react/common';
+import { styled, createSubcomponent, } from '@workday/canvas-kit-react/common';
 import { TertiaryButton } from '@workday/canvas-kit-react/button';
-import { usePopupCloseButton, PopupModelContext } from './hooks';
+import { usePopupCloseButton, usePopupModel } from './hooks';
 var closeIconSpacing = 4;
 var StyledCloseIcon = styled(TertiaryButton)({
     position: 'absolute',
-}, function (_a) {
-    var size = _a.size;
-    return ({
-        right: closeIconSpacing,
-        top: closeIconSpacing,
-    });
+    right: closeIconSpacing,
+    top: closeIconSpacing,
 });
-export var PopupCloseIcon = createComponent('button')({
+export var PopupCloseIcon = createSubcomponent('button')({
     displayName: 'Popup.CloseIcon',
-    Component: function (_a, ref, Element) {
-        var _b = _a.size, size = _b === void 0 ? 'medium' : _b, children = _a.children, model = _a.model, elemProps = __rest(_a, ["size", "children", "model"]);
-        var localModel = useModelContext(PopupModelContext, model);
-        var props = usePopupCloseButton(localModel, elemProps, ref);
-        return React.createElement(StyledCloseIcon, __assign({ as: Element, size: size, icon: xIcon }, props));
-    },
+    modelHook: usePopupModel,
+    elemPropsHook: usePopupCloseButton,
+})(function (_a, Element) {
+    var children = _a.children, elemProps = __rest(_a, ["children"]);
+    return React.createElement(StyledCloseIcon, __assign({ as: Element, size: "medium", icon: xIcon }, elemProps));
 });