@bitrise/bitkit-v2 0.3.255 → 0.3.257
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.
|
@@ -2,6 +2,7 @@ import BitkitCloseButton from "../BitkitCloseButton/BitkitCloseButton.js";
|
|
|
2
2
|
import { rem } from "../../theme/themeUtils.js";
|
|
3
3
|
import BitkitColorButton from "../BitkitColorButton/BitkitColorButton.js";
|
|
4
4
|
import { BUTTON_COLORS_MAP, ICON_COMPONENTS_MAP } from "../common/notificationMaps.js";
|
|
5
|
+
import { Box } from "@chakra-ui/react/box";
|
|
5
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
7
|
import { Alert } from "@chakra-ui/react/alert";
|
|
7
8
|
//#region lib/components/BitkitAlert/BitkitAlert.tsx
|
|
@@ -16,23 +17,35 @@ var BitkitAlert = (props) => {
|
|
|
16
17
|
asChild: variant !== "progress",
|
|
17
18
|
children: /* @__PURE__ */ jsx(IconComponent, {})
|
|
18
19
|
}),
|
|
19
|
-
/* @__PURE__ */ jsxs(
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
20
|
+
/* @__PURE__ */ jsxs(Box, {
|
|
21
|
+
display: "flex",
|
|
22
|
+
flex: "1",
|
|
23
|
+
minWidth: "0",
|
|
24
|
+
flexWrap: "wrap",
|
|
25
|
+
alignItems: "center",
|
|
26
|
+
columnGap: "16",
|
|
27
|
+
rowGap: rem(11),
|
|
28
|
+
children: [/* @__PURE__ */ jsxs(Alert.Content, {
|
|
29
|
+
minWidth: "0",
|
|
30
|
+
flex: `1 1 ${rem(240)}`,
|
|
31
|
+
children: [titleText && /* @__PURE__ */ jsx(Alert.Title, { children: titleText }), /* @__PURE__ */ jsx(Alert.Description, { children: messageText })]
|
|
32
|
+
}), !!action && /* @__PURE__ */ jsx(BitkitColorButton, {
|
|
33
|
+
as: action.href ? "a" : "button",
|
|
34
|
+
colorVariant: BUTTON_COLORS_MAP[variant],
|
|
35
|
+
...action.href && {
|
|
36
|
+
href: action.href,
|
|
37
|
+
target: action.target,
|
|
38
|
+
rel: action.target === "_blank" ? "noopener noreferrer" : void 0
|
|
39
|
+
},
|
|
40
|
+
onClick: action.onClick,
|
|
41
|
+
marginInlineEnd: "12",
|
|
42
|
+
whiteSpace: "nowrap",
|
|
43
|
+
children: action.label
|
|
44
|
+
})]
|
|
32
45
|
}),
|
|
33
46
|
!!dismissible && /* @__PURE__ */ jsx(BitkitCloseButton, {
|
|
34
47
|
alignSelf: "flex-start",
|
|
35
|
-
marginBlockStart: rem(
|
|
48
|
+
marginBlockStart: rem(-4),
|
|
36
49
|
size: "sm",
|
|
37
50
|
onClick: onClose,
|
|
38
51
|
colorVariant: BUTTON_COLORS_MAP[variant]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitAlert.js","names":[],"sources":["../../../lib/components/BitkitAlert/BitkitAlert.tsx"],"sourcesContent":["import { Alert, type AlertRootProps } from '@chakra-ui/react/alert';\nimport { type ReactNode } from 'react';\n\nimport { type NotificationVariant } from '../../theme/common/AlertAndToast.common';\nimport { rem } from '../../theme/themeUtils';\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport BitkitColorButton from '../BitkitColorButton/BitkitColorButton';\nimport { BUTTON_COLORS_MAP, ICON_COMPONENTS_MAP, type NotificationAction } from '../common/notificationMaps';\n\nexport type AlertVariants = NotificationVariant;\nexport type ActionProps = NotificationAction;\n\nexport interface BitkitAlertProps extends AlertRootProps {\n action?: ActionProps;\n dismissible?: boolean;\n messageText: ReactNode;\n onClose?: () => void;\n titleText?: ReactNode;\n variant: AlertVariants;\n}\n\nconst BitkitAlert = (props: BitkitAlertProps) => {\n const { action, dismissible, messageText, onClose, titleText, variant, ...rest } = props;\n const IconComponent = ICON_COMPONENTS_MAP[variant];\n\n return (\n <Alert.Root variant={variant} {...rest}>\n <Alert.Indicator asChild={variant !== 'progress'}>\n <IconComponent />\n </Alert.Indicator>\n <Alert.Content>\n
|
|
1
|
+
{"version":3,"file":"BitkitAlert.js","names":[],"sources":["../../../lib/components/BitkitAlert/BitkitAlert.tsx"],"sourcesContent":["import { Alert, type AlertRootProps } from '@chakra-ui/react/alert';\nimport { Box } from '@chakra-ui/react/box';\nimport { type ReactNode } from 'react';\n\nimport { type NotificationVariant } from '../../theme/common/AlertAndToast.common';\nimport { rem } from '../../theme/themeUtils';\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport BitkitColorButton from '../BitkitColorButton/BitkitColorButton';\nimport { BUTTON_COLORS_MAP, ICON_COMPONENTS_MAP, type NotificationAction } from '../common/notificationMaps';\n\nexport type AlertVariants = NotificationVariant;\nexport type ActionProps = NotificationAction;\n\nexport interface BitkitAlertProps extends AlertRootProps {\n action?: ActionProps;\n dismissible?: boolean;\n messageText: ReactNode;\n onClose?: () => void;\n titleText?: ReactNode;\n variant: AlertVariants;\n}\n\nconst BitkitAlert = (props: BitkitAlertProps) => {\n const { action, dismissible, messageText, onClose, titleText, variant, ...rest } = props;\n const IconComponent = ICON_COMPONENTS_MAP[variant];\n\n return (\n <Alert.Root variant={variant} {...rest}>\n <Alert.Indicator asChild={variant !== 'progress'}>\n <IconComponent />\n </Alert.Indicator>\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 && (\n <BitkitColorButton\n as={action.href ? 'a' : 'button'}\n colorVariant={BUTTON_COLORS_MAP[variant]}\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 marginInlineEnd=\"12\"\n whiteSpace=\"nowrap\"\n >\n {action.label}\n </BitkitColorButton>\n )}\n </Box>\n {!!dismissible && (\n <BitkitCloseButton\n alignSelf=\"flex-start\"\n // nudge the 32px button up so its center aligns with the 24px indicator/text line\n marginBlockStart={rem(-4)}\n size=\"sm\"\n onClick={onClose}\n colorVariant={BUTTON_COLORS_MAP[variant]}\n />\n )}\n </Alert.Root>\n );\n};\n\nexport default BitkitAlert;\n"],"mappings":";;;;;;;;AAsBA,IAAM,eAAe,UAA4B;CAC/C,MAAM,EAAE,QAAQ,aAAa,aAAa,SAAS,WAAW,SAAS,GAAG,SAAS;CACnF,MAAM,gBAAgB,oBAAoB;CAE1C,OACE,qBAAC,MAAM,MAAP;EAAqB;EAAS,GAAI;YAAlC;GACE,oBAAC,MAAM,WAAP;IAAiB,SAAS,YAAY;cACpC,oBAAC,eAAD,CAAgB,CAAA;GACD,CAAA;GACjB,qBAAC,KAAD;IAAK,SAAQ;IAAO,MAAK;IAAI,UAAS;IAAI,UAAS;IAAO,YAAW;IAAS,WAAU;IAAK,QAAQ,IAAI,EAAE;cAA3G,CACE,qBAAC,MAAM,SAAP;KAAe,UAAS;KAAI,MAAM,OAAO,IAAI,GAAG;eAAhD,CACG,aAAa,oBAAC,MAAM,OAAP,EAAA,UAAc,UAAuB,CAAA,GACnD,oBAAC,MAAM,aAAP,EAAA,UAAoB,YAA+B,CAAA,CACtC;QACd,CAAC,CAAC,UACD,oBAAC,mBAAD;KACE,IAAI,OAAO,OAAO,MAAM;KACxB,cAAc,kBAAkB;KAChC,GAAK,OAAO,QAAQ;MAClB,MAAM,OAAO;MACb,QAAQ,OAAO;MACf,KAAK,OAAO,WAAW,WAAW,wBAAwB,KAAA;KAC5D;KACA,SAAS,OAAO;KAChB,iBAAgB;KAChB,YAAW;eAEV,OAAO;IACS,CAAA,CAElB;;GACJ,CAAC,CAAC,eACD,oBAAC,mBAAD;IACE,WAAU;IAEV,kBAAkB,IAAI,EAAE;IACxB,MAAK;IACL,SAAS;IACT,cAAc,kBAAkB;GACjC,CAAA;EAEO;;AAEhB"}
|
|
@@ -12,21 +12,18 @@ var alertSlotRecipe = defineSlotRecipe({
|
|
|
12
12
|
alignItems: "center",
|
|
13
13
|
border: "1px solid",
|
|
14
14
|
borderRadius: "8",
|
|
15
|
+
paddingBlock: rem(11),
|
|
15
16
|
paddingInlineStart: rem(11),
|
|
16
17
|
paddingInlineEnd: rem(7),
|
|
17
18
|
width: "100%"
|
|
18
19
|
},
|
|
19
20
|
indicator: {
|
|
20
21
|
alignSelf: "flex-start",
|
|
21
|
-
marginBlock: rem(11),
|
|
22
22
|
marginInlineEnd: "8",
|
|
23
23
|
width: "24",
|
|
24
24
|
height: "24"
|
|
25
25
|
},
|
|
26
|
-
content: {
|
|
27
|
-
paddingBlock: rem(11),
|
|
28
|
-
flex: "1"
|
|
29
|
-
},
|
|
26
|
+
content: { flex: "1" },
|
|
30
27
|
title: {
|
|
31
28
|
textStyle: "comp/notification/title",
|
|
32
29
|
"& + *": { marginBlockStart: "4" }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Alert.recipe.ts"],"sourcesContent":["import { alertAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { ICONS_MAP, NOTIFICATION_VARIANTS, ROOT_MAP, TEXT_MAP } from '../common/AlertAndToast.common';\nimport { rem } from '../themeUtils';\n\nconst alertSlotRecipe = defineSlotRecipe({\n className: 'alert',\n slots: alertAnatomy.keys(),\n base: {\n root: {\n display: 'flex',\n alignItems: 'center',\n border: '1px solid',\n borderRadius: '8',\n paddingInlineStart: rem(11),\n paddingInlineEnd: rem(7),\n width: '100%',\n },\n indicator: {\n alignSelf: 'flex-start',\n
|
|
1
|
+
{"version":3,"file":"Alert.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Alert.recipe.ts"],"sourcesContent":["import { alertAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { ICONS_MAP, NOTIFICATION_VARIANTS, ROOT_MAP, TEXT_MAP } from '../common/AlertAndToast.common';\nimport { rem } from '../themeUtils';\n\nconst alertSlotRecipe = defineSlotRecipe({\n className: 'alert',\n slots: alertAnatomy.keys(),\n base: {\n root: {\n display: 'flex',\n alignItems: 'center',\n border: '1px solid',\n borderRadius: '8',\n paddingBlock: rem(11),\n paddingInlineStart: rem(11),\n paddingInlineEnd: rem(7),\n width: '100%',\n },\n indicator: {\n alignSelf: 'flex-start',\n marginInlineEnd: '8',\n width: '24',\n height: '24',\n },\n content: {\n flex: '1',\n },\n title: {\n textStyle: 'comp/notification/title',\n '& + *': {\n marginBlockStart: '4',\n },\n },\n description: {\n textStyle: 'comp/notification/message',\n '&:first-of-type': {\n marginBlockStart: '2',\n },\n },\n },\n variants: {\n variant: Object.fromEntries(\n NOTIFICATION_VARIANTS.map((v) => [\n v,\n {\n indicator: { color: ICONS_MAP[v] },\n root: { ...ROOT_MAP[v], color: TEXT_MAP[v] },\n },\n ]),\n ),\n },\n defaultVariants: {\n variant: 'info',\n },\n});\n\nexport default alertSlotRecipe;\n"],"mappings":";;;;;AAMA,IAAM,kBAAkB,iBAAiB;CACvC,WAAW;CACX,OAAO,aAAa,KAAK;CACzB,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,YAAY;GACZ,QAAQ;GACR,cAAc;GACd,cAAc,IAAI,EAAE;GACpB,oBAAoB,IAAI,EAAE;GAC1B,kBAAkB,IAAI,CAAC;GACvB,OAAO;EACT;EACA,WAAW;GACT,WAAW;GACX,iBAAiB;GACjB,OAAO;GACP,QAAQ;EACV;EACA,SAAS,EACP,MAAM,IACR;EACA,OAAO;GACL,WAAW;GACX,SAAS,EACP,kBAAkB,IACpB;EACF;EACA,aAAa;GACX,WAAW;GACX,mBAAmB,EACjB,kBAAkB,IACpB;EACF;CACF;CACA,UAAU,EACR,SAAS,OAAO,YACd,sBAAsB,KAAK,MAAM,CAC/B,GACA;EACE,WAAW,EAAE,OAAO,UAAU,GAAG;EACjC,MAAM;GAAE,GAAG,SAAS;GAAI,OAAO,SAAS;EAAG;CAC7C,CACF,CAAC,CACH,EACF;CACA,iBAAiB,EACf,SAAS,OACX;AACF,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bitrise/bitkit-v2",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "0.3.
|
|
4
|
+
"version": "0.3.257",
|
|
5
5
|
"description": "Bitrise Design System Components built with Chakra UI V3",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"react",
|
|
@@ -76,19 +76,19 @@
|
|
|
76
76
|
"@figma-export/output-components-as-svg": "^6.4.0",
|
|
77
77
|
"@figma-export/transform-svg-with-svgo": "^6.4.0",
|
|
78
78
|
"@google-cloud/storage": "^7.21.0",
|
|
79
|
-
"@storybook/addon-docs": "^10.4.
|
|
79
|
+
"@storybook/addon-docs": "^10.4.6",
|
|
80
80
|
"@storybook/addon-mcp": "^0.6.0",
|
|
81
81
|
"@storybook/mcp": "^0.7.0",
|
|
82
|
-
"@storybook/react-vite": "^10.4.
|
|
82
|
+
"@storybook/react-vite": "^10.4.6",
|
|
83
83
|
"@svgr/plugin-jsx": "^8.1.0",
|
|
84
|
-
"@types/node": "^24.13.
|
|
84
|
+
"@types/node": "^24.13.2",
|
|
85
85
|
"@types/react": "^18.3.31",
|
|
86
86
|
"@types/react-dom": "^18.3.7",
|
|
87
87
|
"@vitejs/plugin-react": "^6.0.2",
|
|
88
88
|
"react": "^18.3.1",
|
|
89
89
|
"react-dom": "^18.3.1",
|
|
90
90
|
"release-it": "^20.2.0",
|
|
91
|
-
"storybook": "^10.4.
|
|
91
|
+
"storybook": "^10.4.6",
|
|
92
92
|
"tsx": "^4.22.4",
|
|
93
93
|
"typescript": "^6.0.3",
|
|
94
94
|
"vite": "^8.0.16",
|
|
@@ -98,7 +98,7 @@
|
|
|
98
98
|
"dependencies": {
|
|
99
99
|
"@fontsource-variable/figtree": "^5.2.10",
|
|
100
100
|
"@fontsource-variable/source-code-pro": "^5.2.7",
|
|
101
|
-
"es-toolkit": "^1.47.
|
|
101
|
+
"es-toolkit": "^1.47.1",
|
|
102
102
|
"react-markdown": "^10.1.0"
|
|
103
103
|
},
|
|
104
104
|
"overrides": {
|