@bitrise/bitkit-v2 0.3.284 → 0.3.285

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -11,22 +11,52 @@ var PROMO_BANNER_COLOR = BUTTON_COLORS_MAP.info;
11
11
  var BitkitPromoBanner = (props) => {
12
12
  const { actionable, dismissible, illustration, message, onClose, title, ...rest } = props;
13
13
  return /* @__PURE__ */ jsxs(Alert.Root, {
14
+ ...rest,
14
15
  variant: "info",
15
16
  border: "none",
17
+ position: "relative",
18
+ flexDirection: {
19
+ base: "column",
20
+ tablet: "row"
21
+ },
22
+ alignItems: {
23
+ base: "stretch",
24
+ tablet: "center"
25
+ },
26
+ rowGap: {
27
+ base: "16",
28
+ tablet: "0"
29
+ },
30
+ paddingBlockEnd: {
31
+ base: actionable ? "20" : "16",
32
+ tablet: rem(11)
33
+ },
16
34
  css: { "& .alert__title + *": { marginBlockStart: 0 } },
17
- ...rest,
18
35
  children: [illustration ? /* @__PURE__ */ jsx(Box, {
19
36
  flexShrink: 0,
20
- marginInlineEnd: "12",
37
+ marginInlineEnd: {
38
+ base: "0",
39
+ tablet: "12"
40
+ },
21
41
  "aria-hidden": true,
22
42
  children: illustration
23
43
  }) : /* @__PURE__ */ jsx(Icon, {
24
44
  asChild: true,
25
45
  width: rem(72),
26
46
  height: rem(68),
27
- marginInlineEnd: "12",
28
- marginBlock: rem(-11),
29
- marginInlineStart: rem(-12),
47
+ flexShrink: 0,
48
+ marginInlineEnd: {
49
+ base: "0",
50
+ tablet: "12"
51
+ },
52
+ marginBlock: {
53
+ base: "0",
54
+ tablet: rem(-11)
55
+ },
56
+ marginInlineStart: {
57
+ base: "0",
58
+ tablet: rem(-12)
59
+ },
30
60
  children: /* @__PURE__ */ jsx(ForwardRef, {})
31
61
  }), /* @__PURE__ */ jsx(NotificationContent, {
32
62
  action: actionable,
@@ -34,6 +64,7 @@ var BitkitPromoBanner = (props) => {
34
64
  dismissible,
35
65
  messageText: message,
36
66
  onClose,
67
+ stackable: true,
37
68
  titleText: title
38
69
  })]
39
70
  });
@@ -1 +1 @@
1
- {"version":3,"file":"BitkitPromoBanner.js","names":[],"sources":["../../../lib/components/BitkitPromoBanner/BitkitPromoBanner.tsx"],"sourcesContent":["import { Alert, type AlertRootProps } from '@chakra-ui/react/alert';\nimport { Box } from '@chakra-ui/react/box';\nimport { Icon } from '@chakra-ui/react/icon';\nimport { type ReactNode } from 'react';\n\nimport { rem } from '../../theme/themeUtils';\nimport { NotificationContent } from '../common/NotificationContent';\nimport { BUTTON_COLORS_MAP, type NotificationAction } from '../common/notificationMaps';\nimport MascotSvg from './mascot.svg?react';\n\nexport type PromoBannerAction = NotificationAction;\n\nconst PROMO_BANNER_COLOR = BUTTON_COLORS_MAP.info;\n\nexport interface BitkitPromoBannerProps extends Omit<AlertRootProps, 'title' | 'variant'> {\n actionable?: PromoBannerAction;\n dismissible?: boolean;\n /** Custom leading illustration. Defaults to the built-in mascot. */\n illustration?: ReactNode;\n message: ReactNode;\n onClose?: () => void;\n title: ReactNode;\n}\n\nconst BitkitPromoBanner = (props: BitkitPromoBannerProps) => {\n const { actionable, dismissible, illustration, message, onClose, title, ...rest } = props;\n\n return (\n <Alert.Root variant=\"info\" border=\"none\" css={{ '& .alert__title + *': { marginBlockStart: 0 } }} {...rest}>\n {illustration ? (\n <Box flexShrink={0} marginInlineEnd=\"12\" aria-hidden>\n {illustration}\n </Box>\n ) : (\n <Icon\n asChild\n width={rem(72)}\n height={rem(68)}\n marginInlineEnd=\"12\"\n marginBlock={rem(-11)}\n marginInlineStart={rem(-12)}\n >\n <MascotSvg />\n </Icon>\n )}\n <NotificationContent\n action={actionable}\n colorVariant={PROMO_BANNER_COLOR}\n dismissible={dismissible}\n messageText={message}\n onClose={onClose}\n titleText={title}\n />\n </Alert.Root>\n );\n};\n\nBitkitPromoBanner.displayName = 'BitkitPromoBanner';\n\nexport default BitkitPromoBanner;\n"],"mappings":";;;;;;;;;AAYA,IAAM,qBAAqB,kBAAkB;AAY7C,IAAM,qBAAqB,UAAkC;CAC3D,MAAM,EAAE,YAAY,aAAa,cAAc,SAAS,SAAS,OAAO,GAAG,SAAS;CAEpF,OACE,qBAAC,MAAM,MAAP;EAAY,SAAQ;EAAO,QAAO;EAAO,KAAK,EAAE,uBAAuB,EAAE,kBAAkB,EAAE,EAAE;EAAG,GAAI;YAAtG,CACG,eACC,oBAAC,KAAD;GAAK,YAAY;GAAG,iBAAgB;GAAK,eAAA;aACtC;EACE,CAAA,IAEL,oBAAC,MAAD;GACE,SAAA;GACA,OAAO,IAAI,EAAE;GACb,QAAQ,IAAI,EAAE;GACd,iBAAgB;GAChB,aAAa,IAAI,GAAG;GACpB,mBAAmB,IAAI,GAAG;aAE1B,oBAAC,YAAD,CAAY,CAAA;EACR,CAAA,GAER,oBAAC,qBAAD;GACE,QAAQ;GACR,cAAc;GACD;GACb,aAAa;GACJ;GACT,WAAW;EACZ,CAAA,CACS;;AAEhB;AAEA,kBAAkB,cAAc"}
1
+ {"version":3,"file":"BitkitPromoBanner.js","names":[],"sources":["../../../lib/components/BitkitPromoBanner/BitkitPromoBanner.tsx"],"sourcesContent":["import { Alert, type AlertRootProps } from '@chakra-ui/react/alert';\nimport { Box } from '@chakra-ui/react/box';\nimport { Icon } from '@chakra-ui/react/icon';\nimport { type ReactNode } from 'react';\n\nimport { rem } from '../../theme/themeUtils';\nimport { NotificationContent } from '../common/NotificationContent';\nimport { BUTTON_COLORS_MAP, type NotificationAction } from '../common/notificationMaps';\nimport MascotSvg from './mascot.svg?react';\n\nexport type PromoBannerAction = NotificationAction;\n\nconst PROMO_BANNER_COLOR = BUTTON_COLORS_MAP.info;\n\nexport interface BitkitPromoBannerProps extends Omit<AlertRootProps, 'title' | 'variant'> {\n actionable?: PromoBannerAction;\n dismissible?: boolean;\n /** Custom leading illustration. Defaults to the built-in mascot. */\n illustration?: ReactNode;\n message: ReactNode;\n onClose?: () => void;\n title: ReactNode;\n}\n\nconst BitkitPromoBanner = (props: BitkitPromoBannerProps) => {\n const { actionable, dismissible, illustration, message, onClose, title, ...rest } = props;\n\n return (\n <Alert.Root\n {...rest}\n variant=\"info\"\n border=\"none\"\n position=\"relative\"\n flexDirection={{ base: 'column', tablet: 'row' }}\n alignItems={{ base: 'stretch', tablet: 'center' }}\n rowGap={{ base: '16', tablet: '0' }}\n paddingBlockEnd={{ base: actionable ? '20' : '16', tablet: rem(11) }}\n css={{ '& .alert__title + *': { marginBlockStart: 0 } }}\n >\n {illustration ? (\n <Box flexShrink={0} marginInlineEnd={{ base: '0', tablet: '12' }} aria-hidden>\n {illustration}\n </Box>\n ) : (\n <Icon\n asChild\n width={rem(72)}\n height={rem(68)}\n flexShrink={0}\n marginInlineEnd={{ base: '0', tablet: '12' }}\n marginBlock={{ base: '0', tablet: rem(-11) }}\n marginInlineStart={{ base: '0', tablet: rem(-12) }}\n >\n <MascotSvg />\n </Icon>\n )}\n <NotificationContent\n action={actionable}\n colorVariant={PROMO_BANNER_COLOR}\n dismissible={dismissible}\n messageText={message}\n onClose={onClose}\n stackable\n titleText={title}\n />\n </Alert.Root>\n );\n};\n\nBitkitPromoBanner.displayName = 'BitkitPromoBanner';\n\nexport default BitkitPromoBanner;\n"],"mappings":";;;;;;;;;AAYA,IAAM,qBAAqB,kBAAkB;AAY7C,IAAM,qBAAqB,UAAkC;CAC3D,MAAM,EAAE,YAAY,aAAa,cAAc,SAAS,SAAS,OAAO,GAAG,SAAS;CAEpF,OACE,qBAAC,MAAM,MAAP;EACE,GAAI;EACJ,SAAQ;EACR,QAAO;EACP,UAAS;EACT,eAAe;GAAE,MAAM;GAAU,QAAQ;EAAM;EAC/C,YAAY;GAAE,MAAM;GAAW,QAAQ;EAAS;EAChD,QAAQ;GAAE,MAAM;GAAM,QAAQ;EAAI;EAClC,iBAAiB;GAAE,MAAM,aAAa,OAAO;GAAM,QAAQ,IAAI,EAAE;EAAE;EACnE,KAAK,EAAE,uBAAuB,EAAE,kBAAkB,EAAE,EAAE;YATxD,CAWG,eACC,oBAAC,KAAD;GAAK,YAAY;GAAG,iBAAiB;IAAE,MAAM;IAAK,QAAQ;GAAK;GAAG,eAAA;aAC/D;EACE,CAAA,IAEL,oBAAC,MAAD;GACE,SAAA;GACA,OAAO,IAAI,EAAE;GACb,QAAQ,IAAI,EAAE;GACd,YAAY;GACZ,iBAAiB;IAAE,MAAM;IAAK,QAAQ;GAAK;GAC3C,aAAa;IAAE,MAAM;IAAK,QAAQ,IAAI,GAAG;GAAE;GAC3C,mBAAmB;IAAE,MAAM;IAAK,QAAQ,IAAI,GAAG;GAAE;aAEjD,oBAAC,YAAD,CAAY,CAAA;EACR,CAAA,GAER,oBAAC,qBAAD;GACE,QAAQ;GACR,cAAc;GACD;GACb,aAAa;GACJ;GACT,WAAA;GACA,WAAW;EACZ,CAAA,CACS;;AAEhB;AAEA,kBAAkB,cAAc"}
@@ -7,7 +7,9 @@ export interface NotificationContentProps {
7
7
  dismissible?: boolean;
8
8
  messageText: ReactNode;
9
9
  onClose?: () => void;
10
+ /** Opt in to responsive stacking below `tablet`. Requires Root `position="relative"`. */
11
+ stackable?: boolean;
10
12
  titleText?: ReactNode;
11
13
  }
12
- export declare const NotificationContent: ({ action, colorVariant, dismissible, messageText, onClose, titleText, }: NotificationContentProps) => import("react").JSX.Element;
14
+ export declare const NotificationContent: ({ action, colorVariant, dismissible, messageText, onClose, stackable, titleText, }: NotificationContentProps) => import("react").JSX.Element;
13
15
  export {};
@@ -19,24 +19,53 @@ var ActionButton = ({ action, colorVariant }) => /* @__PURE__ */ jsx(BitkitColor
19
19
  whiteSpace: "nowrap",
20
20
  children: action.label
21
21
  });
22
- var CloseButton = ({ colorVariant, onClose }) => /* @__PURE__ */ jsx(BitkitCloseButton, {
22
+ var CloseButton = ({ colorVariant, onClose, stackable }) => /* @__PURE__ */ jsx(BitkitCloseButton, {
23
23
  alignSelf: "flex-start",
24
- marginBlock: rem(-4),
25
24
  size: "sm",
26
25
  onClick: onClose,
27
- colorVariant
26
+ colorVariant,
27
+ position: stackable ? {
28
+ base: "absolute",
29
+ tablet: "static"
30
+ } : void 0,
31
+ insetBlockStart: stackable ? "8" : void 0,
32
+ insetInlineEnd: stackable ? "8" : void 0,
33
+ marginBlock: {
34
+ base: stackable ? "0" : rem(-4),
35
+ tablet: rem(-4)
36
+ }
28
37
  });
29
- var NotificationContent = ({ action, colorVariant, dismissible, messageText, onClose, titleText }) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(Box, {
38
+ var NotificationContent = ({ action, colorVariant, dismissible, messageText, onClose, stackable, titleText }) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(Box, {
30
39
  display: "flex",
31
- flex: "1",
40
+ flexDirection: stackable ? {
41
+ base: "column",
42
+ tablet: "row"
43
+ } : void 0,
44
+ flex: stackable ? {
45
+ base: "0 1 0%",
46
+ tablet: "1"
47
+ } : "1",
32
48
  minWidth: "0",
33
49
  flexWrap: "wrap",
34
- alignItems: "center",
50
+ alignItems: stackable ? {
51
+ base: "flex-start",
52
+ tablet: "center"
53
+ } : "center",
35
54
  columnGap: "16",
36
- rowGap: rem(11),
55
+ rowGap: stackable ? {
56
+ base: "20",
57
+ tablet: rem(11)
58
+ } : rem(11),
59
+ paddingInlineEnd: stackable && dismissible ? {
60
+ base: "40",
61
+ tablet: "0"
62
+ } : void 0,
37
63
  children: [/* @__PURE__ */ jsxs(Alert.Content, {
38
64
  minWidth: "0",
39
- flex: `1 1 ${rem(240)}`,
65
+ flex: stackable ? {
66
+ base: "none",
67
+ tablet: `1 1 ${rem(240)}`
68
+ } : `1 1 ${rem(240)}`,
40
69
  children: [titleText && /* @__PURE__ */ jsx(Alert.Title, { children: titleText }), /* @__PURE__ */ jsx(Alert.Description, { children: messageText })]
41
70
  }), !!action && /* @__PURE__ */ jsx(ActionButton, {
42
71
  action,
@@ -44,7 +73,8 @@ var NotificationContent = ({ action, colorVariant, dismissible, messageText, onC
44
73
  })]
45
74
  }), !!dismissible && /* @__PURE__ */ jsx(CloseButton, {
46
75
  colorVariant,
47
- onClose
76
+ onClose,
77
+ stackable
48
78
  })] });
49
79
  //#endregion
50
80
  export { NotificationContent };
@@ -1 +1 @@
1
- {"version":3,"file":"NotificationContent.js","names":[],"sources":["../../../lib/components/common/NotificationContent.tsx"],"sourcesContent":["/* Shared inner structure for notification-like components (Alert, PromoBanner):\n the content + action row and the trailing close button, plus the two buttons themselves.\n Alert.Root is the flex container, so this fragment's row and close button land as flex\n siblings next to the leading visual (indicator / illustration).\n The constants here are load-bearing and must not drift across the two components:\n `rem(11)` rowGap + the button `rem(-4)` bleed keep a single-line notification on 48px,\n and `flex: 1 1 rem(240)` on the content lets the action wrap below the text on narrow widths. */\n\nimport { Alert } from '@chakra-ui/react/alert';\nimport { Box } from '@chakra-ui/react/box';\nimport { type ReactNode } from 'react';\n\nimport { rem } from '../../theme/themeUtils';\nimport BitkitCloseButton, { type BitkitCloseButtonProps } from '../BitkitCloseButton/BitkitCloseButton';\nimport BitkitColorButton, { type BitkitColorButtonProps } from '../BitkitColorButton/BitkitColorButton';\nimport { type BUTTON_COLORS_MAP, type NotificationAction } from './notificationMaps';\n\ntype NotificationColorVariant = (typeof BUTTON_COLORS_MAP)[keyof typeof BUTTON_COLORS_MAP];\n\nconst ActionButton = ({\n action,\n colorVariant,\n}: {\n action: NotificationAction;\n colorVariant: BitkitColorButtonProps['colorVariant'];\n}) => (\n <BitkitColorButton\n as={action.href ? 'a' : 'button'}\n colorVariant={colorVariant}\n {...(action.href && {\n href: action.href,\n target: action.target,\n rel: action.target === '_blank' ? 'noopener noreferrer' : undefined,\n })}\n onClick={action.onClick}\n marginBlock={rem(-4)}\n marginInlineEnd=\"12\"\n whiteSpace=\"nowrap\"\n >\n {action.label}\n </BitkitColorButton>\n);\n\nconst CloseButton = ({\n colorVariant,\n onClose,\n}: {\n colorVariant: BitkitCloseButtonProps['colorVariant'];\n onClose?: () => void;\n}) => (\n <BitkitCloseButton\n alignSelf=\"flex-start\"\n marginBlock={rem(-4)}\n size=\"sm\"\n onClick={onClose}\n colorVariant={colorVariant}\n />\n);\n\nexport interface NotificationContentProps {\n action?: NotificationAction;\n colorVariant: NotificationColorVariant;\n dismissible?: boolean;\n messageText: ReactNode;\n onClose?: () => void;\n titleText?: ReactNode;\n}\n\nexport const NotificationContent = ({\n action,\n colorVariant,\n dismissible,\n messageText,\n onClose,\n titleText,\n}: NotificationContentProps) => (\n <>\n {/* content + action share a wrapping row so the action drops below the text on narrow widths */}\n <Box display=\"flex\" flex=\"1\" minWidth=\"0\" flexWrap=\"wrap\" alignItems=\"center\" columnGap=\"16\" rowGap={rem(11)}>\n <Alert.Content minWidth=\"0\" flex={`1 1 ${rem(240)}`}>\n {titleText && <Alert.Title>{titleText}</Alert.Title>}\n <Alert.Description>{messageText}</Alert.Description>\n </Alert.Content>\n {!!action && <ActionButton action={action} colorVariant={colorVariant} />}\n </Box>\n {!!dismissible && <CloseButton colorVariant={colorVariant} onClose={onClose} />}\n </>\n);\n"],"mappings":";;;;;;;AAmBA,IAAM,gBAAgB,EACpB,QACA,mBAKA,oBAAC,mBAAD;CACE,IAAI,OAAO,OAAO,MAAM;CACV;CACd,GAAK,OAAO,QAAQ;EAClB,MAAM,OAAO;EACb,QAAQ,OAAO;EACf,KAAK,OAAO,WAAW,WAAW,wBAAwB,KAAA;CAC5D;CACA,SAAS,OAAO;CAChB,aAAa,IAAI,EAAE;CACnB,iBAAgB;CAChB,YAAW;WAEV,OAAO;AACS,CAAA;AAGrB,IAAM,eAAe,EACnB,cACA,cAKA,oBAAC,mBAAD;CACE,WAAU;CACV,aAAa,IAAI,EAAE;CACnB,MAAK;CACL,SAAS;CACK;AACf,CAAA;AAYH,IAAa,uBAAuB,EAClC,QACA,cACA,aACA,aACA,SACA,gBAEA,qBAAA,UAAA,EAAA,UAAA,CAEE,qBAAC,KAAD;CAAK,SAAQ;CAAO,MAAK;CAAI,UAAS;CAAI,UAAS;CAAO,YAAW;CAAS,WAAU;CAAK,QAAQ,IAAI,EAAE;WAA3G,CACE,qBAAC,MAAM,SAAP;EAAe,UAAS;EAAI,MAAM,OAAO,IAAI,GAAG;YAAhD,CACG,aAAa,oBAAC,MAAM,OAAP,EAAA,UAAc,UAAuB,CAAA,GACnD,oBAAC,MAAM,aAAP,EAAA,UAAoB,YAA+B,CAAA,CACtC;KACd,CAAC,CAAC,UAAU,oBAAC,cAAD;EAAsB;EAAsB;CAAe,CAAA,CACrE;IACJ,CAAC,CAAC,eAAe,oBAAC,aAAD;CAA2B;CAAuB;AAAU,CAAA,CAC9E,EAAA,CAAA"}
1
+ {"version":3,"file":"NotificationContent.js","names":[],"sources":["../../../lib/components/common/NotificationContent.tsx"],"sourcesContent":["/* Shared inner structure for notification-like components (Alert, PromoBanner):\n the content + action row and the trailing close button, plus the two buttons themselves.\n Alert.Root is the flex container, so this fragment's row and close button land as flex\n siblings next to the leading visual (indicator / illustration).\n The constants here are load-bearing and must not drift across the two components:\n `rem(11)` rowGap + the button `rem(-4)` bleed keep a single-line notification on 48px,\n and `flex: 1 1 rem(240)` on the content lets the action wrap below the text on narrow widths.\n\n `stackable` (opt-in, currently only PromoBanner) makes the elements this fragment owns\n responsive: below `tablet` the content/action row stacks vertically and the close button\n floats to the top-right corner. It positions the button absolutely, so the consuming\n component must give Alert.Root `position=\"relative\"`. Because the button floats over the\n top-right corner (32px at `inset 8` ⇒ a 40px band), the content row reserves a matching\n inline-end gutter below `tablet` so title/message text never runs under it — independent of\n how tall the leading visual is. The leading visual and the Root's own flex direction / gap /\n padding stay with the consumer — they differ per component. */\n\nimport { Alert } from '@chakra-ui/react/alert';\nimport { Box } from '@chakra-ui/react/box';\nimport { type ReactNode } from 'react';\n\nimport { rem } from '../../theme/themeUtils';\nimport BitkitCloseButton, { type BitkitCloseButtonProps } from '../BitkitCloseButton/BitkitCloseButton';\nimport BitkitColorButton, { type BitkitColorButtonProps } from '../BitkitColorButton/BitkitColorButton';\nimport { type BUTTON_COLORS_MAP, type NotificationAction } from './notificationMaps';\n\ntype NotificationColorVariant = (typeof BUTTON_COLORS_MAP)[keyof typeof BUTTON_COLORS_MAP];\n\nconst ActionButton = ({\n action,\n colorVariant,\n}: {\n action: NotificationAction;\n colorVariant: BitkitColorButtonProps['colorVariant'];\n}) => (\n <BitkitColorButton\n as={action.href ? 'a' : 'button'}\n colorVariant={colorVariant}\n {...(action.href && {\n href: action.href,\n target: action.target,\n rel: action.target === '_blank' ? 'noopener noreferrer' : undefined,\n })}\n onClick={action.onClick}\n marginBlock={rem(-4)}\n marginInlineEnd=\"12\"\n whiteSpace=\"nowrap\"\n >\n {action.label}\n </BitkitColorButton>\n);\n\nconst CloseButton = ({\n colorVariant,\n onClose,\n stackable,\n}: {\n colorVariant: BitkitCloseButtonProps['colorVariant'];\n onClose?: () => void;\n stackable?: boolean;\n}) => (\n <BitkitCloseButton\n alignSelf=\"flex-start\"\n size=\"sm\"\n onClick={onClose}\n colorVariant={colorVariant}\n // Below tablet (stackable only) it floats to the top-right corner (needs Root\n // position=\"relative\"); otherwise inline with the -4 bleed that keeps a single line on 48px.\n position={stackable ? { base: 'absolute', tablet: 'static' } : undefined}\n insetBlockStart={stackable ? '8' : undefined}\n insetInlineEnd={stackable ? '8' : undefined}\n marginBlock={{ base: stackable ? '0' : rem(-4), tablet: rem(-4) }}\n />\n);\n\nexport interface NotificationContentProps {\n action?: NotificationAction;\n colorVariant: NotificationColorVariant;\n dismissible?: boolean;\n messageText: ReactNode;\n onClose?: () => void;\n /** Opt in to responsive stacking below `tablet`. Requires Root `position=\"relative\"`. */\n stackable?: boolean;\n titleText?: ReactNode;\n}\n\nexport const NotificationContent = ({\n action,\n colorVariant,\n dismissible,\n messageText,\n onClose,\n stackable,\n titleText,\n}: NotificationContentProps) => (\n <>\n {/* content + action share a wrapping row so the action drops below the text on narrow widths;\n when stacking, the row switches to a column below tablet */}\n <Box\n display=\"flex\"\n flexDirection={stackable ? { base: 'column', tablet: 'row' } : undefined}\n flex={stackable ? { base: '0 1 0%', tablet: '1' } : '1'}\n minWidth=\"0\"\n flexWrap=\"wrap\"\n alignItems={stackable ? { base: 'flex-start', tablet: 'center' } : 'center'}\n columnGap=\"16\"\n rowGap={stackable ? { base: '20', tablet: rem(11) } : rem(11)}\n paddingInlineEnd={stackable && dismissible ? { base: '40', tablet: '0' } : undefined}\n >\n <Alert.Content minWidth=\"0\" flex={stackable ? { base: 'none', tablet: `1 1 ${rem(240)}` } : `1 1 ${rem(240)}`}>\n {titleText && <Alert.Title>{titleText}</Alert.Title>}\n <Alert.Description>{messageText}</Alert.Description>\n </Alert.Content>\n {!!action && <ActionButton action={action} colorVariant={colorVariant} />}\n </Box>\n {!!dismissible && <CloseButton colorVariant={colorVariant} onClose={onClose} stackable={stackable} />}\n </>\n);\n"],"mappings":";;;;;;;AA4BA,IAAM,gBAAgB,EACpB,QACA,mBAKA,oBAAC,mBAAD;CACE,IAAI,OAAO,OAAO,MAAM;CACV;CACd,GAAK,OAAO,QAAQ;EAClB,MAAM,OAAO;EACb,QAAQ,OAAO;EACf,KAAK,OAAO,WAAW,WAAW,wBAAwB,KAAA;CAC5D;CACA,SAAS,OAAO;CAChB,aAAa,IAAI,EAAE;CACnB,iBAAgB;CAChB,YAAW;WAEV,OAAO;AACS,CAAA;AAGrB,IAAM,eAAe,EACnB,cACA,SACA,gBAMA,oBAAC,mBAAD;CACE,WAAU;CACV,MAAK;CACL,SAAS;CACK;CAGd,UAAU,YAAY;EAAE,MAAM;EAAY,QAAQ;CAAS,IAAI,KAAA;CAC/D,iBAAiB,YAAY,MAAM,KAAA;CACnC,gBAAgB,YAAY,MAAM,KAAA;CAClC,aAAa;EAAE,MAAM,YAAY,MAAM,IAAI,EAAE;EAAG,QAAQ,IAAI,EAAE;CAAE;AACjE,CAAA;AAcH,IAAa,uBAAuB,EAClC,QACA,cACA,aACA,aACA,SACA,WACA,gBAEA,qBAAA,UAAA,EAAA,UAAA,CAGE,qBAAC,KAAD;CACE,SAAQ;CACR,eAAe,YAAY;EAAE,MAAM;EAAU,QAAQ;CAAM,IAAI,KAAA;CAC/D,MAAM,YAAY;EAAE,MAAM;EAAU,QAAQ;CAAI,IAAI;CACpD,UAAS;CACT,UAAS;CACT,YAAY,YAAY;EAAE,MAAM;EAAc,QAAQ;CAAS,IAAI;CACnE,WAAU;CACV,QAAQ,YAAY;EAAE,MAAM;EAAM,QAAQ,IAAI,EAAE;CAAE,IAAI,IAAI,EAAE;CAC5D,kBAAkB,aAAa,cAAc;EAAE,MAAM;EAAM,QAAQ;CAAI,IAAI,KAAA;WAT7E,CAWE,qBAAC,MAAM,SAAP;EAAe,UAAS;EAAI,MAAM,YAAY;GAAE,MAAM;GAAQ,QAAQ,OAAO,IAAI,GAAG;EAAI,IAAI,OAAO,IAAI,GAAG;YAA1G,CACG,aAAa,oBAAC,MAAM,OAAP,EAAA,UAAc,UAAuB,CAAA,GACnD,oBAAC,MAAM,aAAP,EAAA,UAAoB,YAA+B,CAAA,CACtC;KACd,CAAC,CAAC,UAAU,oBAAC,cAAD;EAAsB;EAAsB;CAAe,CAAA,CACrE;IACJ,CAAC,CAAC,eAAe,oBAAC,aAAD;CAA2B;CAAuB;CAAoB;AAAY,CAAA,CACpG,EAAA,CAAA"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bitrise/bitkit-v2",
3
3
  "private": false,
4
- "version": "0.3.284",
4
+ "version": "0.3.285",
5
5
  "description": "Bitrise Design System Components built with Chakra UI V3",
6
6
  "keywords": [
7
7
  "react",