@bitrise/bitkit-v2 0.3.183 → 0.3.185
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.
- package/dist/components/BitkitDefinitionTooltip/BitkitDefinitionTooltip.d.ts +5 -1
- package/dist/components/BitkitDefinitionTooltip/BitkitDefinitionTooltip.js +17 -22
- package/dist/components/BitkitDefinitionTooltip/BitkitDefinitionTooltip.js.map +1 -1
- package/dist/components/BitkitIconButton/BitkitIconButton.d.ts +2 -2
- package/dist/components/BitkitIconButton/BitkitIconButton.js +2 -2
- package/dist/components/BitkitIconButton/BitkitIconButton.js.map +1 -1
- package/dist/components/BitkitNoteCard/BitkitNoteCard.d.ts +16 -0
- package/dist/components/BitkitNoteCard/BitkitNoteCard.js +55 -0
- package/dist/components/BitkitNoteCard/BitkitNoteCard.js.map +1 -0
- package/dist/components/BitkitTooltip/BitkitTooltip.d.ts +11 -1
- package/dist/components/BitkitTooltip/BitkitTooltip.js +40 -3
- package/dist/components/BitkitTooltip/BitkitTooltip.js.map +1 -1
- package/dist/components/index.d.ts +1 -1
- package/dist/main.js +2 -2
- package/dist/theme/slot-recipes/NoteCard.recipe.d.ts +97 -0
- package/dist/theme/slot-recipes/NoteCard.recipe.js +109 -0
- package/dist/theme/slot-recipes/NoteCard.recipe.js.map +1 -0
- package/dist/theme/slot-recipes/index.d.ts +96 -0
- package/dist/theme/slot-recipes/index.js +2 -0
- package/dist/theme/slot-recipes/index.js.map +1 -1
- package/package.json +2 -2
- package/dist/components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.d.ts +0 -16
- package/dist/components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.js +0 -45
- package/dist/components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.js.map +0 -1
|
@@ -1,12 +1,16 @@
|
|
|
1
1
|
import { TooltipRootProps } from '@chakra-ui/react/tooltip';
|
|
2
|
+
import { BitkitTooltipProps } from '../BitkitTooltip/BitkitTooltip';
|
|
2
3
|
export interface BitkitDefinitionTooltipProps {
|
|
4
|
+
button?: BitkitTooltipProps['button'];
|
|
3
5
|
children: string;
|
|
6
|
+
learnMoreTarget?: BitkitTooltipProps['learnMoreTarget'];
|
|
7
|
+
learnMoreUrl?: BitkitTooltipProps['learnMoreUrl'];
|
|
4
8
|
method?: 'click' | 'hover';
|
|
5
9
|
placement?: NonNullable<TooltipRootProps['positioning']>['placement'];
|
|
6
10
|
text: string;
|
|
7
11
|
}
|
|
8
12
|
declare const BitkitDefinitionTooltip: {
|
|
9
|
-
({ children, method, placement, text, }: BitkitDefinitionTooltipProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
({ button, children, learnMoreTarget, learnMoreUrl, method, placement, text, }: BitkitDefinitionTooltipProps): import("react/jsx-runtime").JSX.Element;
|
|
10
14
|
displayName: string;
|
|
11
15
|
};
|
|
12
16
|
export default BitkitDefinitionTooltip;
|
|
@@ -1,35 +1,30 @@
|
|
|
1
|
+
import BitkitTooltip from "../BitkitTooltip/BitkitTooltip.js";
|
|
1
2
|
import { chakra, useRecipe } from "@chakra-ui/react/styled-system";
|
|
2
3
|
import { useState } from "react";
|
|
3
|
-
import { jsx
|
|
4
|
-
import { Tooltip } from "@chakra-ui/react/tooltip";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
5
|
//#region lib/components/BitkitDefinitionTooltip/BitkitDefinitionTooltip.tsx
|
|
6
|
-
var BitkitDefinitionTooltip = ({ children, method = "click", placement = "top", text }) => {
|
|
6
|
+
var BitkitDefinitionTooltip = ({ button, children, learnMoreTarget, learnMoreUrl, method = "click", placement = "top", text }) => {
|
|
7
7
|
const style = useRecipe({ key: "definitionTooltip" });
|
|
8
8
|
const [open, setOpen] = useState(false);
|
|
9
|
-
return /* @__PURE__ */
|
|
9
|
+
return /* @__PURE__ */ jsx(BitkitTooltip, {
|
|
10
|
+
button,
|
|
11
|
+
closeOnClick: method === "click" ? false : void 0,
|
|
12
|
+
learnMoreTarget,
|
|
13
|
+
learnMoreUrl,
|
|
10
14
|
onOpenChange: method === "click" ? ({ open: nextOpen }) => {
|
|
11
15
|
if (!nextOpen) setOpen(false);
|
|
12
16
|
} : void 0,
|
|
13
17
|
open: method === "click" ? open : void 0,
|
|
14
|
-
closeOnClick: method === "click" ? false : void 0,
|
|
15
18
|
openDelay: method === "click" ? Infinity : void 0,
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
children: /* @__PURE__ */ jsx(chakra.button, {
|
|
26
|
-
"aria-expanded": method === "click" ? open : void 0,
|
|
27
|
-
css: style({ method }),
|
|
28
|
-
onClick: method === "click" ? () => setOpen(!open) : void 0,
|
|
29
|
-
type: "button",
|
|
30
|
-
children
|
|
31
|
-
})
|
|
32
|
-
}), /* @__PURE__ */ jsx(Tooltip.Positioner, { children: /* @__PURE__ */ jsxs(Tooltip.Content, { children: [/* @__PURE__ */ jsx(Tooltip.Arrow, { children: /* @__PURE__ */ jsx(Tooltip.ArrowTip, {}) }), text] }) })]
|
|
19
|
+
placement,
|
|
20
|
+
text,
|
|
21
|
+
children: /* @__PURE__ */ jsx(chakra.button, {
|
|
22
|
+
"aria-expanded": method === "click" ? open : void 0,
|
|
23
|
+
css: style({ method }),
|
|
24
|
+
onClick: method === "click" ? () => setOpen(!open) : void 0,
|
|
25
|
+
type: "button",
|
|
26
|
+
children
|
|
27
|
+
})
|
|
33
28
|
});
|
|
34
29
|
};
|
|
35
30
|
BitkitDefinitionTooltip.displayName = "BitkitDefinitionTooltip";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitDefinitionTooltip.js","names":[],"sources":["../../../lib/components/BitkitDefinitionTooltip/BitkitDefinitionTooltip.tsx"],"sourcesContent":["import { chakra, useRecipe } from '@chakra-ui/react/styled-system';\nimport {
|
|
1
|
+
{"version":3,"file":"BitkitDefinitionTooltip.js","names":[],"sources":["../../../lib/components/BitkitDefinitionTooltip/BitkitDefinitionTooltip.tsx"],"sourcesContent":["import { chakra, useRecipe } from '@chakra-ui/react/styled-system';\nimport { type TooltipRootProps } from '@chakra-ui/react/tooltip';\nimport { useState } from 'react';\n\nimport BitkitTooltip, { type BitkitTooltipProps } from '../BitkitTooltip/BitkitTooltip';\n\nexport interface BitkitDefinitionTooltipProps {\n button?: BitkitTooltipProps['button'];\n children: string;\n learnMoreTarget?: BitkitTooltipProps['learnMoreTarget'];\n learnMoreUrl?: BitkitTooltipProps['learnMoreUrl'];\n method?: 'click' | 'hover';\n placement?: NonNullable<TooltipRootProps['positioning']>['placement'];\n text: string;\n}\n\nconst BitkitDefinitionTooltip = ({\n button,\n children,\n learnMoreTarget,\n learnMoreUrl,\n method = 'click',\n placement = 'top',\n text,\n}: BitkitDefinitionTooltipProps) => {\n const style = useRecipe({ key: 'definitionTooltip' });\n const [open, setOpen] = useState(false);\n\n return (\n <BitkitTooltip\n button={button}\n closeOnClick={method === 'click' ? false : undefined}\n learnMoreTarget={learnMoreTarget}\n learnMoreUrl={learnMoreUrl}\n onOpenChange={\n method === 'click'\n ? ({ open: nextOpen }) => {\n if (!nextOpen) setOpen(false);\n }\n : undefined\n }\n open={method === 'click' ? open : undefined}\n openDelay={method === 'click' ? Infinity : undefined}\n placement={placement}\n text={text}\n >\n <chakra.button\n aria-expanded={method === 'click' ? open : undefined}\n css={style({ method })}\n onClick={method === 'click' ? () => setOpen(!open) : undefined}\n type=\"button\"\n >\n {children}\n </chakra.button>\n </BitkitTooltip>\n );\n};\n\nBitkitDefinitionTooltip.displayName = 'BitkitDefinitionTooltip';\n\nexport default BitkitDefinitionTooltip;\n"],"mappings":";;;;;AAgBA,IAAM,2BAA2B,EAC/B,QACA,UACA,iBACA,cACA,SAAS,SACT,YAAY,OACZ,WACkC;CAClC,MAAM,QAAQ,UAAU,EAAE,KAAK,qBAAqB,CAAC;CACrD,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;AAEvC,QACE,oBAAC,eAAD;EACU;EACR,cAAc,WAAW,UAAU,QAAQ,KAAA;EAC1B;EACH;EACd,cACE,WAAW,WACN,EAAE,MAAM,eAAe;AACtB,OAAI,CAAC,SAAU,SAAQ,MAAM;MAE/B,KAAA;EAEN,MAAM,WAAW,UAAU,OAAO,KAAA;EAClC,WAAW,WAAW,UAAU,WAAW,KAAA;EAChC;EACL;YAEN,oBAAC,OAAO,QAAR;GACE,iBAAe,WAAW,UAAU,OAAO,KAAA;GAC3C,KAAK,MAAM,EAAE,QAAQ,CAAC;GACtB,SAAS,WAAW,gBAAgB,QAAQ,CAAC,KAAK,GAAG,KAAA;GACrD,MAAK;GAEJ;GACa,CAAA;EACF,CAAA;;AAIpB,wBAAwB,cAAc"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { IconButtonProps } from '@chakra-ui/react/button';
|
|
2
2
|
import { BitkitIconComponent } from '../../icons';
|
|
3
|
-
import {
|
|
3
|
+
import { BitkitLabelTooltipProps } from '../BitkitLabelTooltip/BitkitLabelTooltip';
|
|
4
4
|
export interface BitkitIconButtonProps extends Omit<IconButtonProps, 'aria-label' | 'children' | 'colorPalette' | 'disabled' | 'loading' | 'loadingText' | 'spinner' | 'spinnerPlacement'> {
|
|
5
5
|
icon: BitkitIconComponent;
|
|
6
6
|
label: string;
|
|
7
7
|
state?: 'disabled' | 'loading' | 'skeleton';
|
|
8
|
-
tooltipProps?: Partial<Omit<
|
|
8
|
+
tooltipProps?: Partial<Omit<BitkitLabelTooltipProps, 'children' | 'text'>>;
|
|
9
9
|
}
|
|
10
10
|
declare const BitkitIconButton: import('react').ForwardRefExoticComponent<BitkitIconButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
|
|
11
11
|
export default BitkitIconButton;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import BitkitLabelTooltip from "../BitkitLabelTooltip/BitkitLabelTooltip.js";
|
|
2
2
|
import { forwardRef } from "react";
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
import { IconButton } from "@chakra-ui/react/button";
|
|
@@ -7,7 +7,7 @@ import { Skeleton } from "@chakra-ui/react/skeleton";
|
|
|
7
7
|
var BitkitIconButton = forwardRef((props, ref) => {
|
|
8
8
|
const { icon: Icon, label, size, state, tooltipProps, ...rest } = props;
|
|
9
9
|
const iconSize = size === "lg" ? "24" : "16";
|
|
10
|
-
return /* @__PURE__ */ jsx(
|
|
10
|
+
return /* @__PURE__ */ jsx(BitkitLabelTooltip, {
|
|
11
11
|
text: label,
|
|
12
12
|
...tooltipProps,
|
|
13
13
|
children: /* @__PURE__ */ jsx(Skeleton, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitIconButton.js","names":[],"sources":["../../../lib/components/BitkitIconButton/BitkitIconButton.tsx"],"sourcesContent":["import { IconButton, type IconButtonProps } from '@chakra-ui/react/button';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { forwardRef } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport
|
|
1
|
+
{"version":3,"file":"BitkitIconButton.js","names":[],"sources":["../../../lib/components/BitkitIconButton/BitkitIconButton.tsx"],"sourcesContent":["import { IconButton, type IconButtonProps } from '@chakra-ui/react/button';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { forwardRef } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport BitkitLabelTooltip, { type BitkitLabelTooltipProps } from '../BitkitLabelTooltip/BitkitLabelTooltip';\n\nexport interface BitkitIconButtonProps extends Omit<\n IconButtonProps,\n 'aria-label' | 'children' | 'colorPalette' | 'disabled' | 'loading' | 'loadingText' | 'spinner' | 'spinnerPlacement'\n> {\n icon: BitkitIconComponent;\n label: string;\n state?: 'disabled' | 'loading' | 'skeleton';\n tooltipProps?: Partial<Omit<BitkitLabelTooltipProps, 'children' | 'text'>>;\n}\n\nconst BitkitIconButton = forwardRef<HTMLButtonElement, BitkitIconButtonProps>((props, ref) => {\n const { icon: Icon, label, size, state, tooltipProps, ...rest } = props;\n const iconSize = size === 'lg' ? '24' : '16';\n\n return (\n <BitkitLabelTooltip text={label} {...tooltipProps}>\n <Skeleton asChild loading={state === 'skeleton'}>\n <IconButton\n aria-label={label}\n disabled={state === 'disabled'}\n loading={state === 'loading'}\n ref={ref}\n size={size}\n {...rest}\n >\n <Icon size={iconSize} />\n </IconButton>\n </Skeleton>\n </BitkitLabelTooltip>\n );\n});\n\nBitkitIconButton.displayName = 'BitkitIconButton';\n\nexport default BitkitIconButton;\n"],"mappings":";;;;;;AAiBA,IAAM,mBAAmB,YAAsD,OAAO,QAAQ;CAC5F,MAAM,EAAE,MAAM,MAAM,OAAO,MAAM,OAAO,cAAc,GAAG,SAAS;CAClE,MAAM,WAAW,SAAS,OAAO,OAAO;AAExC,QACE,oBAAC,oBAAD;EAAoB,MAAM;EAAO,GAAI;YACnC,oBAAC,UAAD;GAAU,SAAA;GAAQ,SAAS,UAAU;aACnC,oBAAC,YAAD;IACE,cAAY;IACZ,UAAU,UAAU;IACpB,SAAS,UAAU;IACd;IACC;IACN,GAAI;cAEJ,oBAAC,MAAD,EAAM,MAAM,UAAY,CAAA;IACb,CAAA;GACJ,CAAA;EACQ,CAAA;EAEvB;AAEF,iBAAiB,cAAc"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { BoxProps } from '@chakra-ui/react/box';
|
|
2
|
+
import { NotificationVariant } from '../../theme/common/AlertAndToast.common';
|
|
3
|
+
import { NotificationAction } from '../common/notificationMaps';
|
|
4
|
+
export type BitkitNoteCardProps = Omit<BoxProps, 'children' | 'title'> & {
|
|
5
|
+
action?: NotificationAction;
|
|
6
|
+
message: string;
|
|
7
|
+
status?: NotificationVariant;
|
|
8
|
+
title?: string;
|
|
9
|
+
};
|
|
10
|
+
declare const BitkitNoteCard: import('react').ForwardRefExoticComponent<Omit<BoxProps, "title" | "children"> & {
|
|
11
|
+
action?: NotificationAction;
|
|
12
|
+
message: string;
|
|
13
|
+
status?: NotificationVariant;
|
|
14
|
+
title?: string;
|
|
15
|
+
} & import('react').RefAttributes<HTMLDivElement>>;
|
|
16
|
+
export default BitkitNoteCard;
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { ICON_COMPONENTS_MAP } from "../common/notificationMaps.js";
|
|
2
|
+
import BitkitButton from "../BitkitButton/BitkitButton.js";
|
|
3
|
+
import { Box } from "@chakra-ui/react/box";
|
|
4
|
+
import { useSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
5
|
+
import { Text } from "@chakra-ui/react/text";
|
|
6
|
+
import { forwardRef } from "react";
|
|
7
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
8
|
+
//#region lib/components/BitkitNoteCard/BitkitNoteCard.tsx
|
|
9
|
+
var BitkitNoteCard = forwardRef((props, ref) => {
|
|
10
|
+
const { action, message, status = "info", title, ...rest } = props;
|
|
11
|
+
const styles = useSlotRecipe({ key: "noteCard" })({ status });
|
|
12
|
+
const IconComponent = ICON_COMPONENTS_MAP[status];
|
|
13
|
+
const isProgress = status === "progress";
|
|
14
|
+
return /* @__PURE__ */ jsxs(Box, {
|
|
15
|
+
ref,
|
|
16
|
+
css: styles.root,
|
|
17
|
+
...rest,
|
|
18
|
+
children: [/* @__PURE__ */ jsx(Box, {
|
|
19
|
+
css: styles.iconBar,
|
|
20
|
+
children: /* @__PURE__ */ jsx(Box, {
|
|
21
|
+
css: styles.iconWrapper,
|
|
22
|
+
children: isProgress ? /* @__PURE__ */ jsx(IconComponent, { size: "lg" }) : /* @__PURE__ */ jsx(IconComponent, { size: "24" })
|
|
23
|
+
})
|
|
24
|
+
}), /* @__PURE__ */ jsxs(Box, {
|
|
25
|
+
css: styles.content,
|
|
26
|
+
children: [/* @__PURE__ */ jsxs(Box, {
|
|
27
|
+
css: styles.messageBlock,
|
|
28
|
+
children: [title && /* @__PURE__ */ jsx(Text, {
|
|
29
|
+
css: styles.title,
|
|
30
|
+
children: title
|
|
31
|
+
}), /* @__PURE__ */ jsx(Text, {
|
|
32
|
+
css: title ? styles.message : styles.messageSolo,
|
|
33
|
+
children: message
|
|
34
|
+
})]
|
|
35
|
+
}), action && /* @__PURE__ */ jsx(BitkitButton, {
|
|
36
|
+
css: styles.actionArea,
|
|
37
|
+
size: "sm",
|
|
38
|
+
variant: "tertiary",
|
|
39
|
+
...action.href && {
|
|
40
|
+
as: "a",
|
|
41
|
+
href: action.href,
|
|
42
|
+
rel: action.target === "_blank" ? "noopener noreferrer" : void 0,
|
|
43
|
+
target: action.target
|
|
44
|
+
},
|
|
45
|
+
onClick: action.onClick,
|
|
46
|
+
children: action.label
|
|
47
|
+
})]
|
|
48
|
+
})]
|
|
49
|
+
});
|
|
50
|
+
});
|
|
51
|
+
BitkitNoteCard.displayName = "BitkitNoteCard";
|
|
52
|
+
//#endregion
|
|
53
|
+
export { BitkitNoteCard as default };
|
|
54
|
+
|
|
55
|
+
//# sourceMappingURL=BitkitNoteCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BitkitNoteCard.js","names":[],"sources":["../../../lib/components/BitkitNoteCard/BitkitNoteCard.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { type ElementType, forwardRef } from 'react';\n\nimport { type NotificationVariant } from '../../theme/common/AlertAndToast.common';\nimport BitkitButton from '../BitkitButton/BitkitButton';\nimport { ICON_COMPONENTS_MAP, type NotificationAction } from '../common/notificationMaps';\n\n// ----- Props -----\n\nexport type BitkitNoteCardProps = Omit<BoxProps, 'children' | 'title'> & {\n action?: NotificationAction;\n message: string;\n status?: NotificationVariant;\n title?: string;\n};\n\n// ----- Component -----\n\nconst BitkitNoteCard = forwardRef<HTMLDivElement, BitkitNoteCardProps>((props, ref) => {\n const { action, message, status = 'info', title, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'noteCard' });\n const styles = recipe({ status });\n\n const IconComponent: ElementType = ICON_COMPONENTS_MAP[status];\n const isProgress = status === 'progress';\n\n return (\n <Box ref={ref} css={styles.root} {...rest}>\n <Box css={styles.iconBar}>\n <Box css={styles.iconWrapper}>{isProgress ? <IconComponent size=\"lg\" /> : <IconComponent size=\"24\" />}</Box>\n </Box>\n <Box css={styles.content}>\n <Box css={styles.messageBlock}>\n {title && <Text css={styles.title}>{title}</Text>}\n <Text css={title ? styles.message : styles.messageSolo}>{message}</Text>\n </Box>\n {action && (\n <BitkitButton\n css={styles.actionArea}\n size=\"sm\"\n variant=\"tertiary\"\n {...(action.href && {\n as: 'a' as const,\n href: action.href,\n rel: action.target === '_blank' ? 'noopener noreferrer' : undefined,\n target: action.target,\n })}\n onClick={action.onClick}\n >\n {action.label}\n </BitkitButton>\n )}\n </Box>\n </Box>\n );\n});\n\nBitkitNoteCard.displayName = 'BitkitNoteCard';\n\nexport default BitkitNoteCard;\n"],"mappings":";;;;;;;;AAoBA,IAAM,iBAAiB,YAAiD,OAAO,QAAQ;CACrF,MAAM,EAAE,QAAQ,SAAS,SAAS,QAAQ,OAAO,GAAG,SAAS;CAG7D,MAAM,SADS,cAAc,EAAE,KAAK,YAAY,CAAC,CAC3B,EAAE,QAAQ,CAAC;CAEjC,MAAM,gBAA6B,oBAAoB;CACvD,MAAM,aAAa,WAAW;AAE9B,QACE,qBAAC,KAAD;EAAU;EAAK,KAAK,OAAO;EAAM,GAAI;YAArC,CACE,oBAAC,KAAD;GAAK,KAAK,OAAO;aACf,oBAAC,KAAD;IAAK,KAAK,OAAO;cAAc,aAAa,oBAAC,eAAD,EAAe,MAAK,MAAO,CAAA,GAAG,oBAAC,eAAD,EAAe,MAAK,MAAO,CAAA;IAAO,CAAA;GACxG,CAAA,EACN,qBAAC,KAAD;GAAK,KAAK,OAAO;aAAjB,CACE,qBAAC,KAAD;IAAK,KAAK,OAAO;cAAjB,CACG,SAAS,oBAAC,MAAD;KAAM,KAAK,OAAO;eAAQ;KAAa,CAAA,EACjD,oBAAC,MAAD;KAAM,KAAK,QAAQ,OAAO,UAAU,OAAO;eAAc;KAAe,CAAA,CACpE;OACL,UACC,oBAAC,cAAD;IACE,KAAK,OAAO;IACZ,MAAK;IACL,SAAQ;IACR,GAAK,OAAO,QAAQ;KAClB,IAAI;KACJ,MAAM,OAAO;KACb,KAAK,OAAO,WAAW,WAAW,wBAAwB,KAAA;KAC1D,QAAQ,OAAO;KAChB;IACD,SAAS,OAAO;cAEf,OAAO;IACK,CAAA,CAEb;KACF;;EAER;AAEF,eAAe,cAAc"}
|
|
@@ -1,13 +1,23 @@
|
|
|
1
1
|
import { TooltipRootProps } from '@chakra-ui/react/tooltip';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
|
+
import { BitkitIconComponent } from '../../icons';
|
|
4
|
+
import { BitkitColorButtonProps } from '../BitkitColorButton/BitkitColorButton';
|
|
3
5
|
export type BitkitTooltipProps = {
|
|
6
|
+
button?: BitkitColorButtonProps;
|
|
4
7
|
children: ReactNode;
|
|
8
|
+
closeOnClick?: TooltipRootProps['closeOnClick'];
|
|
5
9
|
disabled?: TooltipRootProps['disabled'];
|
|
10
|
+
icon?: BitkitIconComponent;
|
|
11
|
+
learnMoreTarget?: HTMLAnchorElement['target'];
|
|
12
|
+
learnMoreUrl?: string;
|
|
13
|
+
onOpenChange?: TooltipRootProps['onOpenChange'];
|
|
14
|
+
open?: TooltipRootProps['open'];
|
|
15
|
+
openDelay?: TooltipRootProps['openDelay'];
|
|
6
16
|
placement?: NonNullable<TooltipRootProps['positioning']>['placement'];
|
|
7
17
|
text: string;
|
|
8
18
|
};
|
|
9
19
|
declare const BitkitTooltip: {
|
|
10
|
-
({ children, disabled, placement, text }: BitkitTooltipProps): import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
({ button, children, closeOnClick, disabled, icon: Icon, learnMoreTarget, learnMoreUrl, onOpenChange, open, openDelay, placement, text, }: BitkitTooltipProps): import("react/jsx-runtime").JSX.Element;
|
|
11
21
|
displayName: string;
|
|
12
22
|
};
|
|
13
23
|
export default BitkitTooltip;
|
|
@@ -1,10 +1,20 @@
|
|
|
1
1
|
import { rem } from "../../theme/themeUtils.js";
|
|
2
|
+
import BitkitColorButton from "../BitkitColorButton/BitkitColorButton.js";
|
|
3
|
+
import { Box } from "@chakra-ui/react/box";
|
|
2
4
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
5
|
import { Tooltip } from "@chakra-ui/react/tooltip";
|
|
6
|
+
import { Link } from "@chakra-ui/react/link";
|
|
4
7
|
//#region lib/components/BitkitTooltip/BitkitTooltip.tsx
|
|
5
|
-
var BitkitTooltip = ({ children, disabled, placement = "top", text }) => {
|
|
8
|
+
var BitkitTooltip = ({ button, children, closeOnClick, disabled, icon: Icon, learnMoreTarget, learnMoreUrl, onOpenChange, open, openDelay, placement = "top", text }) => {
|
|
9
|
+
const isInteractive = !!learnMoreUrl || !!button;
|
|
6
10
|
return /* @__PURE__ */ jsxs(Tooltip.Root, {
|
|
11
|
+
closeOnClick,
|
|
7
12
|
disabled,
|
|
13
|
+
interactive: isInteractive || void 0,
|
|
14
|
+
onOpenChange,
|
|
15
|
+
open,
|
|
16
|
+
openDelay,
|
|
17
|
+
paddingSize: isInteractive ? "lg" : void 0,
|
|
8
18
|
positioning: {
|
|
9
19
|
placement,
|
|
10
20
|
offset: {
|
|
@@ -16,8 +26,35 @@ var BitkitTooltip = ({ children, disabled, placement = "top", text }) => {
|
|
|
16
26
|
asChild: true,
|
|
17
27
|
children
|
|
18
28
|
}), /* @__PURE__ */ jsx(Tooltip.Positioner, { children: /* @__PURE__ */ jsxs(Tooltip.Content, {
|
|
19
|
-
|
|
20
|
-
|
|
29
|
+
maxWidth: rem(320),
|
|
30
|
+
css: isInteractive && { minWidth: rem(240) },
|
|
31
|
+
children: [
|
|
32
|
+
/* @__PURE__ */ jsx(Tooltip.Arrow, { children: /* @__PURE__ */ jsx(Tooltip.ArrowTip, {}) }),
|
|
33
|
+
/* @__PURE__ */ jsxs(Box, {
|
|
34
|
+
display: "flex",
|
|
35
|
+
gap: "8",
|
|
36
|
+
children: [text, Icon && /* @__PURE__ */ jsx(Icon, {
|
|
37
|
+
flexShrink: "0",
|
|
38
|
+
size: "16"
|
|
39
|
+
})]
|
|
40
|
+
}),
|
|
41
|
+
isInteractive && /* @__PURE__ */ jsxs(Box, {
|
|
42
|
+
alignItems: "center",
|
|
43
|
+
display: "flex",
|
|
44
|
+
gap: "16",
|
|
45
|
+
marginBlockStart: "16",
|
|
46
|
+
children: [learnMoreUrl && /* @__PURE__ */ jsx(Link, {
|
|
47
|
+
color: "sys/purple/highlight",
|
|
48
|
+
href: learnMoreUrl,
|
|
49
|
+
rel: learnMoreTarget === "_blank" ? "noopener noreferrer" : void 0,
|
|
50
|
+
target: learnMoreTarget,
|
|
51
|
+
children: "Learn more"
|
|
52
|
+
}), button && /* @__PURE__ */ jsx(BitkitColorButton, {
|
|
53
|
+
css: { marginInlineStart: "auto" },
|
|
54
|
+
...button
|
|
55
|
+
})]
|
|
56
|
+
})
|
|
57
|
+
]
|
|
21
58
|
}) })]
|
|
22
59
|
});
|
|
23
60
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitTooltip.js","names":[],"sources":["../../../lib/components/BitkitTooltip/BitkitTooltip.tsx"],"sourcesContent":["import { Tooltip, type TooltipRootProps } from '@chakra-ui/react/tooltip';\nimport { type ReactNode } from 'react';\n\nimport { rem } from '../../theme/themeUtils';\n\nexport type BitkitTooltipProps = {\n children: ReactNode;\n disabled?: TooltipRootProps['disabled'];\n placement?: NonNullable<TooltipRootProps['positioning']>['placement'];\n text: string;\n};\n\nconst BitkitTooltip = ({
|
|
1
|
+
{"version":3,"file":"BitkitTooltip.js","names":[],"sources":["../../../lib/components/BitkitTooltip/BitkitTooltip.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Link } from '@chakra-ui/react/link';\nimport { Tooltip, type TooltipRootProps } from '@chakra-ui/react/tooltip';\nimport { type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport { rem } from '../../theme/themeUtils';\nimport BitkitColorButton, { type BitkitColorButtonProps } from '../BitkitColorButton/BitkitColorButton';\n\nexport type BitkitTooltipProps = {\n button?: BitkitColorButtonProps;\n children: ReactNode;\n closeOnClick?: TooltipRootProps['closeOnClick'];\n disabled?: TooltipRootProps['disabled'];\n icon?: BitkitIconComponent;\n learnMoreTarget?: HTMLAnchorElement['target'];\n learnMoreUrl?: string;\n onOpenChange?: TooltipRootProps['onOpenChange'];\n open?: TooltipRootProps['open'];\n openDelay?: TooltipRootProps['openDelay'];\n placement?: NonNullable<TooltipRootProps['positioning']>['placement'];\n text: string;\n};\n\nconst BitkitTooltip = ({\n button,\n children,\n closeOnClick,\n disabled,\n icon: Icon,\n learnMoreTarget,\n learnMoreUrl,\n onOpenChange,\n open,\n openDelay,\n placement = 'top',\n text,\n}: BitkitTooltipProps) => {\n const isInteractive = !!learnMoreUrl || !!button;\n\n return (\n <Tooltip.Root\n closeOnClick={closeOnClick}\n disabled={disabled}\n interactive={isInteractive || undefined}\n onOpenChange={onOpenChange}\n open={open}\n openDelay={openDelay}\n paddingSize={isInteractive ? 'lg' : undefined}\n positioning={{ placement, offset: { mainAxis: 8, crossAxis: 0 } }}\n >\n <Tooltip.Trigger asChild>{children}</Tooltip.Trigger>\n <Tooltip.Positioner>\n <Tooltip.Content maxWidth={rem(320)} css={isInteractive && { minWidth: rem(240) }}>\n <Tooltip.Arrow>\n <Tooltip.ArrowTip />\n </Tooltip.Arrow>\n <Box display=\"flex\" gap=\"8\">\n {text}\n {Icon && <Icon flexShrink=\"0\" size=\"16\" />}\n </Box>\n {isInteractive && (\n <Box alignItems=\"center\" display=\"flex\" gap=\"16\" marginBlockStart=\"16\">\n {learnMoreUrl && (\n <Link\n color=\"sys/purple/highlight\"\n href={learnMoreUrl}\n rel={learnMoreTarget === '_blank' ? 'noopener noreferrer' : undefined}\n target={learnMoreTarget}\n >\n Learn more\n </Link>\n )}\n {button && <BitkitColorButton css={{ marginInlineStart: 'auto' }} {...button} />}\n </Box>\n )}\n </Tooltip.Content>\n </Tooltip.Positioner>\n </Tooltip.Root>\n );\n};\n\nBitkitTooltip.displayName = 'BitkitTooltip';\n\nexport default BitkitTooltip;\n"],"mappings":";;;;;;;AAwBA,IAAM,iBAAiB,EACrB,QACA,UACA,cACA,UACA,MAAM,MACN,iBACA,cACA,cACA,MACA,WACA,YAAY,OACZ,WACwB;CACxB,MAAM,gBAAgB,CAAC,CAAC,gBAAgB,CAAC,CAAC;AAE1C,QACE,qBAAC,QAAQ,MAAT;EACgB;EACJ;EACV,aAAa,iBAAiB,KAAA;EAChB;EACR;EACK;EACX,aAAa,gBAAgB,OAAO,KAAA;EACpC,aAAa;GAAE;GAAW,QAAQ;IAAE,UAAU;IAAG,WAAW;IAAG;GAAE;YARnE,CAUE,oBAAC,QAAQ,SAAT;GAAiB,SAAA;GAAS;GAA2B,CAAA,EACrD,oBAAC,QAAQ,YAAT,EAAA,UACE,qBAAC,QAAQ,SAAT;GAAiB,UAAU,IAAI,IAAI;GAAE,KAAK,iBAAiB,EAAE,UAAU,IAAI,IAAI,EAAE;aAAjF;IACE,oBAAC,QAAQ,OAAT,EAAA,UACE,oBAAC,QAAQ,UAAT,EAAoB,CAAA,EACN,CAAA;IAChB,qBAAC,KAAD;KAAK,SAAQ;KAAO,KAAI;eAAxB,CACG,MACA,QAAQ,oBAAC,MAAD;MAAM,YAAW;MAAI,MAAK;MAAO,CAAA,CACtC;;IACL,iBACC,qBAAC,KAAD;KAAK,YAAW;KAAS,SAAQ;KAAO,KAAI;KAAK,kBAAiB;eAAlE,CACG,gBACC,oBAAC,MAAD;MACE,OAAM;MACN,MAAM;MACN,KAAK,oBAAoB,WAAW,wBAAwB,KAAA;MAC5D,QAAQ;gBACT;MAEM,CAAA,EAER,UAAU,oBAAC,mBAAD;MAAmB,KAAK,EAAE,mBAAmB,QAAQ;MAAE,GAAI;MAAU,CAAA,CAC5E;;IAEQ;MACC,CAAA,CACR;;;AAInB,cAAc,cAAc"}
|
|
@@ -27,7 +27,6 @@ export { default as BitkitFileInput } from './BitkitFileInput/BitkitFileInput';
|
|
|
27
27
|
export { default as BitkitGroupHeading, type BitkitGroupHeadingProps } from './BitkitGroupHeading/BitkitGroupHeading';
|
|
28
28
|
export { default as BitkitIconButton, type BitkitIconButtonProps } from './BitkitIconButton/BitkitIconButton';
|
|
29
29
|
export { default as BitkitInlineLoading, type BitkitInlineLoadingProps, } from './BitkitInlineLoading/BitkitInlineLoading';
|
|
30
|
-
export { default as BitkitInteractiveTooltip, type BitkitInteractiveTooltipProps, } from './BitkitInteractiveTooltip/BitkitInteractiveTooltip';
|
|
31
30
|
export { default as BitkitLabel, type BitkitLabelProps } from './BitkitLabel/BitkitLabel';
|
|
32
31
|
export { default as BitkitLabelTooltip, type BitkitLabelTooltipProps } from './BitkitLabelTooltip/BitkitLabelTooltip';
|
|
33
32
|
export { default as BitkitLink, type BitkitLinkProps } from './BitkitLink/BitkitLink';
|
|
@@ -35,6 +34,7 @@ export { default as BitkitLinkButton, type BitkitLinkButtonProps } from './Bitki
|
|
|
35
34
|
export { default as BitkitMarkdown, type BitkitMarkdownProps } from './BitkitMarkdown/BitkitMarkdown';
|
|
36
35
|
export { default as BitkitMarkdownCard, type BitkitMarkdownCardProps } from './BitkitMarkdownCard/BitkitMarkdownCard';
|
|
37
36
|
export { default as BitkitNativeSelect, type BitkitNativeSelectProps } from './BitkitNativeSelect/BitkitNativeSelect';
|
|
37
|
+
export { default as BitkitNoteCard, type BitkitNoteCardProps } from './BitkitNoteCard/BitkitNoteCard';
|
|
38
38
|
export { default as BitkitNumberInput, type BitkitNumberInputProps } from './BitkitNumberInput/BitkitNumberInput';
|
|
39
39
|
export { default as BitkitOrderedList, type BitkitOrderedListItemProps, type BitkitOrderedListProps, } from './BitkitOrderedList/BitkitOrderedList';
|
|
40
40
|
export { default as BitkitOverflowTooltip, type BitkitOverflowTooltipProps, } from './BitkitOverflowTooltip/BitkitOverflowTooltip';
|
package/dist/main.js
CHANGED
|
@@ -310,7 +310,6 @@ import BitkitFileInput from "./components/BitkitFileInput/BitkitFileInput.js";
|
|
|
310
310
|
import BitkitGroupHeading from "./components/BitkitGroupHeading/BitkitGroupHeading.js";
|
|
311
311
|
import BitkitIconButton from "./components/BitkitIconButton/BitkitIconButton.js";
|
|
312
312
|
import BitkitInlineLoading from "./components/BitkitInlineLoading/BitkitInlineLoading.js";
|
|
313
|
-
import BitkitInteractiveTooltip from "./components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.js";
|
|
314
313
|
import BitkitLink from "./components/BitkitLink/BitkitLink.js";
|
|
315
314
|
import BitkitLinkButton from "./components/BitkitLinkButton/BitkitLinkButton.js";
|
|
316
315
|
import BitkitOrderedList_default from "./components/BitkitOrderedList/BitkitOrderedList.js";
|
|
@@ -318,6 +317,7 @@ import BitkitUnorderedList_default from "./components/BitkitUnorderedList/Bitkit
|
|
|
318
317
|
import BitkitMarkdown from "./components/BitkitMarkdown/BitkitMarkdown.js";
|
|
319
318
|
import BitkitMarkdownCard from "./components/BitkitMarkdownCard/BitkitMarkdownCard.js";
|
|
320
319
|
import BitkitNativeSelect from "./components/BitkitNativeSelect/BitkitNativeSelect.js";
|
|
320
|
+
import BitkitNoteCard from "./components/BitkitNoteCard/BitkitNoteCard.js";
|
|
321
321
|
import BitkitNumberInput from "./components/BitkitNumberInput/BitkitNumberInput.js";
|
|
322
322
|
import BitkitOverflowTooltip from "./components/BitkitOverflowTooltip/BitkitOverflowTooltip.js";
|
|
323
323
|
import BitkitPaginationLoadMore from "./components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.js";
|
|
@@ -339,4 +339,4 @@ import BitkitToggle from "./components/BitkitToggle/BitkitToggle.js";
|
|
|
339
339
|
import BitkitToggleButton from "./components/BitkitToggleButton/BitkitToggleButton.js";
|
|
340
340
|
import bitkitTheme from "./theme/index.js";
|
|
341
341
|
import Provider from "./providers/BitkitProvider.js";
|
|
342
|
-
export { BitkitAccordion, BitkitActionBar, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitButton, BitkitCalendar, BitkitCard, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox, BitkitControlButton, BitkitDefinitionTooltip, BitkitDialog, BitkitDialogBody, BitkitDialogContent, BitkitDialogRoot, BitkitEmptyState, BitkitExpandableCard, BitkitExplainerList_default as BitkitExplainerList, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading,
|
|
342
|
+
export { BitkitAccordion, BitkitActionBar, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitButton, BitkitCalendar, BitkitCard, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox, BitkitControlButton, BitkitDefinitionTooltip, BitkitDialog, BitkitDialogBody, BitkitDialogContent, BitkitDialogRoot, BitkitEmptyState, BitkitExpandableCard, BitkitExplainerList_default as BitkitExplainerList, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLink, BitkitLinkButton, BitkitMarkdown, BitkitMarkdownCard, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOrderedList_default as BitkitOrderedList, BitkitOverflowTooltip, BitkitPaginationLoadMore, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect, BitkitSelectMenu, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSplitButton_default as BitkitSplitButton, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextInput, BitkitToggle, BitkitToggleButton, BitkitTooltip, BitkitUnorderedList_default as BitkitUnorderedList, IconAbortCircle, IconAbortCircleFilled, IconAddons, IconAgent, IconAnchor, IconAndroid, IconApp, IconAppSettings, IconAppStore, IconAppStoreColor, IconApple, IconArchive, IconArchiveDelete, IconArchiveRestore, IconArrowBackAndDown, IconArrowBackAndUp, IconArrowDown, IconArrowForwardAndDown, IconArrowForwardAndUp, IconArrowLeft, IconArrowNortheast, IconArrowNorthwest, IconArrowRight, IconArrowUp, IconArrowsHorizontal, IconArrowsVertical, IconAutomation, IconAws, IconAwsColor, IconBadge3RdParty, IconBadgeBitrise, IconBadgeUpgrade, IconBadgeVersionOk, IconBazel, IconBell, IconBitbot, IconBitbotError, IconBitbucket, IconBitbucketColor, IconBitbucketNeutral, IconBitbucketWhite, IconBlockCircle, IconBook, IconBoxArrowDown, IconBoxDot, IconBoxLinesOverflow, IconBoxLinesWrap, IconBranch, IconBrowserstackColor, IconBug, IconBuild, IconBuildCache, IconBuildCacheFilled, IconBuildEnvSetup, IconCalendar, IconChangePlan, IconChat, IconCheck, IconCheckCircle, IconCheckCircleFilled, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconCi, IconCiFilled, IconCircle, IconCircleDashed, IconCircleHalfFilled, IconClaude, IconClaudeColor, IconClock, IconCode, IconCodePush, IconCodeSigning, IconCoffee, IconCommit, IconConfigure, IconConnectedAccounts, IconContainer, IconCopy, IconCordova, IconCpu, IconCreditcard, IconCredits, IconCross, IconCrossCircle, IconCrossCircleFilled, IconCrown, IconCycle, IconDashboard, IconDashboardFilled, IconDeployment, IconDetails, IconDoc, IconDollar, IconDot, IconDotnet, IconDotnetColor, IconDotnetText, IconDotnetTextColor, IconDoubleCircle, IconDownload, IconEc2Ami, IconEnterprise, IconErrorCircle, IconErrorCircleFilled, IconExpand, IconExtraBuildCapacity, IconEye, IconEyeSlash, IconFastlane, IconFileDoc, IconFilePdf, IconFilePlist, IconFileZip, IconFilter, IconFlag, IconFlutter, IconFolder, IconFullscreen, IconFullscreenExit, IconGauge, IconGit, IconGithub, IconGitlab, IconGitlabColor, IconGitlabWhite, IconGlobe, IconGo, IconGoogleColor, IconGooglePlay, IconGooglePlayColor, IconGradle, IconGroup, IconHashtag, IconHeadset, IconHeart, IconHistory, IconHourglass, IconImage, IconInfoCircle, IconInfoCircleFilled, IconInsights, IconInsightsFilled, IconInstall, IconInteraction, IconInvoice, IconIonic, IconJapanese, IconJava, IconJavaColor, IconJavaDuke, IconJavaDukeColor, IconKey, IconKotlin, IconKotlinColor, IconKotlinWhite, IconLaptop, IconLaunchdarkly, IconLegacyApp, IconLightbulb, IconLink, IconLinux, IconLock, IconLockOpen, IconLogin, IconLogout, IconMacos, IconMagicWand, IconMagnifier, IconMail, IconMedal, IconMemory, IconMenuGrid, IconMenuHamburger, IconMessage, IconMessageAlert, IconMessageQuestion, IconMicrophone, IconMinus, IconMinusCircle, IconMinusCircleFilled, IconMobile, IconMobileLandscape, IconMonitorChart, IconMoreHorizontal, IconMoreVertical, IconNews, IconNextjs, IconNodejs, IconOpenInNew, IconOther, IconOutsideContributor, IconOverview, IconPause, IconPencil, IconPeople, IconPercent, IconPerson, IconPersonWithDesk, IconPlay, IconPlus, IconPlusCircle, IconPlusCircleFilled, IconPower, IconProject, IconProjectSettings, IconPull, IconPush, IconPuzzle, IconPython, IconPythonColor, IconQuestionCircle, IconQuestionCircleFilled, IconReact, IconRefresh, IconRegex, IconRelease, IconReleaseFilled, IconRemoteAccess, IconReplace, IconResponsiveness, IconReviewerApproved, IconReviewerAssigned, IconReviewerRejected, IconRuby, IconRubyColor, IconSave, IconSecurityShield, IconSettings, IconSettingsFilled, IconShuffle, IconSiren, IconSkipCircle, IconSkipCircleFilled, IconSlack, IconSlackColor, IconSparkle, IconSparkleFilled, IconSpinnerOnDisabled, IconSpinnerPurple, IconSpinnerPurpleDouble, IconSpinnerWhite, IconStability, IconStack, IconStar, IconStep, IconStop, IconStopwatch, IconTag, IconTasks, IconTeams, IconTeamsColor, IconTemplateCode, IconTerminal, IconTestQuarantine, IconThemeDarkToggle, IconThumbDown, IconThumbUp, IconTools, IconTrash, IconTrigger, IconUbuntu, IconUbuntuColor, IconUnity3D, IconUpload, IconValidateShield, IconVideo, IconWarning, IconWarningYellow, IconWebUi, IconWebhooks, IconWorkflow, IconWorkflowFlow, IconXTwitter, IconXamarin, IconXcode, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast };
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
declare const noteCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "iconBar" | "message" | "iconWrapper" | "messageBlock" | "messageSolo" | "actionArea", {
|
|
2
|
+
status: {
|
|
3
|
+
ai: {
|
|
4
|
+
iconBar: {
|
|
5
|
+
background: "{colors.ai.background.minimal-vertical}";
|
|
6
|
+
color: string;
|
|
7
|
+
};
|
|
8
|
+
messageSolo: {
|
|
9
|
+
color: string;
|
|
10
|
+
};
|
|
11
|
+
root: {
|
|
12
|
+
backgroundColor: "transparent";
|
|
13
|
+
border: "1px solid transparent";
|
|
14
|
+
background: "linear-gradient({colors.background.primary}, {colors.background.primary}) padding-box, {colors.status.ai.border} border-box";
|
|
15
|
+
};
|
|
16
|
+
title: {
|
|
17
|
+
color: string;
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
critical: {
|
|
21
|
+
iconBar: {
|
|
22
|
+
backgroundColor: string;
|
|
23
|
+
color: string;
|
|
24
|
+
};
|
|
25
|
+
messageSolo: {
|
|
26
|
+
color: string;
|
|
27
|
+
};
|
|
28
|
+
root: {
|
|
29
|
+
borderColor: string;
|
|
30
|
+
};
|
|
31
|
+
title: {
|
|
32
|
+
color: string;
|
|
33
|
+
};
|
|
34
|
+
};
|
|
35
|
+
info: {
|
|
36
|
+
iconBar: {
|
|
37
|
+
backgroundColor: string;
|
|
38
|
+
color: string;
|
|
39
|
+
};
|
|
40
|
+
messageSolo: {
|
|
41
|
+
color: string;
|
|
42
|
+
};
|
|
43
|
+
root: {
|
|
44
|
+
borderColor: string;
|
|
45
|
+
};
|
|
46
|
+
title: {
|
|
47
|
+
color: string;
|
|
48
|
+
};
|
|
49
|
+
};
|
|
50
|
+
progress: {
|
|
51
|
+
iconBar: {
|
|
52
|
+
backgroundColor: string;
|
|
53
|
+
color: string;
|
|
54
|
+
};
|
|
55
|
+
messageSolo: {
|
|
56
|
+
color: string;
|
|
57
|
+
};
|
|
58
|
+
root: {
|
|
59
|
+
borderColor: string;
|
|
60
|
+
};
|
|
61
|
+
title: {
|
|
62
|
+
color: string;
|
|
63
|
+
};
|
|
64
|
+
};
|
|
65
|
+
success: {
|
|
66
|
+
iconBar: {
|
|
67
|
+
backgroundColor: string;
|
|
68
|
+
color: string;
|
|
69
|
+
};
|
|
70
|
+
messageSolo: {
|
|
71
|
+
color: string;
|
|
72
|
+
};
|
|
73
|
+
root: {
|
|
74
|
+
borderColor: string;
|
|
75
|
+
};
|
|
76
|
+
title: {
|
|
77
|
+
color: string;
|
|
78
|
+
};
|
|
79
|
+
};
|
|
80
|
+
warning: {
|
|
81
|
+
iconBar: {
|
|
82
|
+
backgroundColor: string;
|
|
83
|
+
color: string;
|
|
84
|
+
};
|
|
85
|
+
messageSolo: {
|
|
86
|
+
color: string;
|
|
87
|
+
};
|
|
88
|
+
root: {
|
|
89
|
+
borderColor: string;
|
|
90
|
+
};
|
|
91
|
+
title: {
|
|
92
|
+
color: string;
|
|
93
|
+
};
|
|
94
|
+
};
|
|
95
|
+
};
|
|
96
|
+
}>;
|
|
97
|
+
export default noteCardSlotRecipe;
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
import { ICONS_MAP } from "../common/AlertAndToast.common.js";
|
|
2
|
+
import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
3
|
+
//#region lib/theme/slot-recipes/NoteCard.recipe.ts
|
|
4
|
+
var TITLE_COLOR_MAP = {
|
|
5
|
+
ai: "status/ai/text",
|
|
6
|
+
critical: "text/negative",
|
|
7
|
+
info: "text/primary",
|
|
8
|
+
progress: "text/secondary",
|
|
9
|
+
success: "text/positive",
|
|
10
|
+
warning: "text/primary"
|
|
11
|
+
};
|
|
12
|
+
var getStatusVariant = (v) => ({
|
|
13
|
+
iconBar: {
|
|
14
|
+
backgroundColor: `status/${v}/bg`,
|
|
15
|
+
color: ICONS_MAP[v]
|
|
16
|
+
},
|
|
17
|
+
messageSolo: { color: TITLE_COLOR_MAP[v] },
|
|
18
|
+
root: { borderColor: `status/${v}/border` },
|
|
19
|
+
title: { color: TITLE_COLOR_MAP[v] }
|
|
20
|
+
});
|
|
21
|
+
var noteCardSlotRecipe = defineSlotRecipe({
|
|
22
|
+
className: "note-card",
|
|
23
|
+
slots: [
|
|
24
|
+
"root",
|
|
25
|
+
"iconBar",
|
|
26
|
+
"iconWrapper",
|
|
27
|
+
"content",
|
|
28
|
+
"messageBlock",
|
|
29
|
+
"title",
|
|
30
|
+
"message",
|
|
31
|
+
"messageSolo",
|
|
32
|
+
"actionArea"
|
|
33
|
+
],
|
|
34
|
+
base: {
|
|
35
|
+
root: {
|
|
36
|
+
alignItems: "stretch",
|
|
37
|
+
backgroundColor: "background/primary",
|
|
38
|
+
border: "1px solid",
|
|
39
|
+
borderRadius: "8",
|
|
40
|
+
display: "flex",
|
|
41
|
+
overflow: "hidden"
|
|
42
|
+
},
|
|
43
|
+
iconBar: {
|
|
44
|
+
alignItems: "flex-start",
|
|
45
|
+
display: "flex",
|
|
46
|
+
flexShrink: 0,
|
|
47
|
+
justifyContent: "center",
|
|
48
|
+
paddingBlock: "12",
|
|
49
|
+
paddingInline: "8"
|
|
50
|
+
},
|
|
51
|
+
iconWrapper: {
|
|
52
|
+
alignItems: "center",
|
|
53
|
+
display: "flex",
|
|
54
|
+
height: "24",
|
|
55
|
+
justifyContent: "center",
|
|
56
|
+
width: "24"
|
|
57
|
+
},
|
|
58
|
+
content: {
|
|
59
|
+
alignItems: "center",
|
|
60
|
+
display: "flex",
|
|
61
|
+
flex: 1,
|
|
62
|
+
gap: "24",
|
|
63
|
+
minWidth: 0,
|
|
64
|
+
paddingBlock: "12",
|
|
65
|
+
paddingInlineEnd: "16",
|
|
66
|
+
paddingInlineStart: "12"
|
|
67
|
+
},
|
|
68
|
+
messageBlock: {
|
|
69
|
+
display: "flex",
|
|
70
|
+
flex: 1,
|
|
71
|
+
flexDirection: "column",
|
|
72
|
+
gap: "4",
|
|
73
|
+
minWidth: 0,
|
|
74
|
+
width: "100%"
|
|
75
|
+
},
|
|
76
|
+
title: { textStyle: "comp/notification/title" },
|
|
77
|
+
message: {
|
|
78
|
+
textStyle: "comp/notification/message",
|
|
79
|
+
color: "text/body"
|
|
80
|
+
},
|
|
81
|
+
messageSolo: { textStyle: "comp/notification/message" },
|
|
82
|
+
actionArea: { flexShrink: 0 }
|
|
83
|
+
},
|
|
84
|
+
variants: { status: {
|
|
85
|
+
ai: {
|
|
86
|
+
iconBar: {
|
|
87
|
+
background: "{colors.ai.background.minimal-vertical}",
|
|
88
|
+
color: ICONS_MAP.ai
|
|
89
|
+
},
|
|
90
|
+
messageSolo: { color: TITLE_COLOR_MAP.ai },
|
|
91
|
+
root: {
|
|
92
|
+
backgroundColor: "transparent",
|
|
93
|
+
border: "1px solid transparent",
|
|
94
|
+
background: "linear-gradient({colors.background.primary}, {colors.background.primary}) padding-box, {colors.status.ai.border} border-box"
|
|
95
|
+
},
|
|
96
|
+
title: { color: TITLE_COLOR_MAP.ai }
|
|
97
|
+
},
|
|
98
|
+
critical: getStatusVariant("critical"),
|
|
99
|
+
info: getStatusVariant("info"),
|
|
100
|
+
progress: getStatusVariant("progress"),
|
|
101
|
+
success: getStatusVariant("success"),
|
|
102
|
+
warning: getStatusVariant("warning")
|
|
103
|
+
} },
|
|
104
|
+
defaultVariants: { status: "info" }
|
|
105
|
+
});
|
|
106
|
+
//#endregion
|
|
107
|
+
export { noteCardSlotRecipe as default };
|
|
108
|
+
|
|
109
|
+
//# sourceMappingURL=NoteCard.recipe.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NoteCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/NoteCard.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { ICONS_MAP, type NotificationVariant } from '../common/AlertAndToast.common';\n\nconst TITLE_COLOR_MAP: Record<NotificationVariant, string> = {\n ai: 'status/ai/text',\n critical: 'text/negative',\n info: 'text/primary',\n progress: 'text/secondary',\n success: 'text/positive',\n warning: 'text/primary',\n};\n\nconst getStatusVariant = (v: NotificationVariant) => ({\n iconBar: {\n backgroundColor: `status/${v}/bg`,\n color: ICONS_MAP[v],\n },\n messageSolo: { color: TITLE_COLOR_MAP[v] },\n root: { borderColor: `status/${v}/border` },\n title: { color: TITLE_COLOR_MAP[v] },\n});\n\nconst noteCardSlotRecipe = defineSlotRecipe({\n className: 'note-card',\n slots: ['root', 'iconBar', 'iconWrapper', 'content', 'messageBlock', 'title', 'message', 'messageSolo', 'actionArea'],\n base: {\n root: {\n alignItems: 'stretch',\n backgroundColor: 'background/primary',\n border: '1px solid',\n borderRadius: '8',\n display: 'flex',\n overflow: 'hidden',\n },\n iconBar: {\n alignItems: 'flex-start',\n display: 'flex',\n flexShrink: 0,\n justifyContent: 'center',\n paddingBlock: '12',\n paddingInline: '8',\n },\n iconWrapper: {\n alignItems: 'center',\n display: 'flex',\n height: '24',\n justifyContent: 'center',\n width: '24',\n },\n content: {\n alignItems: 'center',\n display: 'flex',\n flex: 1,\n gap: '24',\n minWidth: 0,\n paddingBlock: '12',\n paddingInlineEnd: '16',\n paddingInlineStart: '12',\n },\n messageBlock: {\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n gap: '4',\n minWidth: 0,\n width: '100%',\n },\n title: {\n textStyle: 'comp/notification/title',\n },\n message: {\n textStyle: 'comp/notification/message',\n color: 'text/body',\n },\n messageSolo: {\n textStyle: 'comp/notification/message',\n },\n actionArea: {\n flexShrink: 0,\n },\n },\n variants: {\n status: {\n ai: {\n iconBar: {\n background: '{colors.ai.background.minimal-vertical}',\n color: ICONS_MAP.ai,\n },\n messageSolo: { color: TITLE_COLOR_MAP.ai },\n root: {\n backgroundColor: 'transparent',\n border: '1px solid transparent',\n background:\n 'linear-gradient({colors.background.primary}, {colors.background.primary}) padding-box, {colors.status.ai.border} border-box',\n },\n title: { color: TITLE_COLOR_MAP.ai },\n },\n critical: getStatusVariant('critical'),\n info: getStatusVariant('info'),\n progress: getStatusVariant('progress'),\n success: getStatusVariant('success'),\n warning: getStatusVariant('warning'),\n },\n },\n defaultVariants: {\n status: 'info',\n },\n});\n\nexport default noteCardSlotRecipe;\n"],"mappings":";;;AAIA,IAAM,kBAAuD;CAC3D,IAAI;CACJ,UAAU;CACV,MAAM;CACN,UAAU;CACV,SAAS;CACT,SAAS;CACV;AAED,IAAM,oBAAoB,OAA4B;CACpD,SAAS;EACP,iBAAiB,UAAU,EAAE;EAC7B,OAAO,UAAU;EAClB;CACD,aAAa,EAAE,OAAO,gBAAgB,IAAI;CAC1C,MAAM,EAAE,aAAa,UAAU,EAAE,UAAU;CAC3C,OAAO,EAAE,OAAO,gBAAgB,IAAI;CACrC;AAED,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAAO;EAAC;EAAQ;EAAW;EAAe;EAAW;EAAgB;EAAS;EAAW;EAAe;EAAa;CACrH,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,iBAAiB;GACjB,QAAQ;GACR,cAAc;GACd,SAAS;GACT,UAAU;GACX;EACD,SAAS;GACP,YAAY;GACZ,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,cAAc;GACd,eAAe;GAChB;EACD,aAAa;GACX,YAAY;GACZ,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,OAAO;GACR;EACD,SAAS;GACP,YAAY;GACZ,SAAS;GACT,MAAM;GACN,KAAK;GACL,UAAU;GACV,cAAc;GACd,kBAAkB;GAClB,oBAAoB;GACrB;EACD,cAAc;GACZ,SAAS;GACT,MAAM;GACN,eAAe;GACf,KAAK;GACL,UAAU;GACV,OAAO;GACR;EACD,OAAO,EACL,WAAW,2BACZ;EACD,SAAS;GACP,WAAW;GACX,OAAO;GACR;EACD,aAAa,EACX,WAAW,6BACZ;EACD,YAAY,EACV,YAAY,GACb;EACF;CACD,UAAU,EACR,QAAQ;EACN,IAAI;GACF,SAAS;IACP,YAAY;IACZ,OAAO,UAAU;IAClB;GACD,aAAa,EAAE,OAAO,gBAAgB,IAAI;GAC1C,MAAM;IACJ,iBAAiB;IACjB,QAAQ;IACR,YACE;IACH;GACD,OAAO,EAAE,OAAO,gBAAgB,IAAI;GACrC;EACD,UAAU,iBAAiB,WAAW;EACtC,MAAM,iBAAiB,OAAO;EAC9B,UAAU,iBAAiB,WAAW;EACtC,SAAS,iBAAiB,UAAU;EACpC,SAAS,iBAAiB,UAAU;EACrC,EACF;CACD,iBAAiB,EACf,QAAQ,QACT;CACF,CAAC"}
|
|
@@ -731,6 +731,102 @@ declare const slotRecipes: {
|
|
|
731
731
|
};
|
|
732
732
|
};
|
|
733
733
|
}>;
|
|
734
|
+
noteCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "iconBar" | "message" | "iconWrapper" | "messageBlock" | "messageSolo" | "actionArea", {
|
|
735
|
+
status: {
|
|
736
|
+
ai: {
|
|
737
|
+
iconBar: {
|
|
738
|
+
background: "{colors.ai.background.minimal-vertical}";
|
|
739
|
+
color: string;
|
|
740
|
+
};
|
|
741
|
+
messageSolo: {
|
|
742
|
+
color: string;
|
|
743
|
+
};
|
|
744
|
+
root: {
|
|
745
|
+
backgroundColor: "transparent";
|
|
746
|
+
border: "1px solid transparent";
|
|
747
|
+
background: "linear-gradient({colors.background.primary}, {colors.background.primary}) padding-box, {colors.status.ai.border} border-box";
|
|
748
|
+
};
|
|
749
|
+
title: {
|
|
750
|
+
color: string;
|
|
751
|
+
};
|
|
752
|
+
};
|
|
753
|
+
critical: {
|
|
754
|
+
iconBar: {
|
|
755
|
+
backgroundColor: string;
|
|
756
|
+
color: string;
|
|
757
|
+
};
|
|
758
|
+
messageSolo: {
|
|
759
|
+
color: string;
|
|
760
|
+
};
|
|
761
|
+
root: {
|
|
762
|
+
borderColor: string;
|
|
763
|
+
};
|
|
764
|
+
title: {
|
|
765
|
+
color: string;
|
|
766
|
+
};
|
|
767
|
+
};
|
|
768
|
+
info: {
|
|
769
|
+
iconBar: {
|
|
770
|
+
backgroundColor: string;
|
|
771
|
+
color: string;
|
|
772
|
+
};
|
|
773
|
+
messageSolo: {
|
|
774
|
+
color: string;
|
|
775
|
+
};
|
|
776
|
+
root: {
|
|
777
|
+
borderColor: string;
|
|
778
|
+
};
|
|
779
|
+
title: {
|
|
780
|
+
color: string;
|
|
781
|
+
};
|
|
782
|
+
};
|
|
783
|
+
progress: {
|
|
784
|
+
iconBar: {
|
|
785
|
+
backgroundColor: string;
|
|
786
|
+
color: string;
|
|
787
|
+
};
|
|
788
|
+
messageSolo: {
|
|
789
|
+
color: string;
|
|
790
|
+
};
|
|
791
|
+
root: {
|
|
792
|
+
borderColor: string;
|
|
793
|
+
};
|
|
794
|
+
title: {
|
|
795
|
+
color: string;
|
|
796
|
+
};
|
|
797
|
+
};
|
|
798
|
+
success: {
|
|
799
|
+
iconBar: {
|
|
800
|
+
backgroundColor: string;
|
|
801
|
+
color: string;
|
|
802
|
+
};
|
|
803
|
+
messageSolo: {
|
|
804
|
+
color: string;
|
|
805
|
+
};
|
|
806
|
+
root: {
|
|
807
|
+
borderColor: string;
|
|
808
|
+
};
|
|
809
|
+
title: {
|
|
810
|
+
color: string;
|
|
811
|
+
};
|
|
812
|
+
};
|
|
813
|
+
warning: {
|
|
814
|
+
iconBar: {
|
|
815
|
+
backgroundColor: string;
|
|
816
|
+
color: string;
|
|
817
|
+
};
|
|
818
|
+
messageSolo: {
|
|
819
|
+
color: string;
|
|
820
|
+
};
|
|
821
|
+
root: {
|
|
822
|
+
borderColor: string;
|
|
823
|
+
};
|
|
824
|
+
title: {
|
|
825
|
+
color: string;
|
|
826
|
+
};
|
|
827
|
+
};
|
|
828
|
+
};
|
|
829
|
+
}>;
|
|
734
830
|
nativeSelect: import('@chakra-ui/react').SlotRecipeDefinition<"field" | "root" | "indicator" | "statusIcon", {
|
|
735
831
|
size: {
|
|
736
832
|
md: {
|
|
@@ -26,6 +26,7 @@ import markdownSlotRecipe from "./Markdown.recipe.js";
|
|
|
26
26
|
import markdownCardSlotRecipe from "./MarkdownCard.recipe.js";
|
|
27
27
|
import menuSlotRecipe from "./Menu.recipe.js";
|
|
28
28
|
import nativeSelectSlotRecipe from "./NativeSelect.recipe.js";
|
|
29
|
+
import noteCardSlotRecipe from "./NoteCard.recipe.js";
|
|
29
30
|
import paginationLoadMoreRecipe from "./PaginationLoadMore.recipe.js";
|
|
30
31
|
import radioGroupSlotRecipe from "./RadioGroup.recipe.js";
|
|
31
32
|
import ribbonSlotRecipe from "./Ribbon.recipe.js";
|
|
@@ -66,6 +67,7 @@ var slotRecipes = {
|
|
|
66
67
|
markdown: markdownSlotRecipe,
|
|
67
68
|
markdownCard: markdownCardSlotRecipe,
|
|
68
69
|
menu: menuSlotRecipe,
|
|
70
|
+
noteCard: noteCardSlotRecipe,
|
|
69
71
|
nativeSelect: nativeSelectSlotRecipe,
|
|
70
72
|
numberInput: numberInputSlotRecipe,
|
|
71
73
|
paginationLoadMore: paginationLoadMoreRecipe,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../lib/theme/slot-recipes/index.ts"],"sourcesContent":["import accordionSlotRecipe from './Accordion.recipe.ts';\nimport actionBarSlotRecipe from './ActionBar.recipe.ts';\nimport alertSlotRecipe from './Alert.recipe.ts';\nimport avatarSlotRecipe from './Avatar.recipe.ts';\nimport breadcrumbSlotRecipe from './Breadcrumb.recipe.ts';\nimport cardSlotRecipe from './Card.recipe';\nimport checkboxSlotRecipe from './Checkbox.recipe';\nimport codeSnippetSlotRecipe from './CodeSnippet.recipe.ts';\nimport collapsibleSlotRecipe from './Collapsible.recipe.ts';\nimport comboboxSlotRecipe from './Combobox.recipe.ts';\nimport datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport emptyStateSlotRecipe from './EmptyState.recipe';\nimport expandableCardSlotRecipe from './ExpandableCard.recipe.ts';\nimport fieldSlotRecipe from './Field.recipe';\nimport fieldsetSlotRecipe from './Fieldset.recipe.ts';\nimport fileUploadSlotRecipe from './FileUpload.recipe.ts';\nimport groupHeadingSlotRecipe from './GroupHeading.recipe.ts';\nimport imageCropperSlotRecipe from './ImageCropper.recipe.ts';\nimport inlineLoadingSlotRecipe from './InlineLoading.recipe.ts';\nimport listSlotRecipe from './List.recipe.ts';\nimport markdownSlotRecipe from './Markdown.recipe.ts';\nimport markdownCardSlotRecipe from './MarkdownCard.recipe.ts';\nimport menuSlotRecipe from './Menu.recipe.ts';\nimport nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.recipe.ts';\nimport radioGroupSlotRecipe from './RadioGroup.recipe.ts';\nimport ribbonSlotRecipe from './Ribbon.recipe.ts';\nimport sectionHeadingSlotRecipe from './SectionHeading.recipe.ts';\nimport segmentGroupSlotRecipe from './SegmentGroup.recipe.ts';\nimport { selectSlotRecipe } from './Select.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport switchSlotRecipe from './Switch.recipe';\nimport tableSlotRecipe from './Table.recipe.ts';\nimport tabsSlotRecipe from './Tabs.recipe';\nimport tagSlotRecipe from './Tag.recipe.ts';\nimport tagsInputSlotRecipe from './TagsInput.recipe.ts';\nimport toastSlotRecipe from './Toast.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\n\nconst slotRecipes = {\n accordion: accordionSlotRecipe,\n actionBar: actionBarSlotRecipe,\n alert: alertSlotRecipe,\n avatar: avatarSlotRecipe,\n breadcrumb: breadcrumbSlotRecipe,\n card: cardSlotRecipe,\n checkbox: checkboxSlotRecipe,\n codeSnippet: codeSnippetSlotRecipe,\n collapsible: collapsibleSlotRecipe,\n combobox: comboboxSlotRecipe,\n datePicker: datePickerSlotRecipe,\n datePickerSelect: datePickerSelectSlotRecipe,\n dialog: dialogSlotRecipe,\n emptyState: emptyStateSlotRecipe,\n expandableCard: expandableCardSlotRecipe,\n field: fieldSlotRecipe,\n groupHeading: groupHeadingSlotRecipe,\n fieldset: fieldsetSlotRecipe,\n fileUpload: fileUploadSlotRecipe,\n imageCropper: imageCropperSlotRecipe,\n inlineLoading: inlineLoadingSlotRecipe,\n list: listSlotRecipe,\n markdown: markdownSlotRecipe,\n markdownCard: markdownCardSlotRecipe,\n menu: menuSlotRecipe,\n nativeSelect: nativeSelectSlotRecipe,\n numberInput: numberInputSlotRecipe,\n paginationLoadMore: paginationLoadMoreSlotRecipe,\n radioGroup: radioGroupSlotRecipe,\n ribbon: ribbonSlotRecipe,\n sectionHeading: sectionHeadingSlotRecipe,\n segmentGroup: segmentGroupSlotRecipe,\n select: selectSlotRecipe,\n splitButton: splitButtonSlotRecipe,\n switch: switchSlotRecipe,\n table: tableSlotRecipe,\n tabs: tabsSlotRecipe,\n tag: tagSlotRecipe,\n tagsInput: tagsInputSlotRecipe,\n toast: toastSlotRecipe,\n tooltip: tooltipSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../lib/theme/slot-recipes/index.ts"],"sourcesContent":["import accordionSlotRecipe from './Accordion.recipe.ts';\nimport actionBarSlotRecipe from './ActionBar.recipe.ts';\nimport alertSlotRecipe from './Alert.recipe.ts';\nimport avatarSlotRecipe from './Avatar.recipe.ts';\nimport breadcrumbSlotRecipe from './Breadcrumb.recipe.ts';\nimport cardSlotRecipe from './Card.recipe';\nimport checkboxSlotRecipe from './Checkbox.recipe';\nimport codeSnippetSlotRecipe from './CodeSnippet.recipe.ts';\nimport collapsibleSlotRecipe from './Collapsible.recipe.ts';\nimport comboboxSlotRecipe from './Combobox.recipe.ts';\nimport datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport emptyStateSlotRecipe from './EmptyState.recipe';\nimport expandableCardSlotRecipe from './ExpandableCard.recipe.ts';\nimport fieldSlotRecipe from './Field.recipe';\nimport fieldsetSlotRecipe from './Fieldset.recipe.ts';\nimport fileUploadSlotRecipe from './FileUpload.recipe.ts';\nimport groupHeadingSlotRecipe from './GroupHeading.recipe.ts';\nimport imageCropperSlotRecipe from './ImageCropper.recipe.ts';\nimport inlineLoadingSlotRecipe from './InlineLoading.recipe.ts';\nimport listSlotRecipe from './List.recipe.ts';\nimport markdownSlotRecipe from './Markdown.recipe.ts';\nimport markdownCardSlotRecipe from './MarkdownCard.recipe.ts';\nimport menuSlotRecipe from './Menu.recipe.ts';\nimport nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.recipe.ts';\nimport radioGroupSlotRecipe from './RadioGroup.recipe.ts';\nimport ribbonSlotRecipe from './Ribbon.recipe.ts';\nimport sectionHeadingSlotRecipe from './SectionHeading.recipe.ts';\nimport segmentGroupSlotRecipe from './SegmentGroup.recipe.ts';\nimport { selectSlotRecipe } from './Select.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport switchSlotRecipe from './Switch.recipe';\nimport tableSlotRecipe from './Table.recipe.ts';\nimport tabsSlotRecipe from './Tabs.recipe';\nimport tagSlotRecipe from './Tag.recipe.ts';\nimport tagsInputSlotRecipe from './TagsInput.recipe.ts';\nimport toastSlotRecipe from './Toast.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\n\nconst slotRecipes = {\n accordion: accordionSlotRecipe,\n actionBar: actionBarSlotRecipe,\n alert: alertSlotRecipe,\n avatar: avatarSlotRecipe,\n breadcrumb: breadcrumbSlotRecipe,\n card: cardSlotRecipe,\n checkbox: checkboxSlotRecipe,\n codeSnippet: codeSnippetSlotRecipe,\n collapsible: collapsibleSlotRecipe,\n combobox: comboboxSlotRecipe,\n datePicker: datePickerSlotRecipe,\n datePickerSelect: datePickerSelectSlotRecipe,\n dialog: dialogSlotRecipe,\n emptyState: emptyStateSlotRecipe,\n expandableCard: expandableCardSlotRecipe,\n field: fieldSlotRecipe,\n groupHeading: groupHeadingSlotRecipe,\n fieldset: fieldsetSlotRecipe,\n fileUpload: fileUploadSlotRecipe,\n imageCropper: imageCropperSlotRecipe,\n inlineLoading: inlineLoadingSlotRecipe,\n list: listSlotRecipe,\n markdown: markdownSlotRecipe,\n markdownCard: markdownCardSlotRecipe,\n menu: menuSlotRecipe,\n noteCard: noteCardSlotRecipe,\n nativeSelect: nativeSelectSlotRecipe,\n numberInput: numberInputSlotRecipe,\n paginationLoadMore: paginationLoadMoreSlotRecipe,\n radioGroup: radioGroupSlotRecipe,\n ribbon: ribbonSlotRecipe,\n sectionHeading: sectionHeadingSlotRecipe,\n segmentGroup: segmentGroupSlotRecipe,\n select: selectSlotRecipe,\n splitButton: splitButtonSlotRecipe,\n switch: switchSlotRecipe,\n table: tableSlotRecipe,\n tabs: tabsSlotRecipe,\n tag: tagSlotRecipe,\n tagsInput: tagsInputSlotRecipe,\n toast: toastSlotRecipe,\n tooltip: tooltipSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,IAAM,cAAc;CAClB,WAAW;CACX,WAAW;CACX,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,MAAM;CACN,UAAU;CACV,aAAa;CACb,aAAa;CACb,UAAU;CACV,YAAY;CACZ,kBAAkB;CAClB,QAAQ;CACR,YAAY;CACZ,gBAAgB;CAChB,OAAO;CACP,cAAc;CACd,UAAU;CACV,YAAY;CACZ,cAAc;CACd,eAAe;CACf,MAAM;CACN,UAAU;CACV,cAAc;CACd,MAAM;CACN,UAAU;CACV,cAAc;CACd,aAAa;CACb,oBAAoB;CACpB,YAAY;CACZ,QAAQ;CACR,gBAAgB;CAChB,cAAc;CACd,QAAQ;CACR,aAAa;CACb,QAAQ;CACR,OAAO;CACP,MAAM;CACN,KAAK;CACL,WAAW;CACX,OAAO;CACP,SAAS;CACV"}
|
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.185",
|
|
5
5
|
"description": "Bitrise Design System Components built with Chakra UI V3",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"react",
|
|
@@ -64,7 +64,7 @@
|
|
|
64
64
|
"@storybook/addon-mcp": "^0.5.0",
|
|
65
65
|
"@storybook/react-vite": "10.3.5",
|
|
66
66
|
"@svgr/plugin-jsx": "^8.1.0",
|
|
67
|
-
"@types/node": "^25.
|
|
67
|
+
"@types/node": "^25.6.0",
|
|
68
68
|
"@types/react": "^18.3.28",
|
|
69
69
|
"@types/react-dom": "^18.3.7",
|
|
70
70
|
"@vitejs/plugin-react": "^6.0.1",
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { TooltipRootProps } from '@chakra-ui/react/tooltip';
|
|
2
|
-
import { ReactNode } from 'react';
|
|
3
|
-
import { BitkitColorButtonProps } from '../BitkitColorButton/BitkitColorButton';
|
|
4
|
-
export type BitkitInteractiveTooltipProps = {
|
|
5
|
-
button?: BitkitColorButtonProps;
|
|
6
|
-
children: ReactNode;
|
|
7
|
-
learnMoreTarget?: HTMLAnchorElement['target'];
|
|
8
|
-
learnMoreUrl: string;
|
|
9
|
-
placement?: NonNullable<TooltipRootProps['positioning']>['placement'];
|
|
10
|
-
text: string;
|
|
11
|
-
};
|
|
12
|
-
declare const BitkitInteractiveTooltip: {
|
|
13
|
-
({ button, children, learnMoreTarget, learnMoreUrl, placement, text, }: BitkitInteractiveTooltipProps): import("react/jsx-runtime").JSX.Element;
|
|
14
|
-
displayName: string;
|
|
15
|
-
};
|
|
16
|
-
export default BitkitInteractiveTooltip;
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import BitkitColorButton from "../BitkitColorButton/BitkitColorButton.js";
|
|
2
|
-
import { Box } from "@chakra-ui/react/box";
|
|
3
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
-
import { Tooltip } from "@chakra-ui/react/tooltip";
|
|
5
|
-
import { Link } from "@chakra-ui/react/link";
|
|
6
|
-
//#region lib/components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.tsx
|
|
7
|
-
var BitkitInteractiveTooltip = ({ button, children, learnMoreTarget, learnMoreUrl, placement = "top", text }) => {
|
|
8
|
-
return /* @__PURE__ */ jsxs(Tooltip.Root, {
|
|
9
|
-
interactive: true,
|
|
10
|
-
paddingSize: "lg",
|
|
11
|
-
positioning: {
|
|
12
|
-
placement,
|
|
13
|
-
offset: {
|
|
14
|
-
mainAxis: 8,
|
|
15
|
-
crossAxis: 0
|
|
16
|
-
}
|
|
17
|
-
},
|
|
18
|
-
children: [/* @__PURE__ */ jsx(Tooltip.Trigger, {
|
|
19
|
-
asChild: true,
|
|
20
|
-
children
|
|
21
|
-
}), /* @__PURE__ */ jsx(Tooltip.Positioner, { children: /* @__PURE__ */ jsxs(Tooltip.Content, { children: [
|
|
22
|
-
/* @__PURE__ */ jsx(Tooltip.Arrow, { children: /* @__PURE__ */ jsx(Tooltip.ArrowTip, {}) }),
|
|
23
|
-
text,
|
|
24
|
-
/* @__PURE__ */ jsxs(Box, {
|
|
25
|
-
marginBlockStart: "16",
|
|
26
|
-
display: "flex",
|
|
27
|
-
gap: "16",
|
|
28
|
-
justifyContent: "space-between",
|
|
29
|
-
alignItems: "center",
|
|
30
|
-
children: [/* @__PURE__ */ jsx(Link, {
|
|
31
|
-
color: "sys/purple/highlight",
|
|
32
|
-
href: learnMoreUrl,
|
|
33
|
-
rel: learnMoreTarget === "_blank" ? "noopener noreferrer" : void 0,
|
|
34
|
-
target: learnMoreTarget,
|
|
35
|
-
children: "Learn more"
|
|
36
|
-
}), button && /* @__PURE__ */ jsx(BitkitColorButton, { ...button })]
|
|
37
|
-
})
|
|
38
|
-
] }) })]
|
|
39
|
-
});
|
|
40
|
-
};
|
|
41
|
-
BitkitInteractiveTooltip.displayName = "BitkitInteractiveTooltip";
|
|
42
|
-
//#endregion
|
|
43
|
-
export { BitkitInteractiveTooltip as default };
|
|
44
|
-
|
|
45
|
-
//# sourceMappingURL=BitkitInteractiveTooltip.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitInteractiveTooltip.js","names":[],"sources":["../../../lib/components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Link } from '@chakra-ui/react/link';\nimport { Tooltip, type TooltipRootProps } from '@chakra-ui/react/tooltip';\nimport { type ReactNode } from 'react';\n\nimport BitkitColorButton, { type BitkitColorButtonProps } from '../BitkitColorButton/BitkitColorButton';\n\nexport type BitkitInteractiveTooltipProps = {\n button?: BitkitColorButtonProps;\n children: ReactNode;\n learnMoreTarget?: HTMLAnchorElement['target'];\n learnMoreUrl: string;\n placement?: NonNullable<TooltipRootProps['positioning']>['placement'];\n text: string;\n};\n\nconst BitkitInteractiveTooltip = ({\n button,\n children,\n learnMoreTarget,\n learnMoreUrl,\n placement = 'top',\n text,\n}: BitkitInteractiveTooltipProps) => {\n return (\n <Tooltip.Root interactive paddingSize=\"lg\" positioning={{ placement, offset: { mainAxis: 8, crossAxis: 0 } }}>\n <Tooltip.Trigger asChild>{children}</Tooltip.Trigger>\n <Tooltip.Positioner>\n <Tooltip.Content>\n <Tooltip.Arrow>\n <Tooltip.ArrowTip />\n </Tooltip.Arrow>\n {text}\n <Box marginBlockStart=\"16\" display=\"flex\" gap=\"16\" justifyContent=\"space-between\" alignItems=\"center\">\n <Link\n color=\"sys/purple/highlight\"\n href={learnMoreUrl}\n rel={learnMoreTarget === '_blank' ? 'noopener noreferrer' : undefined}\n target={learnMoreTarget}\n >\n Learn more\n </Link>\n {button && <BitkitColorButton {...button} />}\n </Box>\n </Tooltip.Content>\n </Tooltip.Positioner>\n </Tooltip.Root>\n );\n};\n\nBitkitInteractiveTooltip.displayName = 'BitkitInteractiveTooltip';\n\nexport default BitkitInteractiveTooltip;\n"],"mappings":";;;;;;AAgBA,IAAM,4BAA4B,EAChC,QACA,UACA,iBACA,cACA,YAAY,OACZ,WACmC;AACnC,QACE,qBAAC,QAAQ,MAAT;EAAc,aAAA;EAAY,aAAY;EAAK,aAAa;GAAE;GAAW,QAAQ;IAAE,UAAU;IAAG,WAAW;IAAG;GAAE;YAA5G,CACE,oBAAC,QAAQ,SAAT;GAAiB,SAAA;GAAS;GAA2B,CAAA,EACrD,oBAAC,QAAQ,YAAT,EAAA,UACE,qBAAC,QAAQ,SAAT,EAAA,UAAA;GACE,oBAAC,QAAQ,OAAT,EAAA,UACE,oBAAC,QAAQ,UAAT,EAAoB,CAAA,EACN,CAAA;GACf;GACD,qBAAC,KAAD;IAAK,kBAAiB;IAAK,SAAQ;IAAO,KAAI;IAAK,gBAAe;IAAgB,YAAW;cAA7F,CACE,oBAAC,MAAD;KACE,OAAM;KACN,MAAM;KACN,KAAK,oBAAoB,WAAW,wBAAwB,KAAA;KAC5D,QAAQ;eACT;KAEM,CAAA,EACN,UAAU,oBAAC,mBAAD,EAAmB,GAAI,QAAU,CAAA,CACxC;;GACU,EAAA,CAAA,EACC,CAAA,CACR;;;AAInB,yBAAyB,cAAc"}
|