@workday/canvas-kit-react 7.1.4 → 7.2.0-427-next.2

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

@@ -1,11 +1,12 @@
 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';
-export interface PopupCardProps extends ExtractProps<typeof Card, never>, Partial<StackStyleProps> {
+import { FlexStyleProps } from '@workday/canvas-kit-react/layout';
+export declare type FlexAndBoxProps = ExtractProps<typeof Card, never> & FlexStyleProps;
+export interface PopupCardProps extends FlexAndBoxProps {
     children?: React.ReactNode;
 }
-export declare const PopupCard: import("../../common").ElementComponentM<"div", PopupCardProps, {
+export declare const PopupCard: import("@workday/canvas-kit-react/common").ElementComponentM<"div", PopupCardProps, {
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -13,7 +14,7 @@ export declare const PopupCard: import("../../common").ElementComponentM<"div",
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {

package/dist/commonjs/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,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"}
+{"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,EAAO,cAAc,EAAC,MAAM,kCAAkC,CAAC;AAKtE,oBAAY,eAAe,GAAG,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,GAAG,cAAc,CAAC;AAChF,MAAM,WAAW,cAAe,SAAQ,eAAe;IACrD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAuED,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;EA6BpB,CAAC"}

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

@@ -1,19 +1,4 @@
 "use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -33,33 +18,30 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-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;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PopupCard = void 0;
-var React = __importStar(require("react"));
-var react_1 = require("@emotion/react");
-var card_1 = require("@workday/canvas-kit-react/card");
-var tokens_1 = require("@workday/canvas-kit-react/tokens");
-var common_1 = require("@workday/canvas-kit-react/common");
-var layout_1 = require("@workday/canvas-kit-react/layout");
-var getTransformFromPlacement_1 = require("./getTransformFromPlacement");
-var hooks_1 = require("./hooks");
-var popupAnimation = function (transformOrigin) {
-    var translate = common_1.getTranslateFromOrigin(transformOrigin, tokens_1.space.xxs);
-    return react_1.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);
+const React = __importStar(require("react"));
+const react_1 = require("@emotion/react");
+const card_1 = require("@workday/canvas-kit-react/card");
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const common_1 = require("@workday/canvas-kit-react/common");
+const layout_1 = require("@workday/canvas-kit-react/layout");
+const getTransformFromPlacement_1 = require("./getTransformFromPlacement");
+const hooks_1 = require("./hooks");
+const popupAnimation = (transformOrigin) => {
+    const translate = common_1.getTranslateFromOrigin(transformOrigin, tokens_1.space.xxs);
+    return react_1.keyframes `
+    0% {
+      opacity: 0;
+      transform: translate(${translate.x}px, ${translate.y}px);
+    }
+    100% {
+      opacity: 1;
+      transform: translate(0);
+    }
+  `;
 };
-var StyledPopupCard = common_1.styled(card_1.Card)(tokens_1.type.levels.subtext.large, function (_a) {
-    var transformOrigin = _a.transformOrigin;
+const StyledPopupCard = common_1.styled(card_1.Card)(({ transformOrigin, theme }) => {
     if (transformOrigin == null) {
         return {};
     }
@@ -67,25 +49,55 @@ var StyledPopupCard = common_1.styled(card_1.Card)(tokens_1.type.levels.subtext.
         animation: popupAnimation(transformOrigin),
         animationDuration: '150ms',
         animationTimingFunction: 'ease-out',
-        transformOrigin: transformOrigin.vertical + " " + transformOrigin.horizontal,
+        transformOrigin: `${transformOrigin.vertical} ${transformOrigin.horizontal}`,
+        [theme.canvas.breakpoints.down('s')]: {
+            animation: popupAnimation({ vertical: 'bottom', horizontal: 'center' }),
+            animationDuration: '150ms',
+            animationTimingFunction: 'ease-out',
+            transformOrigin: 'bottom center',
+        },
         // Allow overriding of animation in special cases
         '.wd-no-animation &': {
             animation: 'none',
         },
     };
 });
+function getSpace(value) {
+    if (value && value in tokens_1.space) {
+        return tokens_1.space[value];
+    }
+    else {
+        return value;
+    }
+}
+function getMaxHeight(margin) {
+    // set the default margin offset to space.xl
+    let marginOffset = tokens_1.space.xl;
+    if (margin) {
+        // parse the margin prop
+        if (typeof margin === 'string') {
+            const marginValues = margin.split(' ');
+            const marginTop = getSpace(marginValues[0]);
+            // If provided, use the specific margin-bottom in the shorthand, otherwise use the margin-top value
+            const marginBottom = getSpace(marginValues[2]) || marginTop;
+            marginOffset = `(${marginTop} + ${marginBottom})`;
+        }
+        else {
+            // if margin is a number, double it to get the offset
+            marginOffset = `${margin * 2}px`;
+        }
+    }
+    return `calc(100vh - ${marginOffset})`;
+}
 exports.PopupCard = common_1.createSubcomponent('div')({
     displayName: 'Popup.Card',
     modelHook: hooks_1.usePopupModel,
     elemPropsHook: hooks_1.usePopupCard,
-})(function (_a, Element, model) {
-    var children = _a.children, elemProps = __rest(_a, ["children"]);
-    var transformOrigin = React.useMemo(function () {
+})(({ children, ...elemProps }, Element, model) => {
+    const transformOrigin = React.useMemo(() => {
         return getTransformFromPlacement_1.getTransformFromPlacement(model.state.placement || 'bottom');
     }, [model.state.placement]);
-    // As is a Stack that will render an element of `Element`
-    var As = common_1.useConstant(function () { return layout_1.Stack.as(Element); });
-    return (React.createElement(StyledPopupCard, __assign({ as: As, transformOrigin: transformOrigin, position: "relative", padding: "l", depth: 5, maxWidth: "calc(100vw - " + tokens_1.space.l + ")", spacing: 0, flexDirection: "column", minHeight: 0, maxHeight: "calc(100vh - " + (elemProps.margin ? tokens_1.space[elemProps.margin] || elemProps.margin : tokens_1.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));
+    // As is a Flex that will render an element of `Element`
+    const As = common_1.useConstant(() => layout_1.Flex.as(Element));
+    return (React.createElement(StyledPopupCard, Object.assign({ as: As, transformOrigin: transformOrigin, position: "relative", depth: 5, maxWidth: `calc(100vw - ${tokens_1.space.l})`, flexDirection: "column", minHeight: 0, padding: "m", maxHeight: getMaxHeight(elemProps.margin), overflowY: "auto" }, tokens_1.type.levels.subtext.large, elemProps), children));
 });
-var templateObject_1;

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

@@ -2,7 +2,7 @@ import * as React from 'react';
 export interface PopupCloseButtonProps {
     children?: React.ReactNode;
 }
-export declare const PopupCloseButton: import("../../common").ElementComponentM<import("../../common").ElementComponent<"button", import("../../button").SecondaryButtonProps>, PopupCloseButtonProps, {
+export declare const PopupCloseButton: import("@workday/canvas-kit-react/common").ElementComponentM<import("@workday/canvas-kit-react/common").ElementComponent<"button", import("@workday/canvas-kit-react/button").SecondaryButtonProps>, PopupCloseButtonProps, {
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -10,7 +10,7 @@ export declare const PopupCloseButton: import("../../common").ElementComponentM<
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {

package/dist/commonjs/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;AAO/B,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;EAM3B,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;;;;;;;;;;;;;;;;;EAU3B,CAAC"}

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

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -29,28 +18,16 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-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;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PopupCloseButton = void 0;
-var React = __importStar(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var button_1 = require("@workday/canvas-kit-react/button");
-var hooks_1 = require("./hooks");
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const button_1 = require("@workday/canvas-kit-react/button");
+const hooks_1 = require("./hooks");
 exports.PopupCloseButton = common_1.createSubcomponent(button_1.SecondaryButton)({
     displayName: 'Popup.CloseButton',
     modelHook: hooks_1.usePopupModel,
     elemPropsHook: hooks_1.usePopupCloseButton,
-})(function (_a, Element) {
-    var children = _a.children, elemProps = __rest(_a, ["children"]);
-    return React.createElement(Element, __assign({}, elemProps), children);
+})(({ children, ...elemProps }, Element) => {
+    return (React.createElement(Element, Object.assign({ type: "button" }, elemProps), children));
 });

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

@@ -3,7 +3,7 @@ import { ExtractProps } from '@workday/canvas-kit-react/common';
 import { TertiaryButton } from '@workday/canvas-kit-react/button';
 export interface PopupCloseIconProps extends ExtractProps<typeof TertiaryButton, never> {
 }
-export declare const PopupCloseIcon: import("../../common").ElementComponentM<"button", PopupCloseIconProps, {
+export declare const PopupCloseIcon: import("@workday/canvas-kit-react/common").ElementComponentM<"button", PopupCloseIconProps, {
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -11,7 +11,7 @@ export declare const PopupCloseIcon: import("../../common").ElementComponentM<"b
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {

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

@@ -1 +1 @@
-{"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"}
+{"version":3,"file":"PopupCloseIcon.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupCloseIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAqB,YAAY,EAAC,MAAM,kCAAkC,CAAC;AAClF,OAAO,EAAC,cAAc,EAAC,MAAM,kCAAkC,CAAC;AAKhE,MAAM,WAAW,mBAAoB,SAAQ,YAAY,CAAC,OAAO,cAAc,EAAE,KAAK,CAAC;CAAG;AAE1F,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;EAiBzB,CAAC"}

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

@@ -1,47 +1,19 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-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;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PopupCloseIcon = void 0;
-var react_1 = __importDefault(require("react"));
-var canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
-var common_1 = require("@workday/canvas-kit-react/common");
-var button_1 = require("@workday/canvas-kit-react/button");
-var hooks_1 = require("./hooks");
-var closeIconSpacing = 4;
-var StyledCloseIcon = common_1.styled(button_1.TertiaryButton)({
-    position: 'absolute',
-    right: closeIconSpacing,
-    top: closeIconSpacing,
-});
+const react_1 = __importDefault(require("react"));
+const canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
+const common_1 = require("@workday/canvas-kit-react/common");
+const button_1 = require("@workday/canvas-kit-react/button");
+const tokens_1 = require("@workday/canvas-kit-react/tokens");
+const hooks_1 = require("./hooks");
 exports.PopupCloseIcon = common_1.createSubcomponent('button')({
     displayName: 'Popup.CloseIcon',
     modelHook: hooks_1.usePopupModel,
     elemPropsHook: hooks_1.usePopupCloseButton,
-})(function (_a, Element) {
-    var children = _a.children, elemProps = __rest(_a, ["children"]);
-    return react_1.default.createElement(StyledCloseIcon, __assign({ as: Element, size: "medium", icon: canvas_system_icons_web_1.xIcon }, elemProps));
+})(({ children, ...elemProps }, Element) => {
+    return (react_1.default.createElement(button_1.TertiaryButton, Object.assign({ as: Element, size: "medium", icon: canvas_system_icons_web_1.xIcon, type: "button", position: "absolute", right: tokens_1.space.xxxs, top: tokens_1.space.xxxs }, elemProps)));
 });

package/dist/commonjs/popup/lib/PopupHeading.d.ts

@@ -4,7 +4,7 @@ import { Card } from '@workday/canvas-kit-react/card';
 export interface PopupHeadingProps extends ExtractProps<typeof Card.Heading, never> {
     children?: React.ReactNode;
 }
-export declare const PopupHeading: import("../../common").ElementComponentM<"h2", PopupHeadingProps, {
+export declare const PopupHeading: import("@workday/canvas-kit-react/common").ElementComponentM<"h2", PopupHeadingProps, {
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -12,7 +12,7 @@ export declare const PopupHeading: import("../../common").ElementComponentM<"h2"
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {

package/dist/commonjs/popup/lib/PopupHeading.js

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -29,28 +18,16 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-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;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PopupHeading = void 0;
-var React = __importStar(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var card_1 = require("@workday/canvas-kit-react/card");
-var hooks_1 = require("./hooks");
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const card_1 = require("@workday/canvas-kit-react/card");
+const hooks_1 = require("./hooks");
 exports.PopupHeading = common_1.createSubcomponent('h2')({
     displayName: 'Popup.Heading',
     modelHook: hooks_1.usePopupModel,
     elemPropsHook: hooks_1.usePopupHeading,
-})(function (_a, Element) {
-    var children = _a.children, elemProps = __rest(_a, ["children"]);
-    return (React.createElement(card_1.Card.Heading, __assign({ as: Element, marginBottom: "s" }, elemProps), children));
+})(({ children, ...elemProps }, Element) => {
+    return (React.createElement(card_1.Card.Heading, Object.assign({ as: Element, marginBottom: "xxs", padding: "xxs" }, elemProps), children));
 });

package/dist/commonjs/popup/lib/PopupPopper.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { Placement, PopperOptions } from './Popper';
-export interface PopupPopperProps {
+import { Placement, PopperOptions, PopperProps } from './Popper';
+export interface PopupPopperProps extends PopperProps {
     /**
      * The placement of the `Popper` contents relative to the `anchorElement`. Accepts `auto`, `top`,
      * `right`, `bottom`, or `left`. Each placement can also be modified using any of the following
@@ -12,9 +12,8 @@ export interface PopupPopperProps {
      * The additional options passed to the Popper's `popper.js` instance.
      */
     popperOptions?: Partial<PopperOptions>;
-    children?: React.ReactNode;
 }
-export declare const PopupPopper: import("../../common").ElementComponentM<"div", PopupPopperProps, {
+export declare const PopupPopper: import("@workday/canvas-kit-react/common").ElementComponentM<"div", PopupPopperProps, {
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -22,7 +21,7 @@ export declare const PopupPopper: import("../../common").ElementComponentM<"div"
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {

package/dist/commonjs/popup/lib/PopupPopper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PopupPopper.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupPopper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAC,SAAS,EAAE,aAAa,EAAS,MAAM,UAAU,CAAC;AAE1D,MAAM,WAAW,gBAAgB;IAC/B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;EAMtB,CAAC"}
+{"version":3,"file":"PopupPopper.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupPopper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAC,SAAS,EAAE,aAAa,EAAU,WAAW,EAAC,MAAM,UAAU,CAAC;AAEvE,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACnD;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAC;CACxC;AAED,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;EAMtB,CAAC"}

package/dist/commonjs/popup/lib/PopupPopper.js

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -29,28 +18,16 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
-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;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PopupPopper = void 0;
-var React = __importStar(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var hooks_1 = require("./hooks");
-var Popper_1 = require("./Popper");
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const hooks_1 = require("./hooks");
+const Popper_1 = require("./Popper");
 exports.PopupPopper = common_1.createSubcomponent('div')({
     displayName: 'Popup.Popper',
     modelHook: hooks_1.usePopupModel,
     elemPropsHook: hooks_1.usePopupPopper,
-})(function (_a) {
-    var children = _a.children, elemProps = __rest(_a, ["children"]);
-    return React.createElement(Popper_1.Popper, __assign({}, elemProps), children);
+})(({ children, ...elemProps }) => {
+    return React.createElement(Popper_1.Popper, Object.assign({}, elemProps), children);
 });

package/dist/commonjs/popup/lib/PopupTarget.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 export interface PopupTargetProps {
 }
-export declare const PopupTarget: import("../../common").ElementComponentM<import("../../common").ElementComponent<"button", import("../../button").SecondaryButtonProps>, {}, {
+export declare const PopupTarget: import("@workday/canvas-kit-react/common").ElementComponentM<import("@workday/canvas-kit-react/common").ElementComponent<"button", import("@workday/canvas-kit-react/button").SecondaryButtonProps>, {}, {
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -9,7 +9,7 @@ export declare const PopupTarget: import("../../common").ElementComponentM<impor
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {

package/dist/commonjs/popup/lib/PopupTarget.js

@@ -1,15 +1,4 @@
 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -31,14 +20,14 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PopupTarget = void 0;
-var React = __importStar(require("react"));
-var common_1 = require("@workday/canvas-kit-react/common");
-var button_1 = require("@workday/canvas-kit-react/button");
-var hooks_1 = require("./hooks");
+const React = __importStar(require("react"));
+const common_1 = require("@workday/canvas-kit-react/common");
+const button_1 = require("@workday/canvas-kit-react/button");
+const hooks_1 = require("./hooks");
 exports.PopupTarget = common_1.createSubcomponent(button_1.SecondaryButton)({
     displayName: 'Popup.Target',
     modelHook: hooks_1.usePopupModel,
     elemPropsHook: hooks_1.usePopupTarget,
-})(function (elemProps, Element) {
-    return React.createElement(Element, __assign({}, elemProps));
+})((elemProps, Element) => {
+    return React.createElement(Element, Object.assign({}, elemProps));
 });

package/dist/commonjs/popup/lib/getTransformFromPlacement.js

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getTransformFromPlacement = void 0;
-var getTransformFromPlacement = function (placement) {
-    var _a = placement.split('-'), first = _a[0], second = _a[1];
-    var vertical = first === 'top'
+const getTransformFromPlacement = (placement) => {
+    const [first, second] = placement.split('-');
+    const vertical = first === 'top'
         ? 'bottom'
         : first === 'bottom'
             ? 'top'
@@ -12,7 +12,7 @@ var getTransformFromPlacement = function (placement) {
                 : second === 'start'
                     ? 'bottom'
                     : 'center';
-    var horizontal = first === 'left'
+    const horizontal = first === 'left'
         ? 'right'
         : first === 'right'
             ? 'left'
@@ -22,8 +22,8 @@ var getTransformFromPlacement = function (placement) {
                     ? 'right'
                     : 'center';
     return {
-        vertical: vertical,
-        horizontal: horizontal,
+        vertical,
+        horizontal,
     };
 };
 exports.getTransformFromPlacement = getTransformFromPlacement;