@channel.io/bezier-react 1.5.0 → 1.6.0

package/build/src/components/Stack/Stack/Stack.js

@@ -1,71 +0,0 @@
-import { __rest } from '../../../../node_modules/tslib/tslib.es6.js';
-import e__default, { forwardRef, useRef, Children, isValidElement, cloneElement } from 'react';
-import { Container } from './Stack.styled.js';
-
-/**
- * `Stack` provides an abstraction of **flex layout** so that
- * rendering of child elements **linearly** can be done
- * with simplified options.
- *
- * `Stack` always fills the parent element.
- *
- * Be reminded to list `StackItem`s to be direct child of `Stack`.
- *
- * @example
- *
- * ```tsx
- * <Stack direction="horizontal" spacing={8}>
- *  <StackItem>{ ... }</StackItem>
- *  <StackItem>{ ... }</StackItem>
- * </Stack>
- * ```
- */
-const Stack = forwardRef(function Stack(_a, forwardedRef) {
-  var {
-      as = 'div',
-      testId = 'bezier-react-stack',
-      style,
-      className,
-      interpolation,
-      children,
-      direction,
-      justify = 'start',
-      align = 'stretch',
-      spacing = 0
-    } = _a,
-    rest = __rest(_a, ["as", "testId", "style", "className", "interpolation", "children", "direction", "justify", "align", "spacing"]);
-  const firstValidElementIdx = useRef(-1);
-  return e__default.createElement(Container, Object.assign({
-    ref: forwardedRef,
-    as: as,
-    "data-testid": testId,
-    style: style,
-    className: className,
-    interpolation: interpolation,
-    direction: direction,
-    justify: justify,
-    align: align
-  }, rest), Children.map(children, (element, index) => {
-    var _a;
-    if (!isValidElement(element)) {
-      return element;
-    }
-    /**
-       * NOTE: this assumes that this element is `StackItem`.
-       *
-       * Even if the child is not a `StackItem` component,
-       * it could forward the prop to `StackItem` deeper in the tree,
-       * or implement a custom behavior compatible with `StackItemProps`.
-       */
-    if (firstValidElementIdx.current === -1) {
-      firstValidElementIdx.current = index;
-    }
-    return cloneElement(element, Object.assign(Object.assign({}, element.props), {
-      direction,
-      marginBefore: (_a = element.props.marginBefore) !== null && _a !== void 0 ? _a : index > firstValidElementIdx.current ? spacing : 0
-    }));
-  }));
-});
-
-export { Stack };
-//# sourceMappingURL=Stack.js.map

package/build/src/components/Stack/Stack/Stack.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Stack.js","sources":["../../../../../src/components/Stack/Stack/Stack.tsx"],"sourcesContent":["import React, {\n  Children,\n  cloneElement,\n  forwardRef,\n  isValidElement,\n  useRef,\n} from 'react'\nimport type { Ref } from 'react'\n\nimport type StackProps from './Stack.types'\n\nimport * as Styled from './Stack.styled'\n\n/**\n * `Stack` provides an abstraction of **flex layout** so that\n * rendering of child elements **linearly** can be done\n * with simplified options.\n *\n * `Stack` always fills the parent element.\n *\n * Be reminded to list `StackItem`s to be direct child of `Stack`.\n *\n * @example\n *\n * ```tsx\n * <Stack direction=\"horizontal\" spacing={8}>\n *  <StackItem>{ ... }</StackItem>\n *  <StackItem>{ ... }</StackItem>\n * </Stack>\n * ```\n */\nexport const Stack = forwardRef(function Stack(\n  {\n    as = 'div',\n    testId = 'bezier-react-stack',\n    style,\n    className,\n    interpolation,\n    children,\n    direction,\n    justify = 'start',\n    align = 'stretch',\n    spacing = 0,\n    ...rest\n  }: StackProps,\n  forwardedRef: Ref<HTMLElement>,\n) {\n  const firstValidElementIdx = useRef(-1)\n\n  return (\n    <Styled.Container\n      ref={forwardedRef}\n      as={as}\n      data-testid={testId}\n      style={style}\n      className={className}\n      interpolation={interpolation}\n      direction={direction}\n      justify={justify}\n      align={align}\n      {...rest}\n    >\n      { Children.map(\n        children,\n        (element, index) => {\n          if (!isValidElement(element)) { return element }\n\n          /**\n             * NOTE: this assumes that this element is `StackItem`.\n             *\n             * Even if the child is not a `StackItem` component,\n             * it could forward the prop to `StackItem` deeper in the tree,\n             * or implement a custom behavior compatible with `StackItemProps`.\n             */\n          if (firstValidElementIdx.current === -1) { firstValidElementIdx.current = index }\n          return cloneElement(element, {\n            ...element.props,\n            direction,\n            marginBefore:\n                element.props.marginBefore ??\n                (index > firstValidElementIdx.current ? spacing : 0),\n          })\n        },\n\n      ) }\n    </Styled.Container>\n  )\n})\n"],"names":["Stack","forwardRef","_a","forwardedRef","as","testId","style","className","interpolation","children","direction","justify","align","spacing","rest","__rest","firstValidElementIdx","useRef","React","createElement","Styled","ref","Children","map","element","index","isValidElement","current","cloneElement","Object","assign","props","marginBefore"],"mappings":";;;;AAaA;;;;;;;;;;;;;;;;;AAiBG;AACI,MAAMA,KAAK,GAAGC,UAAU,CAAC,SAASD,KAAK,CAC5CE,EAYa,EACbC,YAA8B,EAAA;EAb9B,IAAA;AACEC,MAAAA,EAAE,GAAG,KAAK;AACVC,MAAAA,MAAM,GAAG,oBAAoB;MAC7BC,KAAK;MACLC,SAAS;MACTC,aAAa;MACbC,QAAQ;MACRC,SAAS;AACTC,MAAAA,OAAO,GAAG,OAAO;AACjBC,MAAAA,KAAK,GAAG,SAAS;AACjBC,MAAAA,OAAO,GAAG,CAAA;AAEC,KAAA,GAAAX,EAAA;IADRY,IAAI,GAAAC,MAAA,CAAAb,EAAA,EAXT,+GAYC,CADQ,CAAA;AAIT,EAAA,MAAMc,oBAAoB,GAAGC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAA;EAEvC,OACEC,UAAC,CAAAC,aAAA,CAAAC,SAAgB;AACfC,IAAAA,GAAG,EAAElB,YAAY;AACjBC,IAAAA,EAAE,EAAEA,EAAE;AACO,IAAA,aAAA,EAAAC,MAAM;AACnBC,IAAAA,KAAK,EAAEA,KAAK;AACZC,IAAAA,SAAS,EAAEA,SAAS;AACpBC,IAAAA,aAAa,EAAEA,aAAa;AAC5BE,IAAAA,SAAS,EAAEA,SAAS;AACpBC,IAAAA,OAAO,EAAEA,OAAO;AAChBC,IAAAA,KAAK,EAAEA,KAAAA;AAAK,GAAA,EACRE,IAAI,CAEN,EAAAQ,QAAQ,CAACC,GAAG,CACZd,QAAQ,EACR,CAACe,OAAO,EAAEC,KAAK,KAAI;;AACjB,IAAA,IAAI,CAACC,cAAc,CAACF,OAAO,CAAC,EAAE;AAAE,MAAA,OAAOA,OAAO,CAAA;AAAE,KAAA;AAEhD;;;;;;AAMK;AACL,IAAA,IAAIR,oBAAoB,CAACW,OAAO,KAAK,CAAC,CAAC,EAAE;MAAEX,oBAAoB,CAACW,OAAO,GAAGF,KAAK,CAAA;AAAE,KAAA;AACjF,IAAA,OAAOG,YAAY,CAACJ,OAAO,EAAAK,MAAA,CAAAC,MAAA,CAAAD,MAAA,CAAAC,MAAA,CAAA,EAAA,EACtBN,OAAO,CAACO,KAAK,CAChB,EAAA;MAAArB,SAAS;MACTsB,YAAY,EACR,CAAA9B,EAAA,GAAAsB,OAAO,CAACO,KAAK,CAACC,YAAY,MAAA,IAAA,IAAA9B,EAAA,KAAA,KAAA,CAAA,GAAAA,EAAA,GACzBuB,KAAK,GAAGT,oBAAoB,CAACW,OAAO,GAAGd,OAAO,GAAG,CAAA;OACtD,CAAA;AACJ,GAAC,CAEF,CACgB,CAAA;AAEvB,CAAC;;;;"}

package/build/src/components/Stack/Stack/Stack.styled.d.ts

@@ -1,8 +0,0 @@
-import type StackProps from './Stack.types';
-interface ContainerProps extends Required<Pick<StackProps, 'interpolation' | 'direction' | 'justify' | 'align'>> {
-}
-export declare const Container: import("styled-components").StyledComponent<"div", import("~/src/foundation").Foundation, {
-    foundation?: import("~/src/foundation").Foundation | undefined;
-} & ContainerProps, never>;
-export {};
-//# sourceMappingURL=Stack.styled.d.ts.map

package/build/src/components/Stack/Stack/Stack.styled.js

@@ -1,33 +0,0 @@
-import { flex } from '../util/flexAdapter.js';
-import { styled as FoundationStyled, css as FoundationCSS } from '../../../foundation/FoundationStyledComponent.js';
-
-const Container = FoundationStyled.div`
-  display: flex;
-  width: 100%;
-  height: 100%;
-
-  ${({
-  direction
-}) => FoundationCSS`
-    flex-direction: ${direction === 'horizontal' ? 'row' : 'column'};
-  `}
-
-  ${({
-  justify
-}) => FoundationCSS`
-    justify-content: ${flex(justify)};
-  `}
-
-  ${({
-  align
-}) => FoundationCSS`
-    align-items: ${flex(align)};
-  `}
-
-  ${({
-  interpolation
-}) => interpolation}
-`;
-
-export { Container };
-//# sourceMappingURL=Stack.styled.js.map

package/build/src/components/Stack/Stack/Stack.styled.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Stack.styled.js","sources":["../../../../../src/components/Stack/Stack/Stack.styled.ts"],"sourcesContent":["import {\n  css,\n  styled,\n} from '~/src/foundation'\n\nimport { flex } from '~/src/components/Stack/util'\n\nimport type StackProps from './Stack.types'\n\ninterface ContainerProps extends\n  Required<Pick<StackProps, 'interpolation' | 'direction' | 'justify' | 'align'>> {}\n\nexport const Container = styled.div<ContainerProps>`\n  display: flex;\n  width: 100%;\n  height: 100%;\n\n  ${({ direction }) => css`\n    flex-direction: ${direction === 'horizontal' ? 'row' : 'column'};\n  `}\n\n  ${({ justify }) => css`\n    justify-content: ${flex(justify)};\n  `}\n\n  ${({ align }) => css`\n    align-items: ${flex(align)};\n  `}\n\n  ${({ interpolation }) => interpolation}\n`\n"],"names":["Container","styled","div","direction","css","justify","flex","align","interpolation"],"mappings":";;;AAYaA,MAAAA,SAAS,GAAGC,gBAAM,CAACC,GAAmB,CAAA;;;;;AAK/C,EAAA,EAAA,CAAC;AAAEC,EAAAA,SAAAA;AAAS,CAAE,KAAKC,aAAG,CAAA;sBACJD,SAAS,KAAK,YAAY,GAAG,KAAK,GAAG,QAAQ,CAAA;AAChE,EAAA,CAAA,CAAA;;AAEC,EAAA,EAAA,CAAC;AAAEE,EAAAA,OAAAA;AAAO,CAAE,KAAKD,aAAG,CAAA;qBACDE,EAAAA,IAAI,CAACD,OAAO,CAAC,CAAA;AACjC,EAAA,CAAA,CAAA;;AAEC,EAAA,EAAA,CAAC;AAAEE,EAAAA,KAAAA;AAAK,CAAE,KAAKH,aAAG,CAAA;iBACHE,EAAAA,IAAI,CAACC,KAAK,CAAC,CAAA;AAC3B,EAAA,CAAA,CAAA;;AAEC,EAAA,EAAA,CAAC;AAAEC,EAAAA,aAAAA;AAAa,CAAE,KAAKA,aAAa,CAAA;;;;;"}

package/build/src/components/Stack/Stack/Stack.types.d.ts

@@ -1,49 +0,0 @@
-/// <reference types="react" />
-import type { BezierComponentProps, ChildrenProps } from "../../../types/ComponentProps";
-import type { AxisAlignment } from "../types";
-interface StackOptions {
-    /**
-     * Direction of this stack.
-     *
-     * @remarks
-     *
-     * If you are directly using this prop in application code,
-     * consider using `HStack` or `VStack` instead.
-     */
-    direction: 'horizontal' | 'vertical';
-    /**
-     * Determines the default aligning of children along the main axis.
-     *
-     * The `justify` prop given to child `StackItem` component
-     * overrides the default alignment.
-     *
-     * @default start
-     */
-    justify?: AxisAlignment;
-    /**
-     * Determines the default aligning of children along the cross axis.
-     *
-     * The `align` prop given to child `StackItem` component
-     * overrides the default alignment.
-     *
-     * @default stretch
-     */
-    align?: AxisAlignment;
-    /**
-     * Default spacing between children, in pixels.
-     *
-     * `marginBefore` and `marginAfter` prop given to child `StackItem` component
-     * overrides the default spacing.
-     *
-     * @remarks
-     * `spacing` could be enumerated in later design, if bezier design system
-     * decides to define a guideline for linear layout.
-     *
-     * @default 0
-     */
-    spacing?: number;
-}
-export default interface StackProps extends BezierComponentProps, ChildrenProps, React.HTMLAttributes<HTMLElement>, StackOptions {
-}
-export {};
-//# sourceMappingURL=Stack.types.d.ts.map

package/build/src/components/Stack/Stack/index.d.ts

@@ -1,3 +0,0 @@
-export { Stack } from './Stack';
-export type { default as StackProps } from './Stack.types';
-//# sourceMappingURL=index.d.ts.map

package/build/src/components/Stack/StackItem/StackItem.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-import type StackItemProps from './StackItem.types';
-/**
- * `StackItem` is used along `Stack`.
- * It inherits the default settings from `Stack`,
- * but allows to override some props to customize the behavior
- * of particular item.
- *
- * If you are not using `StackItem` as the direct child of `Stack`,
- * be reminded to forward props in `StackItemProps` to `StackItem` component,
- * or manually implement the behavior compatible with `StackItem`.
- */
-export declare const StackItem: React.ForwardRefExoticComponent<StackItemProps & React.RefAttributes<HTMLElement>>;
-//# sourceMappingURL=StackItem.d.ts.map

package/build/src/components/Stack/StackItem/StackItem.js

@@ -1,61 +0,0 @@
-import e__default, { forwardRef } from 'react';
-import { isNil, isInteger } from '../../../utils/typeUtils.js';
-import { Container } from './StackItem.styled.js';
-
-const sanitizeWeight = weight => {
-  if (weight < 0) {
-    return 0;
-  }
-  if (!isInteger(weight)) {
-    return 0;
-  }
-  return weight;
-};
-/**
- * `StackItem` is used along `Stack`.
- * It inherits the default settings from `Stack`,
- * but allows to override some props to customize the behavior
- * of particular item.
- *
- * If you are not using `StackItem` as the direct child of `Stack`,
- * be reminded to forward props in `StackItemProps` to `StackItem` component,
- * or manually implement the behavior compatible with `StackItem`.
- */
-const StackItem = forwardRef(function StackItem({
-  as = 'div',
-  testId = 'bezier-react-stack-item',
-  style,
-  className,
-  interpolation,
-  children,
-  direction,
-  justify,
-  align,
-  size,
-  weight = 0,
-  grow = false,
-  shrink = false,
-  marginBefore = 0,
-  marginAfter = 0
-}, forwardedRef) {
-  return e__default.createElement(Container, {
-    ref: forwardedRef,
-    as: as,
-    "data-testid": testId,
-    style: Object.assign(Object.assign({}, style), {
-      '--main-axis-size': isNil(size) ? 'initial' : `${size}px`,
-      '--grow-weight': grow ? sanitizeWeight(weight) : '0',
-      '--shrink-weight': shrink ? sanitizeWeight(weight) : '0',
-      '--margin-before': `${marginBefore}px`,
-      '--margin-after': `${marginAfter}px`
-    }),
-    className: className,
-    interpolation: interpolation,
-    direction: direction,
-    justify: justify,
-    align: align
-  }, children);
-});
-
-export { StackItem };
-//# sourceMappingURL=StackItem.js.map

package/build/src/components/Stack/StackItem/StackItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"StackItem.js","sources":["../../../../../src/components/Stack/StackItem/StackItem.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\nimport type { Ref } from 'react'\n\nimport {\n  isInteger,\n  isNil,\n} from '~/src/utils/typeUtils'\n\nimport type StackItemProps from './StackItem.types'\n\nimport * as Styled from './StackItem.styled'\n\nconst sanitizeWeight = (weight: number): number => {\n  if (weight < 0) { return 0 }\n  if (!isInteger(weight)) { return 0 }\n  return weight\n}\n\n/**\n * `StackItem` is used along `Stack`.\n * It inherits the default settings from `Stack`,\n * but allows to override some props to customize the behavior\n * of particular item.\n *\n * If you are not using `StackItem` as the direct child of `Stack`,\n * be reminded to forward props in `StackItemProps` to `StackItem` component,\n * or manually implement the behavior compatible with `StackItem`.\n */\nexport const StackItem = forwardRef(function StackItem(\n  {\n    as = 'div',\n    testId = 'bezier-react-stack-item',\n    style,\n    className,\n    interpolation,\n    children,\n    direction,\n    justify,\n    align,\n    size,\n    weight = 0,\n    grow = false,\n    shrink = false,\n    marginBefore = 0,\n    marginAfter = 0,\n  }: StackItemProps,\n  forwardedRef: Ref<HTMLElement>,\n) {\n  return (\n    <Styled.Container\n      ref={forwardedRef}\n      as={as}\n      data-testid={testId}\n      style={{\n        ...style,\n        '--main-axis-size': isNil(size) ? 'initial' : `${size}px`,\n        '--grow-weight': grow ? sanitizeWeight(weight) : '0',\n        '--shrink-weight': shrink ? sanitizeWeight(weight) : '0',\n        '--margin-before': `${marginBefore}px`,\n        '--margin-after': `${marginAfter}px`,\n      }}\n      className={className}\n      interpolation={interpolation}\n      direction={direction}\n      justify={justify}\n      align={align}\n    >\n      { children }\n    </Styled.Container>\n  )\n})\n"],"names":["sanitizeWeight","weight","isInteger","StackItem","forwardRef","as","testId","style","className","interpolation","children","direction","justify","align","size","grow","shrink","marginBefore","marginAfter","forwardedRef","React","Styled","ref","isNil"],"mappings":";;;;AAYA,MAAMA,cAAc,GAAIC,MAAc,IAAY;EAChD,IAAIA,MAAM,GAAG,CAAC,EAAE;AAAE,IAAA,OAAO,CAAC,CAAA;AAAE,GAAA;AAC5B,EAAA,IAAI,CAACC,SAAS,CAACD,MAAM,CAAC,EAAE;AAAE,IAAA,OAAO,CAAC,CAAA;AAAE,GAAA;AACpC,EAAA,OAAOA,MAAM,CAAA;AACf,CAAC,CAAA;AAED;;;;;;;;;AASG;MACUE,SAAS,GAAGC,UAAU,CAAC,SAASD,SAAS,CACpD;AACEE,EAAAA,EAAE,GAAG,KAAK;AACVC,EAAAA,MAAM,GAAG,yBAAyB;EAClCC,KAAK;EACLC,SAAS;EACTC,aAAa;EACbC,QAAQ;EACRC,SAAS;EACTC,OAAO;EACPC,KAAK;EACLC,IAAI;AACJb,EAAAA,MAAM,GAAG,CAAC;AACVc,EAAAA,IAAI,GAAG,KAAK;AACZC,EAAAA,MAAM,GAAG,KAAK;AACdC,EAAAA,YAAY,GAAG,CAAC;AAChBC,EAAAA,WAAW,GAAG,CAAA;AACC,CAAA,EACjBC,YAA8B,EAAA;AAE9B,EAAA,OACEC,yBAACC,SAAgB,EACf;AAAAC,IAAAA,GAAG,EAAEH,YAAY;AACjBd,IAAAA,EAAE,EAAEA,EAAE;AAAA,IAAA,aAAA,EACOC,MAAM;AACnBC,IAAAA,KAAK,kCACAA,KAAK,CAAA,EAAA;MACR,kBAAkB,EAAEgB,KAAK,CAACT,IAAI,CAAC,GAAG,SAAS,GAAM,CAAAA,EAAAA,IAAQ,CAAA,EAAA,CAAA;MACzD,eAAe,EAAEC,IAAI,GAAGf,cAAc,CAACC,MAAM,CAAC,GAAG,GAAG;MACpD,iBAAiB,EAAEe,MAAM,GAAGhB,cAAc,CAACC,MAAM,CAAC,GAAG,GAAG;MACxD,iBAAiB,EAAE,CAAGgB,EAAAA,YAAgB,CAAA,EAAA,CAAA;MACtC,gBAAgB,EAAK,GAAAC;AAEvB,KAAA,CAAA;AAAAV,IAAAA,SAAS,EAAEA,SAAS;AACpBC,IAAAA,aAAa,EAAEA,aAAa;AAC5BE,IAAAA,SAAS,EAAEA,SAAS;AACpBC,IAAAA,OAAO,EAAEA,OAAO;AAChBC,IAAAA,KAAK,EAAEA,KAAAA;GAEL,EAAAH,QAAQ,CACO,CAAA;AAEvB,CAAC;;;;"}

package/build/src/components/Stack/StackItem/StackItem.styled.d.ts

@@ -1,8 +0,0 @@
-import type StackItemProps from './StackItem.types';
-interface ContainerProps extends Required<Pick<StackItemProps, 'direction' | 'justify' | 'align' | 'interpolation'>> {
-}
-export declare const Container: import("styled-components").StyledComponent<"div", import("~/src/foundation").Foundation, {
-    foundation?: import("~/src/foundation").Foundation | undefined;
-} & ContainerProps, never>;
-export {};
-//# sourceMappingURL=StackItem.styled.d.ts.map

package/build/src/components/Stack/StackItem/StackItem.styled.js

@@ -1,38 +0,0 @@
-import { isNil } from '../../../utils/typeUtils.js';
-import { styled as FoundationStyled, css as FoundationCSS } from '../../../foundation/FoundationStyledComponent.js';
-import { flex } from '../util/flexAdapter.js';
-
-const Container = FoundationStyled.div`
-  ${({
-  justify
-}) => !isNil(justify) && FoundationCSS`
-    justify-self: ${flex(justify)};
-  `}
-
-  ${({
-  align
-}) => !isNil(align) && FoundationCSS`
-    align-self: ${flex(align)};
-  `}
-
-  flex-basis: var(--main-axis-size);
-  flex-grow: var(--grow-weight);
-  flex-shrink: var(--shrink-weight);
-
-  ${({
-  direction
-}) => direction === 'horizontal' ? FoundationCSS`
-        margin-left: var(--margin-before);
-        margin-right: var(--margin-after);
-      ` : FoundationCSS`
-        margin-top: var(--margin-before);
-        margin-bottom: var(--margin-after);
-      `}
-
-  ${({
-  interpolation
-}) => interpolation}
-`;
-
-export { Container };
-//# sourceMappingURL=StackItem.styled.js.map

package/build/src/components/Stack/StackItem/StackItem.styled.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"StackItem.styled.js","sources":["../../../../../src/components/Stack/StackItem/StackItem.styled.ts"],"sourcesContent":["import {\n  css,\n  styled,\n} from '~/src/foundation'\n\nimport { isNil } from '~/src/utils/typeUtils'\n\nimport { flex } from '~/src/components/Stack/util'\n\nimport type StackItemProps from './StackItem.types'\n\ninterface ContainerProps extends\n  Required<Pick<\n  StackItemProps,\n  | 'direction'\n  | 'justify'\n  | 'align'\n  | 'interpolation'>> {}\n\nexport const Container = styled.div<ContainerProps>`\n  ${({ justify }) => !isNil(justify) && css`\n    justify-self: ${flex(justify)};\n  `}\n\n  ${({ align }) => !isNil(align) && css`\n    align-self: ${flex(align)};\n  `}\n\n  flex-basis: var(--main-axis-size);\n  flex-grow: var(--grow-weight);\n  flex-shrink: var(--shrink-weight);\n\n  ${({ direction }) => (\n    direction === 'horizontal'\n      ? css`\n        margin-left: var(--margin-before);\n        margin-right: var(--margin-after);\n      `\n      : css`\n        margin-top: var(--margin-before);\n        margin-bottom: var(--margin-after);\n      `\n  )}\n\n  ${({ interpolation }) => interpolation}\n`\n"],"names":["Container","styled","div","justify","isNil","css","flex","align","direction","interpolation"],"mappings":";;;;AAmBaA,MAAAA,SAAS,GAAGC,gBAAM,CAACC,GAAmB,CAAA;AAC/C,EAAA,EAAA,CAAC;AAAEC,EAAAA,OAAAA;AAAS,CAAA,KAAK,CAACC,KAAK,CAACD,OAAO,CAAC,IAAIE,aAAG,CAAA;kBACvBC,EAAAA,IAAI,CAACH,OAAO,CAAC,CAAA;AAC9B,EAAA,CAAA,CAAA;;AAEC,EAAA,EAAA,CAAC;AAAEI,EAAAA,KAAAA;AAAO,CAAA,KAAK,CAACH,KAAK,CAACG,KAAK,CAAC,IAAIF,aAAG,CAAA;gBACrBC,EAAAA,IAAI,CAACC,KAAK,CAAC,CAAA;AAC1B,EAAA,CAAA,CAAA;;;;;;IAMC,CAAC;AAAEC,EAAAA,SAAAA;AAAW,CAAA,KACdA,SAAS,KAAK,YAAY,GACtBH,aAAG,CAAA;;;AAGJ,MAAA,CAAA,GACCA,aAAG,CAAA;;;MAIR,CAAA,CAAA;;AAEC,EAAA,EAAA,CAAC;AAAEI,EAAAA,aAAAA;AAAa,CAAE,KAAKA,aAAa,CAAA;;;;;"}

package/build/src/components/Stack/StackItem/StackItem.types.d.ts

@@ -1,81 +0,0 @@
-import type { BezierComponentProps, ChildrenProps } from "../../../types/ComponentProps";
-import type { AxisAlignment } from "../types";
-interface StackItemOptions {
-    /**
-     * Direction of this stack item.
-     *
-     * @remarks
-     *
-     * If you are directly using this prop in application code, don't.
-     * This prop will be provided from parent `Stack` component.
-     */
-    direction?: 'horizontal' | 'vertical';
-    /**
-     * Determines the aligning of this item along the main axis.
-     *
-     * This overrides the default alignment of parent `Stack`.
-     */
-    justify?: AxisAlignment;
-    /**
-     * Determines the aligning of this item along the cross axis.
-     *
-     * This overrides the default alignment of parent `Stack`.
-     */
-    align?: AxisAlignment;
-    /**
-     * Idle size of this component along the main axis, in pixels.
-     *
-     * @default auto
-     */
-    size?: number;
-    /**
-     * Determines how the size of this child behaves
-     * when the main axis size of parent `Stack` expands or shrinks.
-     *
-     * Only non-negative integers are allowed for weight values.
-     *
-     * If the weight is larger, this child will be affected **more** from
-     * the parent size update.
-     *
-     * @default 0
-     */
-    weight?: number;
-    /**
-     * Allows this component to grow as parent expands.
-     *
-     * You might want to use this prop together with `weight`.
-     *
-     * @default false
-     */
-    grow?: boolean;
-    /**
-     * Allows this component to shrink as parent shrinks.
-     *
-     * You might want to use htis prop together with `weight`.
-     *
-     * @default false
-     */
-    shrink?: boolean;
-    /**
-     * Margin between the previous item, in pixels.
-     *
-     * If you do not specify this, the margin will be determined
-     * by the default spacing of parent `Stack`.
-     *
-     * @default 0
-     */
-    marginBefore?: number;
-    /**
-     * Margin after this item, in pixels.
-     *
-     * If you do not specify this, the margin will be determined
-     * by the default spacing of parent `Stack`.
-     *
-     * @default 0
-     */
-    marginAfter?: number;
-}
-export default interface StackItemProps extends BezierComponentProps, ChildrenProps, StackItemOptions {
-}
-export {};
-//# sourceMappingURL=StackItem.types.d.ts.map

package/build/src/components/Stack/StackItem/index.d.ts

@@ -1,3 +0,0 @@
-export { StackItem } from './StackItem';
-export type { default as StackItemProps } from './StackItem.types';
-//# sourceMappingURL=index.d.ts.map

package/build/src/components/Stack/VStack/VStack.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import type VStackProps from './VStack.types';
-/**
- * A container for vertical flex layout.
- */
-export declare const VStack: React.ForwardRefExoticComponent<VStackProps & React.RefAttributes<HTMLElement>>;
-//# sourceMappingURL=VStack.d.ts.map

package/build/src/components/Stack/VStack/VStack.js

@@ -1,15 +0,0 @@
-import e__default, { forwardRef } from 'react';
-import { Stack } from '../Stack/Stack.js';
-
-/**
- * A container for vertical flex layout.
- */
-const VStack = forwardRef(function VStack(props, forwardedRef) {
-  return e__default.createElement(Stack, Object.assign({
-    ref: forwardedRef,
-    direction: "vertical"
-  }, props));
-});
-
-export { VStack };
-//# sourceMappingURL=VStack.js.map

package/build/src/components/Stack/VStack/VStack.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"VStack.js","sources":["../../../../../src/components/Stack/VStack/VStack.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\nimport type { Ref } from 'react'\n\nimport { Stack } from '~/src/components/Stack/Stack'\n\nimport type VStackProps from './VStack.types'\n\n/**\n * A container for vertical flex layout.\n */\nexport const VStack = forwardRef(function VStack(\n  props: VStackProps,\n  forwardedRef: Ref<HTMLElement>,\n) {\n  return (<Stack ref={forwardedRef} direction=\"vertical\" {...props} />)\n})\n"],"names":["VStack","forwardRef","props","forwardedRef","React","createElement","Stack","Object","assign","ref","direction"],"mappings":";;;AAOA;;AAEG;AACI,MAAMA,MAAM,GAAGC,UAAU,CAAC,SAASD,MAAM,CAC9CE,KAAkB,EAClBC,YAA8B,EAAA;EAE9B,OAAQC,UAAA,CAAAC,aAAA,CAACC,KAAK,EAAAC,MAAA,CAAAC,MAAA,CAAA;AAACC,IAAAA,GAAG,EAAEN,YAAY;AAAEO,IAAAA,SAAS,EAAC,UAAA;GAAU,EAAKR,KAAK,CAAA,CAAI,CAAA;AACtE,CAAC;;;;"}

package/build/src/components/Stack/VStack/VStack.types.d.ts

@@ -1,4 +0,0 @@
-import type { StackProps } from "../Stack";
-export default interface VStackProps extends Omit<StackProps, 'direction'> {
-}
-//# sourceMappingURL=VStack.types.d.ts.map

package/build/src/components/Stack/VStack/index.d.ts

@@ -1,3 +0,0 @@
-export { VStack } from './VStack';
-export type { default as VStackProps } from './VStack.types';
-//# sourceMappingURL=index.d.ts.map

package/build/src/components/Stack/index.d.ts

@@ -1,7 +0,0 @@
-export * from './HStack';
-export * from './Spacer';
-export * from './Stack';
-export * from './StackItem';
-export * from './VStack';
-export type { AxisAlignment } from './types';
-//# sourceMappingURL=index.d.ts.map

package/build/src/components/Stack/types/alignment.d.ts

@@ -1,2 +0,0 @@
-export type AxisAlignment = 'start' | 'center' | 'end' | 'stretch';
-//# sourceMappingURL=alignment.d.ts.map

package/build/src/components/Stack/types/index.d.ts

@@ -1,2 +0,0 @@
-export * from './alignment';
-//# sourceMappingURL=index.d.ts.map

package/build/src/components/Stack/util/flexAdapter.d.ts

@@ -1,3 +0,0 @@
-import type { AxisAlignment } from "../types";
-export declare const flex: (alignment: AxisAlignment) => string;
-//# sourceMappingURL=flexAdapter.d.ts.map

package/build/src/components/Stack/util/flexAdapter.js

@@ -1,10 +0,0 @@
-const MAPPED_FLEX_PROPERTIES = {
-  start: 'flex-start',
-  center: 'center',
-  end: 'flex-end',
-  stretch: 'stretch'
-};
-const flex = alignment => MAPPED_FLEX_PROPERTIES[alignment];
-
-export { flex };
-//# sourceMappingURL=flexAdapter.js.map

package/build/src/components/Stack/util/flexAdapter.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"flexAdapter.js","sources":["../../../../../src/components/Stack/util/flexAdapter.ts"],"sourcesContent":["import type { AxisAlignment } from '~/src/components/Stack/types'\n\nconst MAPPED_FLEX_PROPERTIES: Record<AxisAlignment, string> = {\n  start: 'flex-start',\n  center: 'center',\n  end: 'flex-end',\n  stretch: 'stretch',\n}\n\nexport const flex = (alignment: AxisAlignment): string => MAPPED_FLEX_PROPERTIES[alignment]\n"],"names":["MAPPED_FLEX_PROPERTIES","start","center","end","stretch","flex","alignment"],"mappings":"AAEA,MAAMA,sBAAsB,GAAkC;AAC5DC,EAAAA,KAAK,EAAE,YAAY;AACnBC,EAAAA,MAAM,EAAE,QAAQ;AAChBC,EAAAA,GAAG,EAAE,UAAU;AACfC,EAAAA,OAAO,EAAE,SAAA;CACV,CAAA;AAEM,MAAMC,IAAI,GAAIC,SAAwB,IAAaN,sBAAsB,CAACM,SAAS;;;;"}

package/build/src/components/Stack/util/index.d.ts

@@ -1,2 +0,0 @@
-export * from './flexAdapter';
-//# sourceMappingURL=index.d.ts.map

package/build/src/components/Status/Status.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { type StatusProps } from './Status.types';
-export declare const Status: React.MemoExoticComponent<React.ForwardRefExoticComponent<StatusProps & React.RefAttributes<HTMLDivElement>>>;
-//# sourceMappingURL=Status.d.ts.map

package/build/src/components/Status/Status.js

@@ -1,47 +0,0 @@
-import { __rest } from '../../../node_modules/tslib/tslib.es6.js';
-import e__default, { memo, forwardRef } from 'react';
-import { L as r } from '../../../packages/bezier-icons/dist/react/lock.mjs.js';
-import { M as r$1 } from '../../../packages/bezier-icons/dist/react/moon-filled.mjs.js';
-import { StatusType, StatusSize } from './Status.types.js';
-import { Circle, Icon } from './Status.styled.js';
-import { IconSize } from '../Icon/Icon.types.js';
-
-const statusTypesWithIcon = [StatusType.OnlineCrescent, StatusType.OfflineCrescent, StatusType.Lock];
-const statusColor = {
-  [StatusType.Online]: 'bgtxt-green-normal',
-  [StatusType.Offline]: 'bg-black-dark',
-  [StatusType.OnlineCrescent]: 'bgtxt-green-normal',
-  [StatusType.OfflineCrescent]: 'bgtxt-yellow-normal',
-  [StatusType.Lock]: 'txt-black-darker'
-};
-function getStatusCircleBorderWidth(size) {
-  if (size >= StatusSize.L) {
-    return 3;
-  }
-  return 2;
-}
-const Status = memo(forwardRef(function Status(_a, forwardedRef) {
-  var {
-      type,
-      size = StatusSize.M,
-      style
-    } = _a,
-    rest = __rest(_a, ["type", "size", "style"]);
-  const withIcon = statusTypesWithIcon.includes(type);
-  const backgroundColor = withIcon ? 'bg-white-high' : statusColor[type];
-  return e__default.createElement(Circle, Object.assign({
-    ref: forwardedRef,
-    style: Object.assign(Object.assign({}, style), {
-      '--bezier-status-size': `${size}px`,
-      '--bezier-status-bg-color': `var(--${backgroundColor})`,
-      '--bezier-status-border-width': `${getStatusCircleBorderWidth(size)}px`
-    })
-  }, rest), withIcon && e__default.createElement(Icon, {
-    source: type === StatusType.Lock ? r : r$1,
-    size: size <= StatusSize.M ? IconSize.XXXS : IconSize.XS,
-    color: statusColor[type]
-  }));
-}));
-
-export { Status };
-//# sourceMappingURL=Status.js.map

package/build/src/components/Status/Status.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Status.js","sources":["../../../../src/components/Status/Status.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  memo,\n} from 'react'\n\nimport {\n  LockIcon,\n  MoonFilledIcon,\n} from '@channel.io/bezier-icons'\n\nimport type { SemanticNames } from '~/src/foundation'\n\nimport { IconSize } from '~/src/components/Icon'\n\nimport {\n  type StatusProps,\n  StatusSize,\n  StatusType,\n} from './Status.types'\n\nimport * as Styled from './Status.styled'\n\nconst statusTypesWithIcon: Readonly<StatusType[]> = [\n  StatusType.OnlineCrescent,\n  StatusType.OfflineCrescent,\n  StatusType.Lock,\n]\n\nconst statusColor: Readonly<Record<StatusType, SemanticNames>> = {\n  [StatusType.Online]: 'bgtxt-green-normal',\n  [StatusType.Offline]: 'bg-black-dark',\n  [StatusType.OnlineCrescent]: 'bgtxt-green-normal',\n  [StatusType.OfflineCrescent]: 'bgtxt-yellow-normal',\n  [StatusType.Lock]: 'txt-black-darker',\n}\n\nfunction getStatusCircleBorderWidth(size: StatusSize) {\n  if (size >= StatusSize.L) { return 3 }\n  return 2\n}\n\nexport const Status = memo(forwardRef(function Status({\n  type,\n  size = StatusSize.M,\n  style,\n  ...rest\n}: StatusProps, forwardedRef: React.Ref<HTMLDivElement>) {\n  const withIcon = statusTypesWithIcon.includes(type)\n  const backgroundColor = withIcon ? 'bg-white-high' : statusColor[type]\n\n  return (\n    <Styled.Circle\n      ref={forwardedRef}\n      style={{\n        ...style,\n        '--bezier-status-size': `${size}px`,\n        '--bezier-status-bg-color': `var(--${backgroundColor})`,\n        '--bezier-status-border-width': `${getStatusCircleBorderWidth(size)}px`,\n      }}\n      {...rest}\n    >\n      { withIcon && (\n        <Styled.Icon\n          source={type === StatusType.Lock ? LockIcon : MoonFilledIcon}\n          size={size <= StatusSize.M ? IconSize.XXXS : IconSize.XS}\n          color={statusColor[type]}\n        />\n      ) }\n    </Styled.Circle>\n  )\n}))\n"],"names":["statusTypesWithIcon","StatusType","OnlineCrescent","OfflineCrescent","Lock","statusColor","Online","Offline","getStatusCircleBorderWidth","size","StatusSize","L","Status","memo","forwardRef","_a","forwardedRef","type","M","style","rest","__rest","withIcon","includes","backgroundColor","React","createElement","Styled","Object","assign","ref","source","LockIcon","MoonFilledIcon","IconSize","XXXS","XS","color"],"mappings":";;;;;;;;AAsBA,MAAMA,mBAAmB,GAA2B,CAClDC,UAAU,CAACC,cAAc,EACzBD,UAAU,CAACE,eAAe,EAC1BF,UAAU,CAACG,IAAI,CAChB,CAAA;AAED,MAAMC,WAAW,GAAgD;AAC/D,EAAA,CAACJ,UAAU,CAACK,MAAM,GAAG,oBAAoB;AACzC,EAAA,CAACL,UAAU,CAACM,OAAO,GAAG,eAAe;AACrC,EAAA,CAACN,UAAU,CAACC,cAAc,GAAG,oBAAoB;AACjD,EAAA,CAACD,UAAU,CAACE,eAAe,GAAG,qBAAqB;EACnD,CAACF,UAAU,CAACG,IAAI,GAAG,kBAAA;CACpB,CAAA;AAED,SAASI,0BAA0B,CAACC,IAAgB,EAAA;AAClD,EAAA,IAAIA,IAAI,IAAIC,UAAU,CAACC,CAAC,EAAE;AAAE,IAAA,OAAO,CAAC,CAAA;AAAE,GAAA;AACtC,EAAA,OAAO,CAAC,CAAA;AACV,CAAA;AAEaC,MAAAA,MAAM,GAAGC,IAAI,CAACC,UAAU,CAAC,SAASF,MAAM,CAACG,EAKxC,EAAEC,YAAuC,EAAA;EALD,IAAA;MACpDC,IAAI;MACJR,IAAI,GAAGC,UAAU,CAACQ,CAAC;AACnBC,MAAAA,KAAAA;AAEY,KAAA,GAAAJ,EAAA;AADTK,IAAAA,IAAI,GAAAC,MAAA,CAAAN,EAAA,EAJ6C,yBAKrD,CADQ,CAAA;AAEP,EAAA,MAAMO,QAAQ,GAAGtB,mBAAmB,CAACuB,QAAQ,CAACN,IAAI,CAAC,CAAA;EACnD,MAAMO,eAAe,GAAGF,QAAQ,GAAG,eAAe,GAAGjB,WAAW,CAACY,IAAI,CAAC,CAAA;EAEtE,OACEQ,UAAC,CAAAC,aAAA,CAAAC,MAAa,EAAAC,MAAA,CAAAC,MAAA,CAAA;AACZC,IAAAA,GAAG,EAAEd,YAAY;AACjBG,IAAAA,KAAK,EAAAS,MAAA,CAAAC,MAAA,CAAAD,MAAA,CAAAC,MAAA,CAAA,EAAA,EACAV,KAAK,CACR,EAAA;MAAA,sBAAsB,EAAK,CAAAV,EAAAA,KAAQ,EAAA,CAAA;MACnC,0BAA0B,EAAW,CAAAe,MAAAA,EAAAA,gBAAkB,CAAA,CAAA;AACvD,MAAA,8BAA8B,EAAK,CAAA,EAAAhB,0BAA0B,CAACC,IAAI;KAEhE,CAAA;AAAA,GAAA,EAAAW,IAAI,GAENE,QAAQ,IACRG,UAAC,CAAAC,aAAA,CAAAC,IAAW,EAAA;IACVI,MAAM,EAAEd,IAAI,KAAKhB,UAAU,CAACG,IAAI,GAAG4B,CAAQ,GAAGC,GAAc;AAC5DxB,IAAAA,IAAI,EAAEA,IAAI,IAAIC,UAAU,CAACQ,CAAC,GAAGgB,QAAQ,CAACC,IAAI,GAAGD,QAAQ,CAACE,EAAE;IACxDC,KAAK,EAAEhC,WAAW,CAACY,IAAI,CAAA;IAE1B,CACa,CAAA;AAEpB,CAAC,CAAC;;;;"}

package/build/src/components/Status/Status.styled.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-export declare const Circle: import("styled-components").StyledComponent<"div", import("~/src/foundation").Foundation, {
-    foundation?: import("~/src/foundation").Foundation | undefined;
-}, never>;
-export declare const Icon: import("styled-components").StyledComponent<import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<import("~/src/components/Icon").IconProps & import("react").RefAttributes<SVGSVGElement>>>, import("~/src/foundation").Foundation, {
-    foundation?: import("~/src/foundation").Foundation | undefined;
-}, never>;
-//# sourceMappingURL=Status.styled.d.ts.map

package/build/src/components/Status/Status.styled.js

@@ -1,34 +0,0 @@
-import { ZIndex } from '../../constants/ZIndex.js';
-import { Icon as Icon$1 } from '../Icon/Icon.js';
-import { absoluteCenter } from '../../foundation/Mixins.js';
-import { styled as FoundationStyled } from '../../foundation/FoundationStyledComponent.js';
-
-const Circle = FoundationStyled.div`
-  position: relative;
-  z-index: ${ZIndex.Base};
-  box-sizing: content-box;
-  width: var(--bezier-status-size);
-  height: var(--bezier-status-size);
-  background-color: var(--bg-white-high);
-  border: var(--bezier-status-border-width) solid var(--bg-white-high);
-  border-radius: 50%;
-
-  &::after {
-    position: absolute;
-    top: 0;
-    left: 0;
-    display: block;
-    width: var(--bezier-status-size);
-    height: var(--bezier-status-size);
-    content: '';
-    background-color: var(--bezier-status-bg-color);
-    border-radius: 50%;
-  }
-`;
-const Icon = FoundationStyled(Icon$1)`
-  ${absoluteCenter('')}
-  z-index: ${ZIndex.Float};
-`;
-
-export { Circle, Icon };
-//# sourceMappingURL=Status.styled.js.map

package/build/src/components/Status/Status.styled.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Status.styled.js","sources":["../../../../src/components/Status/Status.styled.ts"],"sourcesContent":["import {\n  absoluteCenter,\n  styled,\n} from '~/src/foundation'\n\nimport { ZIndex } from '~/src/constants/ZIndex'\n\nimport { Icon as BaseIcon } from '~/src/components/Icon'\n\nexport const Circle = styled.div`\n  position: relative;\n  z-index: ${ZIndex.Base};\n  box-sizing: content-box;\n  width: var(--bezier-status-size);\n  height: var(--bezier-status-size);\n  background-color: var(--bg-white-high);\n  border: var(--bezier-status-border-width) solid var(--bg-white-high);\n  border-radius: 50%;\n\n  &::after {\n    position: absolute;\n    top: 0;\n    left: 0;\n    display: block;\n    width: var(--bezier-status-size);\n    height: var(--bezier-status-size);\n    content: '';\n    background-color: var(--bezier-status-bg-color);\n    border-radius: 50%;\n  }\n`\n\nexport const Icon = styled(BaseIcon)`\n  ${absoluteCenter('')}\n  z-index: ${ZIndex.Float};\n`\n"],"names":["Circle","styled","div","ZIndex","Base","Icon","BaseIcon","absoluteCenter","Float"],"mappings":";;;;;AASaA,MAAAA,MAAM,GAAGC,gBAAM,CAACC,GAAG,CAAA;;AAEnB,WAAAC,EAAAA,MAAM,CAACC,IAAI,CAAA;;;;;;;;;;;;;;;;;;;EAmBvB;MAEYC,IAAI,GAAGJ,gBAAM,CAACK,MAAQ,CAAC,CAAA;EAChCC,EAAAA,cAAc,CAAC,EAAE,CAAC,CAAA;AACT,WAAAJ,EAAAA,MAAM,CAACK,KAAK,CAAA;;;;;"}

package/build/src/components/Status/Status.types.d.ts

@@ -1,20 +0,0 @@
-/// <reference types="react" />
-import type { BezierComponentProps, SizeProps } from "../../types/ComponentProps";
-export declare enum StatusType {
-    Online = "Online",
-    Offline = "Offline",
-    Lock = "Lock",
-    OnlineCrescent = "OnlineCrescent",
-    OfflineCrescent = "OfflineCrescent"
-}
-export declare enum StatusSize {
-    M = 8,
-    L = 14
-}
-interface StatusOptions {
-    type: StatusType;
-}
-export interface StatusProps extends BezierComponentProps, SizeProps<StatusSize>, React.HTMLAttributes<HTMLDivElement>, StatusOptions {
-}
-export {};
-//# sourceMappingURL=Status.types.d.ts.map