@workday/canvas-kit-react 7.0.0-alpha.0-next.6 → 7.0.0-alpha.0-next.7

package/dist/es6/card/lib/Card.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { BoxProps } from '@workday/canvas-kit-labs-react/common';
+import { BoxProps } from '@workday/canvas-kit-react/layout';
 export interface CardProps extends BoxProps {
     /**
      * Children of the Card. Should contain a `<Card.Body>` and an optional `<Card.Heading>`
@@ -8,6 +8,6 @@ export interface CardProps extends BoxProps {
 }
 export declare const Card: import("../../common").ElementComponent<"div", CardProps> & {
     Heading: import("../../common").ElementComponent<"h3", import("./CardHeading").CardHeadingProps>;
-    Body: import("../../common").ElementComponent<"div", import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderShorthandStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderColorStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderRadiusStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderLineStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderWidthStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderLogicalStyleProps & import("@workday/canvas-kit-labs-react/common").ColorStyleProps & import("@workday/canvas-kit-labs-react/common").DepthStyleProps & import("@workday/canvas-kit-labs-react/common").FlexItemStyleProps & import("@workday/canvas-kit-labs-react/common").LayoutStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/other").OtherStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/position").PositionStandardProps & import("@workday/canvas-kit-labs-react/common/lib/utils/position").PositionLogicalProps & import("@workday/canvas-kit-labs-react/common/lib/utils/space").SpaceStandardProps & import("@workday/canvas-kit-labs-react/common/lib/utils/space").SpaceLogicalProps>;
+    Body: import("../../common").ElementComponent<"div", import("../../layout").BorderShorthandStyleProps & import("../../layout").BorderColorStyleProps & import("../../layout").BorderRadiusStyleProps & import("../../layout").BorderLineStyleProps & import("../../layout").BorderWidthStyleProps & import("../../layout").BorderLogicalStyleProps & import("../../layout").ColorStyleProps & import("../../layout").DepthStyleProps & import("../../layout").FlexItemStyleProps & import("../../layout").LayoutStyleProps & import("../../layout/lib/utils/other").OtherStyleProps & import("../../layout").PositionStandardProps & import("../../layout").PositionLogicalProps & import("../../layout/lib/utils/space").SpaceStandardProps & import("../../layout/lib/utils/space").SpaceLogicalProps>;
 };
 //# sourceMappingURL=Card.d.ts.map

package/dist/es6/card/lib/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../card/lib/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAM,QAAQ,EAAC,MAAM,uCAAuC,CAAC;AAKpE,MAAM,WAAW,SAAU,SAAQ,QAAQ;IACzC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,IAAI;;;CAsBf,CAAC"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../card/lib/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAM,QAAQ,EAAC,MAAM,kCAAkC,CAAC;AAK/D,MAAM,WAAW,SAAU,SAAQ,QAAQ;IACzC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,IAAI;;;CAsBf,CAAC"}

package/dist/es6/card/lib/Card.js

@@ -23,7 +23,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import * as React from 'react';
 import { colors } from '@workday/canvas-kit-react/tokens';
 import { createComponent } from '@workday/canvas-kit-react/common';
-import { Box } from '@workday/canvas-kit-labs-react/common';
+import { Box } from '@workday/canvas-kit-react/layout';
 import { CardHeading } from './CardHeading';
 import { CardBody } from './CardBody';
 export var Card = createComponent('div')({

package/dist/es6/card/lib/CardBody.d.ts

@@ -1,2 +1,2 @@
-export declare const CardBody: import("../../common").ElementComponent<"div", import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderShorthandStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderColorStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderRadiusStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderLineStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderWidthStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderLogicalStyleProps & import("@workday/canvas-kit-labs-react/common").ColorStyleProps & import("@workday/canvas-kit-labs-react/common").DepthStyleProps & import("@workday/canvas-kit-labs-react/common").FlexItemStyleProps & import("@workday/canvas-kit-labs-react/common").LayoutStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/other").OtherStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/position").PositionStandardProps & import("@workday/canvas-kit-labs-react/common/lib/utils/position").PositionLogicalProps & import("@workday/canvas-kit-labs-react/common/lib/utils/space").SpaceStandardProps & import("@workday/canvas-kit-labs-react/common/lib/utils/space").SpaceLogicalProps>;
+export declare const CardBody: import("../../common").ElementComponent<"div", import("../../layout").BorderShorthandStyleProps & import("../../layout").BorderColorStyleProps & import("../../layout").BorderRadiusStyleProps & import("../../layout").BorderLineStyleProps & import("../../layout").BorderWidthStyleProps & import("../../layout").BorderLogicalStyleProps & import("../../layout").ColorStyleProps & import("../../layout").DepthStyleProps & import("../../layout").FlexItemStyleProps & import("../../layout").LayoutStyleProps & import("../../layout/lib/utils/other").OtherStyleProps & import("../../layout").PositionStandardProps & import("../../layout").PositionLogicalProps & import("../../layout/lib/utils/space").SpaceStandardProps & import("../../layout/lib/utils/space").SpaceLogicalProps>;
 //# sourceMappingURL=CardBody.d.ts.map

package/dist/es6/card/lib/CardBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardBody.d.ts","sourceRoot":"","sources":["../../../../card/lib/CardBody.tsx"],"names":[],"mappings":"AAQA,eAAO,MAAM,QAAQ,uwCASnB,CAAC"}
+{"version":3,"file":"CardBody.d.ts","sourceRoot":"","sources":["../../../../card/lib/CardBody.tsx"],"names":[],"mappings":"AAQA,eAAO,MAAM,QAAQ,owBASnB,CAAC"}

package/dist/es6/card/lib/CardBody.js

@@ -24,7 +24,7 @@ import * as React from 'react';
 import styled from '@emotion/styled';
 import { type } from '@workday/canvas-kit-react/tokens';
 import { createComponent } from '@workday/canvas-kit-react/common';
-import { Box } from '@workday/canvas-kit-labs-react/common';
+import { Box } from '@workday/canvas-kit-react/layout';
 var Body = styled(Box)(type.levels.subtext.large);
 export var CardBody = createComponent('div')({
     displayName: 'Card.Body',

package/dist/es6/card/lib/CardHeading.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { BoxProps } from '@workday/canvas-kit-labs-react/common';
+import { BoxProps } from '@workday/canvas-kit-react/layout';
 export interface CardHeadingProps extends BoxProps {
     /**
      * The id of the Card heading. Tie this to an `aria-labelledby` for accessibility.

package/dist/es6/card/lib/CardHeading.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardHeading.d.ts","sourceRoot":"","sources":["../../../../card/lib/CardHeading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAM,QAAQ,EAAC,MAAM,uCAAuC,CAAC;AAEpE,MAAM,WAAW,gBAAiB,SAAQ,QAAQ;IAChD;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAMD,eAAO,MAAM,WAAW,iEAStB,CAAC"}
+{"version":3,"file":"CardHeading.d.ts","sourceRoot":"","sources":["../../../../card/lib/CardHeading.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAM,QAAQ,EAAC,MAAM,kCAAkC,CAAC;AAE/D,MAAM,WAAW,gBAAiB,SAAQ,QAAQ;IAChD;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IAEZ,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAMD,eAAO,MAAM,WAAW,iEAStB,CAAC"}

package/dist/es6/card/lib/CardHeading.js

@@ -24,7 +24,7 @@ import * as React from 'react';
 import styled from '@emotion/styled';
 import { type } from '@workday/canvas-kit-react/tokens';
 import { createComponent } from '@workday/canvas-kit-react/common';
-import { Box } from '@workday/canvas-kit-labs-react/common';
+import { Box } from '@workday/canvas-kit-react/layout';
 var Heading = styled(Box.as('h3'))(type.levels.body.large, {
     fontWeight: type.properties.fontWeights.bold,
 });

package/dist/es6/dialog/lib/Dialog.d.ts

@@ -15,7 +15,7 @@ export interface DialogProps extends PopupModelConfig {
     model?: PopupModel;
 }
 export declare const Dialog: import("../../common").Component<DialogProps> & {
-    Body: import("../../common").ElementComponent<"div", import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderShorthandStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderColorStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderRadiusStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderLineStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderWidthStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/border").BorderLogicalStyleProps & import("@workday/canvas-kit-labs-react").ColorStyleProps & import("@workday/canvas-kit-labs-react").DepthStyleProps & import("@workday/canvas-kit-labs-react").FlexItemStyleProps & import("@workday/canvas-kit-labs-react").LayoutStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/other").OtherStyleProps & import("@workday/canvas-kit-labs-react/common/lib/utils/position").PositionStandardProps & import("@workday/canvas-kit-labs-react/common/lib/utils/position").PositionLogicalProps & import("@workday/canvas-kit-labs-react/common/lib/utils/space").SpaceStandardProps & import("@workday/canvas-kit-labs-react/common/lib/utils/space").SpaceLogicalProps>;
+    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("./DialogCard").DialogCardProps>;
     CloseIcon: import("../../common").ElementComponent<"button", import("../../popup/lib/PopupCloseIcon").PopupCloseIconProps>;
     Target: import("../../common").ElementComponent<import("../../common").ElementComponent<"button", import("../..").SecondaryButtonProps>, import("../../popup/lib/PopupTarget").PopupTargetProps>;

package/dist/es6/layout/index.d.ts

@@ -1,6 +1,16 @@
 import Layout from './lib/Layout';
 import Column from './lib/Column';
-export default Layout;
 export { Layout, Column };
-export * from './lib/Layout';
+export * from './lib/Box';
+export * from './lib/utils/border';
+export * from './lib/utils/color';
+export { DepthStyleProps } from './lib/utils/depth';
+export * from './lib/utils/flexItem';
+export * from './lib/utils/layout';
+export * from './lib/utils/position';
+export { SpaceStyleProps } from './lib/utils/space';
+export * from './lib/Flex';
+export * from './lib/Stack';
+export type { FlexStyleProps } from './lib/utils/flex';
+export type { StackSpacing, StackDirection, StackStyleProps } from './lib/utils/stack';
 //# sourceMappingURL=index.d.ts.map

package/dist/es6/layout/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,cAAc,CAAC;AAClC,OAAO,MAAM,MAAM,cAAc,CAAC;AAElC,eAAe,MAAM,CAAC;AACtB,OAAO,EAAC,MAAM,EAAE,MAAM,EAAC,CAAC;AACxB,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,cAAc,CAAC;AAClC,OAAO,MAAM,MAAM,cAAc,CAAC;AAElC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAC,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAClD,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAClD,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,YAAY,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AACvD,YAAY,EAAE,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/es6/layout/index.js

@@ -1,5 +1,11 @@
 import Layout from './lib/Layout';
 import Column from './lib/Column';
-export default Layout;
 export { Layout, Column };
-export * from './lib/Layout';
+export * from './lib/Box';
+export * from './lib/utils/border';
+export * from './lib/utils/color';
+export * from './lib/utils/flexItem';
+export * from './lib/utils/layout';
+export * from './lib/utils/position';
+export * from './lib/Flex';
+export * from './lib/Stack';

package/dist/es6/layout/lib/Box.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { BorderStyleProps } from './utils/border';
+import { ColorStyleProps } from './utils/color';
+import { DepthStyleProps } from './utils/depth';
+import { FlexItemStyleProps } from './utils/flexItem';
+import { LayoutStyleProps } from './utils/layout';
+import { OtherStyleProps } from './utils/other';
+import { PositionStyleProps } from './utils/position';
+import { SpaceStyleProps } from './utils/space';
+export declare type BoxProps = BorderStyleProps & ColorStyleProps & DepthStyleProps & FlexItemStyleProps & LayoutStyleProps & OtherStyleProps & PositionStyleProps & SpaceStyleProps & {
+    children?: React.ReactNode;
+};
+/**
+ * `Box` is a primitive component that provides a common, ergonomic API around Canvas design tokens.
+ * It is highly flexible, and its primary purpose is to build other components.
+ *
+ * @example
+ * import { Box, BoxProps } from '@workday/canvas-kit-react/layout';
+ *
+ * interface CardProps extends BoxProps {
+ *   // card-specific props
+ * }
+ *
+ * // `Card`'s default values are set using `BoxProps`
+ * const Card = (props: CardProps) => (
+ *   <Box depth={2} padding="m" borderRadius="l" {...props}>Hello, Card!</Box>
+ * );
+ *
+ */
+export declare const Box: import("../../common").ElementComponent<"div", import("./utils/border").BorderShorthandStyleProps & import("./utils/border").BorderColorStyleProps & import("./utils/border").BorderRadiusStyleProps & import("./utils/border").BorderLineStyleProps & import("./utils/border").BorderWidthStyleProps & import("./utils/border").BorderLogicalStyleProps & ColorStyleProps & DepthStyleProps & FlexItemStyleProps & LayoutStyleProps & OtherStyleProps & import("./utils/position").PositionStandardProps & import("./utils/position").PositionLogicalProps & import("./utils/space").SpaceStandardProps & import("./utils/space").SpaceLogicalProps>;
+//# sourceMappingURL=Box.d.ts.map

package/dist/es6/layout/lib/Box.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../../layout/lib/Box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAS,gBAAgB,EAAC,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AACrD,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AACrD,OAAO,EAAW,kBAAkB,EAAC,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAS,gBAAgB,EAAC,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AACrD,OAAO,EAAW,kBAAkB,EAAC,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AAErD,oBAAY,QAAQ,GAAG,gBAAgB,GACrC,eAAe,GACf,eAAe,GACf,kBAAkB,GAClB,gBAAgB,GAChB,eAAe,GACf,kBAAkB,GAClB,eAAe,GAAG;IAChB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAqCJ;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,GAAG,unBAad,CAAC"}

package/dist/es6/layout/lib/Box.js

@@ -0,0 +1,74 @@
+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;
+};
+import * as React from 'react';
+import styled from '@emotion/styled';
+import isPropValid from '@emotion/is-prop-valid';
+import { createComponent, useConstant } from '@workday/canvas-kit-react/common';
+// style props
+import { border } from './utils/border';
+import { color } from './utils/color';
+import { depth } from './utils/depth';
+import { flexItem } from './utils/flexItem';
+import { layout } from './utils/layout';
+import { other } from './utils/other';
+import { position } from './utils/position';
+import { space } from './utils/space';
+var omittedProps = ['display', 'color', 'height', 'overflow', 'width', 'border', 'background'];
+var shouldForwardProp = function (prop) {
+    return isPropValid(prop) && !omittedProps.includes(prop);
+};
+// Meant to be used with elements. The `shouldForwardProps` will remove all style props
+var StyledBoxElement = styled('div', { shouldForwardProp: shouldForwardProp })({
+    boxSizing: 'border-box',
+}, border, color, depth, flexItem, layout, position, space);
+// Meant to be used with components. There is no `shouldForwardProps` - all props will be forwarded to the component
+var StyledBoxComponent = styled('div')({
+    boxSizing: 'border-box',
+}, border, color, depth, flexItem, layout, other, position, space);
+/**
+ * `Box` is a primitive component that provides a common, ergonomic API around Canvas design tokens.
+ * It is highly flexible, and its primary purpose is to build other components.
+ *
+ * @example
+ * import { Box, BoxProps } from '@workday/canvas-kit-react/layout';
+ *
+ * interface CardProps extends BoxProps {
+ *   // card-specific props
+ * }
+ *
+ * // `Card`'s default values are set using `BoxProps`
+ * const Card = (props: CardProps) => (
+ *   <Box depth={2} padding="m" borderRadius="l" {...props}>Hello, Card!</Box>
+ * );
+ *
+ */
+export var Box = createComponent('div')({
+    displayName: 'Box',
+    Component: function (_a, ref, Element) {
+        var children = _a.children, elemProps = __rest(_a, ["children"]);
+        var BoxComponent = useConstant(function () {
+            return typeof Element === 'string' ? StyledBoxElement : StyledBoxComponent;
+        });
+        return (React.createElement(BoxComponent, __assign({ as: Element, ref: ref }, elemProps), children));
+    },
+});

package/dist/es6/layout/lib/Flex.d.ts

@@ -0,0 +1,26 @@
+import { BoxProps } from '@workday/canvas-kit-react/layout';
+import { FlexStyleProps } from './utils/flex';
+export declare type FlexProps = BoxProps & FlexStyleProps;
+/**
+ * `Flex` is a low-level layout component that provides a common, ergonomic API for applying CSS flexbox styles.
+ * It is highly flexible, and can be used on its own or to build other components.
+ * `Flex` is built on top of `Box` and has access to all `BoxProps`.
+ *
+ * @example
+ * import { Flex, FlexProps } from '@workday/canvas-kit-react/layout';
+ *
+ * interface CardProps extends FlexProps {
+ *   // card-specific props
+ * }
+ *
+ * // `Card`'s default values are set using `FlexProps`
+ * const Card = (props: CardProps) => (
+ *   <Flex flexDirection="column" alignItems="flex-start" depth={2} space="m" {...props}>
+ *     <h1>Hello, Card!</h1>
+ *     <p>This card uses flexbox to set its layout.</p>
+ *   </Flex>
+ * );
+ *
+ */
+export declare const Flex: 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("./utils/other").OtherStyleProps & import("..").PositionStandardProps & import("..").PositionLogicalProps & import("./utils/space").SpaceStandardProps & import("./utils/space").SpaceLogicalProps & FlexStyleProps>;
+//# sourceMappingURL=Flex.d.ts.map

package/dist/es6/layout/lib/Flex.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flex.d.ts","sourceRoot":"","sources":["../../../../layout/lib/Flex.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAM,QAAQ,EAAC,MAAM,kCAAkC,CAAC;AAE/D,OAAO,EAAO,cAAc,EAAC,MAAM,cAAc,CAAC;AAElD,oBAAY,SAAS,GAAG,QAAQ,GAAG,cAAc,CAAC;AASlD;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,IAAI,gnBASf,CAAC"}

package/dist/es6/layout/lib/Flex.js

@@ -0,0 +1,58 @@
+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;
+};
+import * as React from 'react';
+import styled from '@emotion/styled';
+import { createComponent } from '@workday/canvas-kit-react/common';
+import { Box } from '@workday/canvas-kit-react/layout';
+import { flex } from './utils/flex';
+var StyledFlex = styled(Box)({
+    display: 'flex',
+}, flex);
+/**
+ * `Flex` is a low-level layout component that provides a common, ergonomic API for applying CSS flexbox styles.
+ * It is highly flexible, and can be used on its own or to build other components.
+ * `Flex` is built on top of `Box` and has access to all `BoxProps`.
+ *
+ * @example
+ * import { Flex, FlexProps } from '@workday/canvas-kit-react/layout';
+ *
+ * interface CardProps extends FlexProps {
+ *   // card-specific props
+ * }
+ *
+ * // `Card`'s default values are set using `FlexProps`
+ * const Card = (props: CardProps) => (
+ *   <Flex flexDirection="column" alignItems="flex-start" depth={2} space="m" {...props}>
+ *     <h1>Hello, Card!</h1>
+ *     <p>This card uses flexbox to set its layout.</p>
+ *   </Flex>
+ * );
+ *
+ */
+export var Flex = createComponent('div')({
+    displayName: 'Flex',
+    Component: function (_a, ref, Element) {
+        var children = _a.children, elemProps = __rest(_a, ["children"]);
+        return (React.createElement(StyledFlex, __assign({ as: Element, ref: ref }, elemProps), children));
+    },
+});

package/dist/es6/layout/lib/Stack.d.ts

@@ -0,0 +1,27 @@
+import { FlexProps } from './Flex';
+import { StackStyleProps } from './utils/stack';
+export declare type StackProps = FlexProps & StackStyleProps;
+export declare const Stack: 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("./utils/other").OtherStyleProps & import("..").PositionStandardProps & import("..").PositionLogicalProps & import("./utils/space").SpaceStandardProps & import("./utils/space").SpaceLogicalProps & import("..").FlexStyleProps & StackStyleProps> & {
+    Item: 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("./utils/other").OtherStyleProps & import("..").PositionStandardProps & import("..").PositionLogicalProps & import("./utils/space").SpaceStandardProps & import("./utils/space").SpaceLogicalProps>;
+};
+export interface HStackProps extends StackProps {
+    /**
+     * sets the direction for the stack
+     * @default "row"
+     * */
+    flexDirection?: 'row' | 'row-reverse';
+}
+export declare const HStack: import("../../common").ElementComponent<"div", HStackProps> & {
+    Item: 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("./utils/other").OtherStyleProps & import("..").PositionStandardProps & import("..").PositionLogicalProps & import("./utils/space").SpaceStandardProps & import("./utils/space").SpaceLogicalProps>;
+};
+export interface VStackProps extends StackProps {
+    /**
+     * sets the direction for the stack
+     * @default "column"
+     * */
+    flexDirection?: 'column' | 'column-reverse';
+}
+export declare const VStack: import("../../common").ElementComponent<"div", VStackProps> & {
+    Item: 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("./utils/other").OtherStyleProps & import("..").PositionStandardProps & import("..").PositionLogicalProps & import("./utils/space").SpaceStandardProps & import("./utils/space").SpaceLogicalProps>;
+};
+//# sourceMappingURL=Stack.d.ts.map

package/dist/es6/layout/lib/Stack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stack.d.ts","sourceRoot":"","sources":["../../../../layout/lib/Stack.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAO,SAAS,EAAC,MAAM,QAAQ,CAAC;AAEvC,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AAErD,oBAAY,UAAU,GAAG,SAAS,GAAG,eAAe,CAAC;AA2BrD,eAAO,MAAM,KAAK;;CAehB,CAAC;AAEH,MAAM,WAAW,WAAY,SAAQ,UAAU;IAC7C;;;SAGK;IACL,aAAa,CAAC,EAAE,KAAK,GAAG,aAAa,CAAC;CACvC;AAED,eAAO,MAAM,MAAM;;CAYjB,CAAC;AAEH,MAAM,WAAW,WAAY,SAAQ,UAAU;IAC7C;;;SAGK;IACL,aAAa,CAAC,EAAE,QAAQ,GAAG,gBAAgB,CAAC;CAC7C;AAED,eAAO,MAAM,MAAM;;CAYjB,CAAC"}

package/dist/es6/layout/lib/Stack.js

@@ -0,0 +1,74 @@
+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;
+};
+import * as React from 'react';
+import styled from '@emotion/styled';
+import { createComponent } from '@workday/canvas-kit-react/common';
+import { Box } from '@workday/canvas-kit-react/layout';
+import { Flex } from './Flex';
+import { getValidChildren } from './utils/getValidChildren';
+import { stack } from './utils/stack';
+var StackItem = createComponent('div')({
+    displayName: 'Stack.Item',
+    Component: function (_a, ref, Element) {
+        var children = _a.children, elemProps = __rest(_a, ["children"]);
+        return (React.createElement(Box, __assign({ as: Element, ref: ref, display: "inline-block", flex: "0 0 auto", minWidth: 0 }, elemProps), children));
+    },
+});
+// prevent `spacing` prop from being passed through to the HTML element
+var shouldForwardProp = function (prop) {
+    return prop !== 'spacing';
+};
+var StyledStack = styled(Flex, { shouldForwardProp: shouldForwardProp })(stack);
+export var Stack = createComponent('div')({
+    displayName: 'Stack',
+    Component: function (_a, ref, Element) {
+        var children = _a.children, _b = _a.shouldWrapChildren, shouldWrapChildren = _b === void 0 ? false : _b, elemProps = __rest(_a, ["children", "shouldWrapChildren"]);
+        var validChildren = getValidChildren(children);
+        return (React.createElement(StyledStack, __assign({ as: Element, ref: ref, flexDirection: "row" }, elemProps), shouldWrapChildren
+            ? validChildren.map(function (child) { return React.createElement(StackItem, null, child); })
+            : validChildren));
+    },
+    subComponents: {
+        Item: StackItem,
+    },
+});
+export var HStack = createComponent('div')({
+    displayName: 'HStack',
+    Component: function (_a, ref, Element) {
+        var children = _a.children, elemProps = __rest(_a, ["children"]);
+        return (React.createElement(Stack, __assign({ as: Element, ref: ref, flexDirection: "row" }, elemProps), children));
+    },
+    subComponents: {
+        Item: StackItem,
+    },
+});
+export var VStack = createComponent('div')({
+    displayName: 'VStack',
+    Component: function (_a, ref, Element) {
+        var children = _a.children, elemProps = __rest(_a, ["children"]);
+        return (React.createElement(Stack, __assign({ as: Element, ref: ref, flexDirection: "column" }, elemProps), children));
+    },
+    subComponents: {
+        Item: StackItem,
+    },
+});

package/dist/es6/layout/lib/utils/border.d.ts

@@ -0,0 +1,103 @@
+import { CanvasBorderRadiusKeys, CanvasColor } from '@workday/canvas-kit-react/tokens';
+import { PartialEmotionCanvasTheme } from '@workday/canvas-kit-react/common';
+import { PropertyBorder } from './types';
+/** style props to set the border properties */
+export declare type BorderShorthandStyleProps = {
+    /** sets `border` property */
+    border?: string;
+    /** sets `border-top` property */
+    borderTop?: string;
+    /** sets `border-right` property (no bidirectional support) */
+    borderRight?: string;
+    /** sets `border-bottom` property */
+    borderBottom?: string;
+    /** sets `border-left` property (no bidirectional support) */
+    borderLeft?: string;
+};
+/** style props to set the border color properties */
+export declare type BorderColorStyleProps = {
+    /** sets `border-color` property */
+    borderColor?: CanvasColor | (string & {});
+    /** sets `border-top-color` property */
+    borderTopColor?: CanvasColor | (string & {});
+    /** sets `border-right-color` property (no bidirectional support) */
+    borderRightColor?: CanvasColor | (string & {});
+    /** sets `border-bottom-color` property */
+    borderBottomColor?: CanvasColor | (string & {});
+    /** sets `border-left-color` property (no bidirectional support) */
+    borderLeftColor?: CanvasColor | (string & {});
+};
+/** style props to set the border radius properties */
+export declare type BorderRadiusStyleProps = {
+    /** sets `border-radius` property */
+    borderRadius?: CanvasBorderRadiusKeys | number | (string & {});
+    /** sets `border-top-left-radius` property */
+    borderTopLeftRadius?: CanvasBorderRadiusKeys | number | (string & {});
+    /** sets `border-top-right-radius` property */
+    borderTopRightRadius?: CanvasBorderRadiusKeys | number | (string & {});
+    /** sets `border-bottom-left-radius` property */
+    borderBottomLeftRadius?: CanvasBorderRadiusKeys | number | (string & {});
+    /** sets `border-bottom-right-radius` property */
+    borderBottomRightRadius?: CanvasBorderRadiusKeys | number | (string & {});
+};
+/** style props to set the border style properties */
+export declare type BorderLineStyleProps = {
+    /** sets `border-style` property */
+    borderStyle?: PropertyBorder;
+    /** sets `border-top-style` property */
+    borderTopStyle?: PropertyBorder;
+    /** sets `border-right-style` property (no bidirectional support) */
+    borderRightStyle?: PropertyBorder;
+    /** sets `border-bottom-style` property */
+    borderBottomStyle?: PropertyBorder;
+    /** sets `border-left-style` property (no bidirectional support) */
+    borderLeftStyle?: PropertyBorder;
+};
+/** style props to set the border width properties */
+export declare type BorderWidthStyleProps = {
+    /** sets `border-width` property */
+    borderWidth?: string | number;
+    /** sets `border-top-width` property */
+    borderTopWidth?: string | number;
+    /** sets `border-right-width` property (no bidirectional support) */
+    borderRightWidth?: string | number;
+    /** sets `border-bottom-width` property */
+    borderBottomWidth?: string | number;
+    /** sets `border-left-width` property (no bidirectional support) */
+    borderLeftWidth?: string | number;
+};
+export declare type BorderLogicalStyleProps = {
+    /** sets `border-left` property (bidirectional support) */
+    borderInlineStart?: string;
+    /** sets `border-left-color` property (bidirectional support) */
+    borderInlineStartColor?: CanvasColor | (string & {});
+    /** sets `border-left-style` property (bidirectional support) */
+    borderInlineStartStyle?: PropertyBorder;
+    /** sets `border-left-width` property (bidirectional support) */
+    borderInlineStartWidth?: string | number;
+    /** sets `border-right` property (bidirectional support) */
+    borderInlineEnd?: string;
+    /** sets `border-right-color` property (bidirectional support) */
+    borderInlineEndColor?: CanvasColor | (string & {});
+    /** sets `border-right-style` property (bidirectional support) */
+    borderInlineEndStyle?: PropertyBorder;
+    /** sets `border-right-width` property (bidirectional support) */
+    borderInlineEndWidth?: string | number;
+};
+/** a collection style props for border properties */
+export declare type BorderStyleProps = BorderShorthandStyleProps & BorderColorStyleProps & BorderRadiusStyleProps & BorderLineStyleProps & BorderWidthStyleProps & BorderLogicalStyleProps;
+/**
+ * A style prop function that takes components props and returns border styles. Some props, such as borderRadius and borderColor, are connected to our design tokens.
+ * If no `BorderStyleProps` are found, it returns an empty object.
+ *
+ * @example
+ * // You'll most likely use `border` with low-level, styled components
+ * const BoxExample = () => (
+ *   <Box border={`solid 1px #333333 ${colors.blackPepper400}`}>Hello, border styles!</Box>
+ * );
+ *
+ */
+export declare function border<P extends BorderStyleProps & {
+    theme?: PartialEmotionCanvasTheme;
+}>(props: P): {};
+//# sourceMappingURL=border.d.ts.map

package/dist/es6/layout/lib/utils/border.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"border.d.ts","sourceRoot":"","sources":["../../../../../layout/lib/utils/border.ts"],"names":[],"mappings":"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"}