@bitrise/bitkit-v2 0.3.190 → 0.3.192
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/BitkitSidebar/BitkitSidebar.d.ts +45 -0
- package/dist/components/BitkitSidebar/BitkitSidebar.js +143 -0
- package/dist/components/BitkitSidebar/BitkitSidebar.js.map +1 -0
- package/dist/components/BitkitSteps/BitkitSteps.d.ts +11 -8
- package/dist/components/BitkitSteps/BitkitSteps.js +42 -24
- package/dist/components/BitkitSteps/BitkitSteps.js.map +1 -1
- package/dist/components/BitkitStepsCard/BitkitStepsCard.d.ts +30 -0
- package/dist/components/BitkitStepsCard/BitkitStepsCard.js +87 -0
- package/dist/components/BitkitStepsCard/BitkitStepsCard.js.map +1 -0
- package/dist/components/BitkitStepsCard/StepCardContext.d.ts +5 -0
- package/dist/components/BitkitStepsCard/StepCardContext.js +10 -0
- package/dist/components/BitkitStepsCard/StepCardContext.js.map +1 -0
- package/dist/components/index.d.ts +3 -1
- package/dist/main.js +4 -2
- package/dist/theme/slot-recipes/Sidebar.recipe.d.ts +22 -0
- package/dist/theme/slot-recipes/Sidebar.recipe.js +143 -0
- package/dist/theme/slot-recipes/Sidebar.recipe.js.map +1 -0
- package/dist/theme/slot-recipes/StepCard.recipe.d.ts +2 -0
- package/dist/theme/slot-recipes/StepCard.recipe.js +55 -0
- package/dist/theme/slot-recipes/StepCard.recipe.js.map +1 -0
- package/dist/theme/slot-recipes/index.d.ts +22 -0
- package/dist/theme/slot-recipes/index.js +4 -0
- package/dist/theme/slot-recipes/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { BoxProps } from '@chakra-ui/react/box';
|
|
2
|
+
import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
|
|
3
|
+
import { ReactNode } from 'react';
|
|
4
|
+
import { BitkitIconComponent } from '../../icons';
|
|
5
|
+
import { BitkitGroupHeadingProps } from '../BitkitGroupHeading/BitkitGroupHeading';
|
|
6
|
+
export interface BitkitSidebarProps extends BoxProps {
|
|
7
|
+
children: ReactNode;
|
|
8
|
+
}
|
|
9
|
+
interface BitkitSidebarItemCommonProps {
|
|
10
|
+
badge?: ReactNode;
|
|
11
|
+
children: ReactNode;
|
|
12
|
+
icon?: BitkitIconComponent;
|
|
13
|
+
selected?: boolean;
|
|
14
|
+
suffixIcon?: BitkitIconComponent;
|
|
15
|
+
}
|
|
16
|
+
interface BitkitSidebarItemLinkProps extends Omit<HTMLChakraProps<'a'>, 'children'>, BitkitSidebarItemCommonProps {
|
|
17
|
+
href: string;
|
|
18
|
+
}
|
|
19
|
+
interface BitkitSidebarItemButtonProps extends Omit<HTMLChakraProps<'button'>, 'children'>, BitkitSidebarItemCommonProps {
|
|
20
|
+
href?: never;
|
|
21
|
+
}
|
|
22
|
+
export type BitkitSidebarItemProps = BitkitSidebarItemButtonProps | BitkitSidebarItemLinkProps;
|
|
23
|
+
export interface BitkitSidebarTitleProps extends BoxProps {
|
|
24
|
+
backHref?: string;
|
|
25
|
+
backLabel?: string;
|
|
26
|
+
children: ReactNode;
|
|
27
|
+
onBackClick?: () => void;
|
|
28
|
+
}
|
|
29
|
+
export interface BitkitSidebarFooterProps extends BoxProps {
|
|
30
|
+
children: ReactNode;
|
|
31
|
+
}
|
|
32
|
+
export interface BitkitSidebarProjectProps extends BoxProps {
|
|
33
|
+
label: string;
|
|
34
|
+
value: string;
|
|
35
|
+
}
|
|
36
|
+
export type BitkitSidebarGroupHeadingProps = BitkitGroupHeadingProps;
|
|
37
|
+
declare const _default: import('react').ForwardRefExoticComponent<BitkitSidebarProps & import('react').RefAttributes<HTMLElement>> & {
|
|
38
|
+
Divider: import('react').ForwardRefExoticComponent<import('react').RefAttributes<HTMLDivElement>>;
|
|
39
|
+
Footer: import('react').ForwardRefExoticComponent<BitkitSidebarFooterProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
40
|
+
GroupHeading: import('react').ForwardRefExoticComponent<BitkitGroupHeadingProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
41
|
+
Item: import('react').ForwardRefExoticComponent<BitkitSidebarItemProps & import('react').RefAttributes<HTMLButtonElement & HTMLAnchorElement>>;
|
|
42
|
+
Project: import('react').ForwardRefExoticComponent<BitkitSidebarProjectProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
43
|
+
Title: import('react').ForwardRefExoticComponent<BitkitSidebarTitleProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
44
|
+
};
|
|
45
|
+
export default _default;
|
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
import IconChevronLeft from "../../icons/IconChevronLeft.js";
|
|
2
|
+
import BitkitLabelTooltip from "../BitkitLabelTooltip/BitkitLabelTooltip.js";
|
|
3
|
+
import BitkitGroupHeading from "../BitkitGroupHeading/BitkitGroupHeading.js";
|
|
4
|
+
import { Box } from "@chakra-ui/react/box";
|
|
5
|
+
import { chakra, useRecipe, useSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
6
|
+
import { forwardRef } from "react";
|
|
7
|
+
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
8
|
+
import { Separator } from "@chakra-ui/react/separator";
|
|
9
|
+
//#region lib/components/BitkitSidebar/BitkitSidebar.tsx
|
|
10
|
+
var BitkitSidebar = forwardRef((props, ref) => {
|
|
11
|
+
const { children, ...rest } = props;
|
|
12
|
+
return /* @__PURE__ */ jsx(Box, {
|
|
13
|
+
ref,
|
|
14
|
+
asChild: true,
|
|
15
|
+
css: useSlotRecipe({ key: "sidebar" })().root,
|
|
16
|
+
...rest,
|
|
17
|
+
children: /* @__PURE__ */ jsx("nav", { children })
|
|
18
|
+
});
|
|
19
|
+
});
|
|
20
|
+
BitkitSidebar.displayName = "BitkitSidebar";
|
|
21
|
+
var BitkitSidebarItem = forwardRef((props, ref) => {
|
|
22
|
+
const { badge, children, icon: Icon, selected, suffixIcon: SuffixIcon, ...rest } = props;
|
|
23
|
+
const styles = useSlotRecipe({ key: "sidebar" })({ selected });
|
|
24
|
+
const itemContent = /* @__PURE__ */ jsxs(Fragment$1, { children: [
|
|
25
|
+
Icon && /* @__PURE__ */ jsx(Icon, {
|
|
26
|
+
css: styles.itemIcon,
|
|
27
|
+
size: "24"
|
|
28
|
+
}),
|
|
29
|
+
/* @__PURE__ */ jsx(chakra.span, {
|
|
30
|
+
css: styles.itemLabel,
|
|
31
|
+
children
|
|
32
|
+
}),
|
|
33
|
+
badge,
|
|
34
|
+
SuffixIcon && /* @__PURE__ */ jsx(SuffixIcon, {
|
|
35
|
+
css: styles.suffixIcon,
|
|
36
|
+
size: "24"
|
|
37
|
+
}),
|
|
38
|
+
/* @__PURE__ */ jsx(chakra.div, { css: styles.selectionMarker })
|
|
39
|
+
] });
|
|
40
|
+
if (rest.href !== void 0) {
|
|
41
|
+
const { className, ...linkRest } = rest;
|
|
42
|
+
return /* @__PURE__ */ jsx(chakra.a, {
|
|
43
|
+
ref,
|
|
44
|
+
...linkRest,
|
|
45
|
+
"aria-current": selected ? "page" : void 0,
|
|
46
|
+
className: className ? `group ${className}` : "group",
|
|
47
|
+
css: styles.item,
|
|
48
|
+
children: itemContent
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
const { className, href: _, ...buttonRest } = rest;
|
|
52
|
+
return /* @__PURE__ */ jsx(chakra.button, {
|
|
53
|
+
ref,
|
|
54
|
+
...buttonRest,
|
|
55
|
+
"aria-pressed": selected,
|
|
56
|
+
className: className ? `group ${className}` : "group",
|
|
57
|
+
css: styles.item,
|
|
58
|
+
type: "button",
|
|
59
|
+
children: itemContent
|
|
60
|
+
});
|
|
61
|
+
});
|
|
62
|
+
BitkitSidebarItem.displayName = "BitkitSidebarItem";
|
|
63
|
+
var BitkitSidebarTitle = forwardRef((props, ref) => {
|
|
64
|
+
const { backHref, backLabel = "Back", children, onBackClick, ...rest } = props;
|
|
65
|
+
const styles = useSlotRecipe({ key: "sidebar" })();
|
|
66
|
+
const controlButtonRecipe = useRecipe({ key: "controlButton" });
|
|
67
|
+
const hasBack = !!backHref || !!onBackClick;
|
|
68
|
+
const BackElement = onBackClick ? chakra.button : chakra.a;
|
|
69
|
+
return /* @__PURE__ */ jsxs(Box, {
|
|
70
|
+
ref,
|
|
71
|
+
css: hasBack ? styles.titleWithBack : styles.title,
|
|
72
|
+
...rest,
|
|
73
|
+
children: [hasBack && /* @__PURE__ */ jsx(BitkitLabelTooltip, {
|
|
74
|
+
text: backLabel,
|
|
75
|
+
children: /* @__PURE__ */ jsx(BackElement, {
|
|
76
|
+
"aria-label": backLabel,
|
|
77
|
+
css: controlButtonRecipe({ size: "sm" }),
|
|
78
|
+
...onBackClick ? {
|
|
79
|
+
onClick: onBackClick,
|
|
80
|
+
type: "button"
|
|
81
|
+
} : { href: backHref },
|
|
82
|
+
children: /* @__PURE__ */ jsx(IconChevronLeft, { size: "24" })
|
|
83
|
+
})
|
|
84
|
+
}), children]
|
|
85
|
+
});
|
|
86
|
+
});
|
|
87
|
+
BitkitSidebarTitle.displayName = "BitkitSidebarTitle";
|
|
88
|
+
var BitkitSidebarFooter = forwardRef((props, ref) => {
|
|
89
|
+
const { children, ...rest } = props;
|
|
90
|
+
return /* @__PURE__ */ jsx(Box, {
|
|
91
|
+
ref,
|
|
92
|
+
css: useSlotRecipe({ key: "sidebar" })().footer,
|
|
93
|
+
...rest,
|
|
94
|
+
children
|
|
95
|
+
});
|
|
96
|
+
});
|
|
97
|
+
BitkitSidebarFooter.displayName = "BitkitSidebarFooter";
|
|
98
|
+
var BitkitSidebarProject = forwardRef((props, ref) => {
|
|
99
|
+
const { label, value, ...rest } = props;
|
|
100
|
+
const styles = useSlotRecipe({ key: "sidebar" })();
|
|
101
|
+
return /* @__PURE__ */ jsxs(Box, {
|
|
102
|
+
ref,
|
|
103
|
+
css: styles.project,
|
|
104
|
+
...rest,
|
|
105
|
+
children: [/* @__PURE__ */ jsx(chakra.span, {
|
|
106
|
+
css: styles.projectLabel,
|
|
107
|
+
children: label
|
|
108
|
+
}), /* @__PURE__ */ jsx(chakra.span, {
|
|
109
|
+
css: styles.projectValue,
|
|
110
|
+
children: value
|
|
111
|
+
})]
|
|
112
|
+
});
|
|
113
|
+
});
|
|
114
|
+
BitkitSidebarProject.displayName = "BitkitSidebarProject";
|
|
115
|
+
var BitkitSidebarGroupHeading = forwardRef((props, ref) => {
|
|
116
|
+
return /* @__PURE__ */ jsx(BitkitGroupHeading, {
|
|
117
|
+
ref,
|
|
118
|
+
paddingBlockEnd: "12",
|
|
119
|
+
paddingBlockStart: "24",
|
|
120
|
+
paddingInline: "32",
|
|
121
|
+
...props
|
|
122
|
+
});
|
|
123
|
+
});
|
|
124
|
+
BitkitSidebarGroupHeading.displayName = "BitkitSidebarGroupHeading";
|
|
125
|
+
var BitkitSidebarDivider = forwardRef((_, ref) => {
|
|
126
|
+
return /* @__PURE__ */ jsx(Separator, {
|
|
127
|
+
ref,
|
|
128
|
+
css: useSlotRecipe({ key: "sidebar" })().divider
|
|
129
|
+
});
|
|
130
|
+
});
|
|
131
|
+
BitkitSidebarDivider.displayName = "BitkitSidebarDivider";
|
|
132
|
+
var BitkitSidebar_default = Object.assign(BitkitSidebar, {
|
|
133
|
+
Divider: BitkitSidebarDivider,
|
|
134
|
+
Footer: BitkitSidebarFooter,
|
|
135
|
+
GroupHeading: BitkitSidebarGroupHeading,
|
|
136
|
+
Item: BitkitSidebarItem,
|
|
137
|
+
Project: BitkitSidebarProject,
|
|
138
|
+
Title: BitkitSidebarTitle
|
|
139
|
+
});
|
|
140
|
+
//#endregion
|
|
141
|
+
export { BitkitSidebar_default as default };
|
|
142
|
+
|
|
143
|
+
//# sourceMappingURL=BitkitSidebar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BitkitSidebar.js","names":[],"sources":["../../../lib/components/BitkitSidebar/BitkitSidebar.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Separator } from '@chakra-ui/react/separator';\nimport { chakra, type HTMLChakraProps, useRecipe, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport IconChevronLeft from '../../icons/IconChevronLeft';\nimport BitkitGroupHeading, { type BitkitGroupHeadingProps } from '../BitkitGroupHeading/BitkitGroupHeading';\nimport BitkitLabelTooltip from '../BitkitLabelTooltip/BitkitLabelTooltip';\n\n// ----- BitkitSidebar (Root) -----\n\nexport interface BitkitSidebarProps extends BoxProps {\n children: ReactNode;\n}\n\nconst BitkitSidebar = forwardRef<HTMLElement, BitkitSidebarProps>((props, ref) => {\n const { children, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return (\n <Box ref={ref} asChild css={styles.root} {...rest}>\n <nav>{children}</nav>\n </Box>\n );\n});\n\nBitkitSidebar.displayName = 'BitkitSidebar';\n\n// ----- BitkitSidebar.Item -----\n\ninterface BitkitSidebarItemCommonProps {\n badge?: ReactNode;\n children: ReactNode;\n icon?: BitkitIconComponent;\n selected?: boolean;\n suffixIcon?: BitkitIconComponent;\n}\n\ninterface BitkitSidebarItemLinkProps extends Omit<HTMLChakraProps<'a'>, 'children'>, BitkitSidebarItemCommonProps {\n href: string;\n}\n\ninterface BitkitSidebarItemButtonProps\n extends Omit<HTMLChakraProps<'button'>, 'children'>, BitkitSidebarItemCommonProps {\n href?: never;\n}\n\nexport type BitkitSidebarItemProps = BitkitSidebarItemButtonProps | BitkitSidebarItemLinkProps;\n\nconst BitkitSidebarItem = forwardRef<HTMLButtonElement & HTMLAnchorElement, BitkitSidebarItemProps>((props, ref) => {\n const { badge, children, icon: Icon, selected, suffixIcon: SuffixIcon, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe({ selected });\n\n const itemContent = (\n <>\n {Icon && <Icon css={styles.itemIcon} size=\"24\" />}\n <chakra.span css={styles.itemLabel}>{children}</chakra.span>\n {badge}\n {SuffixIcon && <SuffixIcon css={styles.suffixIcon} size=\"24\" />}\n <chakra.div css={styles.selectionMarker} />\n </>\n );\n\n if (rest.href !== undefined) {\n const { className, ...linkRest } = rest;\n return (\n <chakra.a\n ref={ref}\n {...linkRest}\n aria-current={selected ? 'page' : undefined}\n className={className ? `group ${className}` : 'group'}\n css={styles.item}\n >\n {itemContent}\n </chakra.a>\n );\n }\n\n const { className, href: _, ...buttonRest } = rest;\n return (\n <chakra.button\n ref={ref}\n {...buttonRest}\n aria-pressed={selected}\n className={className ? `group ${className}` : 'group'}\n css={styles.item}\n type=\"button\"\n >\n {itemContent}\n </chakra.button>\n );\n});\n\nBitkitSidebarItem.displayName = 'BitkitSidebarItem';\n\n// ----- BitkitSidebar.Title -----\n\nexport interface BitkitSidebarTitleProps extends BoxProps {\n backHref?: string;\n backLabel?: string;\n children: ReactNode;\n onBackClick?: () => void;\n}\n\nconst BitkitSidebarTitle = forwardRef<HTMLDivElement, BitkitSidebarTitleProps>((props, ref) => {\n const { backHref, backLabel = 'Back', children, onBackClick, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n const controlButtonRecipe = useRecipe({ key: 'controlButton' });\n\n const hasBack = !!backHref || !!onBackClick;\n\n const BackElement = onBackClick ? chakra.button : chakra.a;\n\n return (\n <Box ref={ref} css={hasBack ? styles.titleWithBack : styles.title} {...rest}>\n {hasBack && (\n <BitkitLabelTooltip text={backLabel}>\n <BackElement\n aria-label={backLabel}\n css={controlButtonRecipe({ size: 'sm' })}\n {...(onBackClick ? { onClick: onBackClick, type: 'button' as const } : { href: backHref })}\n >\n <IconChevronLeft size=\"24\" />\n </BackElement>\n </BitkitLabelTooltip>\n )}\n {children}\n </Box>\n );\n});\n\nBitkitSidebarTitle.displayName = 'BitkitSidebarTitle';\n\n// ----- BitkitSidebar.Footer -----\n\nexport interface BitkitSidebarFooterProps extends BoxProps {\n children: ReactNode;\n}\n\nconst BitkitSidebarFooter = forwardRef<HTMLDivElement, BitkitSidebarFooterProps>((props, ref) => {\n const { children, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return (\n <Box ref={ref} css={styles.footer} {...rest}>\n {children}\n </Box>\n );\n});\n\nBitkitSidebarFooter.displayName = 'BitkitSidebarFooter';\n\n// ----- BitkitSidebar.Project -----\n\nexport interface BitkitSidebarProjectProps extends BoxProps {\n label: string;\n value: string;\n}\n\nconst BitkitSidebarProject = forwardRef<HTMLDivElement, BitkitSidebarProjectProps>((props, ref) => {\n const { label, value, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return (\n <Box ref={ref} css={styles.project} {...rest}>\n <chakra.span css={styles.projectLabel}>{label}</chakra.span>\n <chakra.span css={styles.projectValue}>{value}</chakra.span>\n </Box>\n );\n});\n\nBitkitSidebarProject.displayName = 'BitkitSidebarProject';\n\n// ----- BitkitSidebar.GroupHeading -----\n\nexport type BitkitSidebarGroupHeadingProps = BitkitGroupHeadingProps;\n\nconst BitkitSidebarGroupHeading = forwardRef<HTMLDivElement, BitkitSidebarGroupHeadingProps>((props, ref) => {\n return <BitkitGroupHeading ref={ref} paddingBlockEnd=\"12\" paddingBlockStart=\"24\" paddingInline=\"32\" {...props} />;\n});\n\nBitkitSidebarGroupHeading.displayName = 'BitkitSidebarGroupHeading';\n\n// ----- BitkitSidebar.Divider -----\n\nconst BitkitSidebarDivider = forwardRef<HTMLDivElement>((_, ref) => {\n const recipe = useSlotRecipe({ key: 'sidebar' });\n const styles = recipe();\n\n return <Separator ref={ref} css={styles.divider} />;\n});\n\nBitkitSidebarDivider.displayName = 'BitkitSidebarDivider';\n\nexport default Object.assign(BitkitSidebar, {\n Divider: BitkitSidebarDivider,\n Footer: BitkitSidebarFooter,\n GroupHeading: BitkitSidebarGroupHeading,\n Item: BitkitSidebarItem,\n Project: BitkitSidebarProject,\n Title: BitkitSidebarTitle,\n});\n"],"mappings":";;;;;;;;;AAgBA,IAAM,gBAAgB,YAA6C,OAAO,QAAQ;CAChF,MAAM,EAAE,UAAU,GAAG,SAAS;AAK9B,QACE,oBAAC,KAAD;EAAU;EAAK,SAAA;EAAQ,KAJV,cAAc,EAAE,KAAK,WAAW,CAAC,EACzB,CAGc;EAAM,GAAI;YAC3C,oBAAC,OAAD,EAAM,UAAe,CAAA;EACjB,CAAA;EAER;AAEF,cAAc,cAAc;AAuB5B,IAAM,oBAAoB,YAA2E,OAAO,QAAQ;CAClH,MAAM,EAAE,OAAO,UAAU,MAAM,MAAM,UAAU,YAAY,YAAY,GAAG,SAAS;CAGnF,MAAM,SADS,cAAc,EAAE,KAAK,WAAW,CAAC,CAC1B,EAAE,UAAU,CAAC;CAEnC,MAAM,cACJ,qBAAA,YAAA,EAAA,UAAA;EACG,QAAQ,oBAAC,MAAD;GAAM,KAAK,OAAO;GAAU,MAAK;GAAO,CAAA;EACjD,oBAAC,OAAO,MAAR;GAAa,KAAK,OAAO;GAAY;GAAuB,CAAA;EAC3D;EACA,cAAc,oBAAC,YAAD;GAAY,KAAK,OAAO;GAAY,MAAK;GAAO,CAAA;EAC/D,oBAAC,OAAO,KAAR,EAAY,KAAK,OAAO,iBAAmB,CAAA;EAC1C,EAAA,CAAA;AAGL,KAAI,KAAK,SAAS,KAAA,GAAW;EAC3B,MAAM,EAAE,WAAW,GAAG,aAAa;AACnC,SACE,oBAAC,OAAO,GAAR;GACO;GACL,GAAI;GACJ,gBAAc,WAAW,SAAS,KAAA;GAClC,WAAW,YAAY,SAAS,cAAc;GAC9C,KAAK,OAAO;aAEX;GACQ,CAAA;;CAIf,MAAM,EAAE,WAAW,MAAM,GAAG,GAAG,eAAe;AAC9C,QACE,oBAAC,OAAO,QAAR;EACO;EACL,GAAI;EACJ,gBAAc;EACd,WAAW,YAAY,SAAS,cAAc;EAC9C,KAAK,OAAO;EACZ,MAAK;YAEJ;EACa,CAAA;EAElB;AAEF,kBAAkB,cAAc;AAWhC,IAAM,qBAAqB,YAAqD,OAAO,QAAQ;CAC7F,MAAM,EAAE,UAAU,YAAY,QAAQ,UAAU,aAAa,GAAG,SAAS;CAGzE,MAAM,SADS,cAAc,EAAE,KAAK,WAAW,CAAC,EACzB;CACvB,MAAM,sBAAsB,UAAU,EAAE,KAAK,iBAAiB,CAAC;CAE/D,MAAM,UAAU,CAAC,CAAC,YAAY,CAAC,CAAC;CAEhC,MAAM,cAAc,cAAc,OAAO,SAAS,OAAO;AAEzD,QACE,qBAAC,KAAD;EAAU;EAAK,KAAK,UAAU,OAAO,gBAAgB,OAAO;EAAO,GAAI;YAAvE,CACG,WACC,oBAAC,oBAAD;GAAoB,MAAM;aACxB,oBAAC,aAAD;IACE,cAAY;IACZ,KAAK,oBAAoB,EAAE,MAAM,MAAM,CAAC;IACxC,GAAK,cAAc;KAAE,SAAS;KAAa,MAAM;KAAmB,GAAG,EAAE,MAAM,UAAU;cAEzF,oBAAC,iBAAD,EAAiB,MAAK,MAAO,CAAA;IACjB,CAAA;GACK,CAAA,EAEtB,SACG;;EAER;AAEF,mBAAmB,cAAc;AAQjC,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,GAAG,SAAS;AAK9B,QACE,oBAAC,KAAD;EAAU;EAAK,KAJF,cAAc,EAAE,KAAK,WAAW,CAAC,EACzB,CAGM;EAAQ,GAAI;EACpC;EACG,CAAA;EAER;AAEF,oBAAoB,cAAc;AASlC,IAAM,uBAAuB,YAAuD,OAAO,QAAQ;CACjG,MAAM,EAAE,OAAO,OAAO,GAAG,SAAS;CAGlC,MAAM,SADS,cAAc,EAAE,KAAK,WAAW,CAAC,EACzB;AAEvB,QACE,qBAAC,KAAD;EAAU;EAAK,KAAK,OAAO;EAAS,GAAI;YAAxC,CACE,oBAAC,OAAO,MAAR;GAAa,KAAK,OAAO;aAAe;GAAoB,CAAA,EAC5D,oBAAC,OAAO,MAAR;GAAa,KAAK,OAAO;aAAe;GAAoB,CAAA,CACxD;;EAER;AAEF,qBAAqB,cAAc;AAMnC,IAAM,4BAA4B,YAA4D,OAAO,QAAQ;AAC3G,QAAO,oBAAC,oBAAD;EAAyB;EAAK,iBAAgB;EAAK,mBAAkB;EAAK,eAAc;EAAK,GAAI;EAAS,CAAA;EACjH;AAEF,0BAA0B,cAAc;AAIxC,IAAM,uBAAuB,YAA4B,GAAG,QAAQ;AAIlE,QAAO,oBAAC,WAAD;EAAgB;EAAK,KAHb,cAAc,EAAE,KAAK,WAAW,CAAC,EACzB,CAEiB;EAAW,CAAA;EACnD;AAEF,qBAAqB,cAAc;AAEnC,IAAA,wBAAe,OAAO,OAAO,eAAe;CAC1C,SAAS;CACT,QAAQ;CACR,cAAc;CACd,MAAM;CACN,SAAS;CACT,OAAO;CACR,CAAC"}
|
|
@@ -1,5 +1,11 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
1
2
|
export type BitkitStepsItemState = 'disabled' | 'invalid' | 'skippable';
|
|
2
|
-
export
|
|
3
|
+
export interface BitkitStepsProps {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
orientation?: 'horizontal' | 'vertical';
|
|
6
|
+
step?: number;
|
|
7
|
+
}
|
|
8
|
+
export interface BitkitStepsItemProps {
|
|
3
9
|
action?: {
|
|
4
10
|
href?: string;
|
|
5
11
|
isExternal?: boolean;
|
|
@@ -8,11 +14,8 @@ export type BitkitStepsItem = {
|
|
|
8
14
|
helperText?: string;
|
|
9
15
|
label: string;
|
|
10
16
|
state?: BitkitStepsItemState;
|
|
11
|
-
};
|
|
12
|
-
export interface BitkitStepsProps {
|
|
13
|
-
items: BitkitStepsItem[];
|
|
14
|
-
orientation?: 'horizontal' | 'vertical';
|
|
15
|
-
step: number;
|
|
16
17
|
}
|
|
17
|
-
declare const
|
|
18
|
-
|
|
18
|
+
declare const _default: import('react').ForwardRefExoticComponent<BitkitStepsProps & import('react').RefAttributes<HTMLDivElement>> & {
|
|
19
|
+
Item: import('react').ForwardRefExoticComponent<BitkitStepsItemProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
20
|
+
};
|
|
21
|
+
export default _default;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import IconCheck from "../../icons/IconCheck.js";
|
|
2
2
|
import IconSkip from "../../icons/IconSkip.js";
|
|
3
|
+
import { useStepCardContext } from "../BitkitStepsCard/StepCardContext.js";
|
|
3
4
|
import { Box } from "@chakra-ui/react/box";
|
|
4
|
-
import {
|
|
5
|
-
import { createElement, forwardRef } from "react";
|
|
5
|
+
import { Children, cloneElement, forwardRef, isValidElement } from "react";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
import { Link } from "@chakra-ui/react/link";
|
|
8
|
-
import { Steps } from "@chakra-ui/react/steps";
|
|
8
|
+
import { Steps, useStepsContext, useStepsStyles } from "@chakra-ui/react/steps";
|
|
9
9
|
//#region lib/components/BitkitSteps/BitkitSteps.tsx
|
|
10
10
|
var getEffectiveStatus = (itemState, index, step) => {
|
|
11
11
|
if (itemState === "disabled") return "disabled";
|
|
@@ -40,40 +40,58 @@ var renderLabel = (label, action) => {
|
|
|
40
40
|
});
|
|
41
41
|
};
|
|
42
42
|
var BitkitSteps = forwardRef((props, ref) => {
|
|
43
|
-
const {
|
|
44
|
-
const
|
|
43
|
+
const { children, orientation = "horizontal", step: stepProp } = props;
|
|
44
|
+
const stepCardCtx = useStepCardContext();
|
|
45
|
+
const step = stepProp ?? stepCardCtx?.step ?? 0;
|
|
46
|
+
const count = Children.count(children);
|
|
45
47
|
return /* @__PURE__ */ jsx(Steps.Root, {
|
|
46
48
|
ref,
|
|
47
|
-
count
|
|
49
|
+
count,
|
|
48
50
|
linear: false,
|
|
49
51
|
orientation,
|
|
50
52
|
step,
|
|
51
|
-
children: /* @__PURE__ */ jsx(Steps.List, { children:
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
53
|
+
children: /* @__PURE__ */ jsx(Steps.List, { children: Children.map(children, (child, index) => {
|
|
54
|
+
if (isValidElement(child)) return cloneElement(child, {
|
|
55
|
+
_index: index,
|
|
56
|
+
_orientation: orientation
|
|
57
|
+
});
|
|
58
|
+
return child;
|
|
59
|
+
}) })
|
|
60
|
+
});
|
|
61
|
+
});
|
|
62
|
+
BitkitSteps.displayName = "BitkitSteps";
|
|
63
|
+
var BitkitStepsItem = forwardRef((props, ref) => {
|
|
64
|
+
const { _index = 0, _orientation = "horizontal", action, helperText, label, state } = props;
|
|
65
|
+
const styles = useStepsStyles();
|
|
66
|
+
const status = getEffectiveStatus(state, _index, useStepsContext().value);
|
|
67
|
+
const resolvedAction = state !== "disabled" ? action : void 0;
|
|
68
|
+
const statusAttr = { "data-step-status": status };
|
|
69
|
+
return /* @__PURE__ */ jsxs(Steps.Item, {
|
|
70
|
+
...statusAttr,
|
|
71
|
+
index: _index,
|
|
72
|
+
ref,
|
|
73
|
+
children: [
|
|
74
|
+
/* @__PURE__ */ jsx(Steps.Indicator, {
|
|
60
75
|
...statusAttr,
|
|
61
|
-
children: renderIndicatorContent(
|
|
62
|
-
}),
|
|
76
|
+
children: renderIndicatorContent(_index, status)
|
|
77
|
+
}),
|
|
78
|
+
/* @__PURE__ */ jsxs(Box, {
|
|
63
79
|
css: styles.trigger,
|
|
64
80
|
children: [/* @__PURE__ */ jsx(Steps.Title, {
|
|
65
81
|
...statusAttr,
|
|
66
|
-
children: renderLabel(
|
|
67
|
-
}),
|
|
82
|
+
children: renderLabel(label, resolvedAction)
|
|
83
|
+
}), _orientation === "vertical" && helperText && /* @__PURE__ */ jsx(Steps.Description, {
|
|
68
84
|
...statusAttr,
|
|
69
|
-
children:
|
|
85
|
+
children: helperText
|
|
70
86
|
})]
|
|
71
|
-
}),
|
|
72
|
-
|
|
87
|
+
}),
|
|
88
|
+
/* @__PURE__ */ jsx(Steps.Separator, {})
|
|
89
|
+
]
|
|
73
90
|
});
|
|
74
91
|
});
|
|
75
|
-
|
|
92
|
+
BitkitStepsItem.displayName = "BitkitStepsItem";
|
|
93
|
+
var BitkitSteps_default = Object.assign(BitkitSteps, { Item: BitkitStepsItem });
|
|
76
94
|
//#endregion
|
|
77
|
-
export {
|
|
95
|
+
export { BitkitSteps_default as default };
|
|
78
96
|
|
|
79
97
|
//# sourceMappingURL=BitkitSteps.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitSteps.js","names":[],"sources":["../../../lib/components/BitkitSteps/BitkitSteps.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Link } from '@chakra-ui/react/link';\nimport { Steps } from '@chakra-ui/react/steps';\nimport {
|
|
1
|
+
{"version":3,"file":"BitkitSteps.js","names":[],"sources":["../../../lib/components/BitkitSteps/BitkitSteps.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Link } from '@chakra-ui/react/link';\nimport { Steps, useStepsContext, useStepsStyles } from '@chakra-ui/react/steps';\nimport { Children, cloneElement, forwardRef, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport IconCheck from '../../icons/IconCheck';\nimport IconSkip from '../../icons/IconSkip';\nimport { useStepCardContext } from '../BitkitStepsCard/StepCardContext';\n\nexport type BitkitStepsItemState = 'disabled' | 'invalid' | 'skippable';\n\ntype EffectiveStatus = 'completed' | 'disabled' | 'inProgress' | 'invalid' | 'notStarted' | 'skippable' | 'skipped';\n\nconst getEffectiveStatus = (\n itemState: BitkitStepsItemState | undefined,\n index: number,\n step: number,\n): EffectiveStatus => {\n if (itemState === 'disabled') return 'disabled';\n if (itemState === 'invalid') return 'invalid';\n if (itemState === 'skippable') return index < step ? 'skipped' : 'skippable';\n if (index < step) return 'completed';\n if (index === step) return 'inProgress';\n return 'notStarted';\n};\n\nconst renderIndicatorContent = (index: number, status: EffectiveStatus) => {\n if (status === 'completed') return <IconCheck size=\"16\" />;\n if (status === 'skippable' || status === 'skipped') return <IconSkip size=\"16\" />;\n if (status === 'invalid') return '!';\n return index + 1;\n};\n\nconst renderLabel = (label: string, action: BitkitStepsItemProps['action']) => {\n if (!action) return label;\n\n if (action.href) {\n return (\n <Link\n colorScheme=\"purple\"\n href={action.href}\n onClick={action.onClick}\n rel={action.isExternal ? 'noopener noreferrer' : undefined}\n target={action.isExternal ? '_blank' : undefined}\n >\n {label}\n </Link>\n );\n }\n\n return (\n <Link as=\"button\" colorScheme=\"purple\" onClick={action.onClick} type=\"button\">\n {label}\n </Link>\n );\n};\n\nexport interface BitkitStepsProps {\n children: ReactNode;\n orientation?: 'horizontal' | 'vertical';\n step?: number;\n}\n\nconst BitkitSteps = forwardRef<HTMLDivElement, BitkitStepsProps>((props, ref) => {\n const { children, orientation = 'horizontal', step: stepProp } = props;\n const stepCardCtx = useStepCardContext();\n const step = stepProp ?? stepCardCtx?.step ?? 0;\n const count = Children.count(children);\n\n return (\n <Steps.Root ref={ref} count={count} linear={false} orientation={orientation} step={step}>\n <Steps.List>\n {Children.map(children, (child, index) => {\n if (isValidElement(child)) {\n return cloneElement(child as ReactElement<BitkitStepsItemInternalProps>, {\n _index: index,\n _orientation: orientation,\n });\n }\n return child;\n })}\n </Steps.List>\n </Steps.Root>\n );\n});\n\nBitkitSteps.displayName = 'BitkitSteps';\n\nexport interface BitkitStepsItemProps {\n action?: {\n href?: string;\n isExternal?: boolean;\n onClick?: () => void;\n };\n helperText?: string;\n label: string;\n state?: BitkitStepsItemState;\n}\n\ninterface BitkitStepsItemInternalProps extends BitkitStepsItemProps {\n _index?: number;\n _orientation?: 'horizontal' | 'vertical';\n}\n\nconst BitkitStepsItem = forwardRef<HTMLDivElement, BitkitStepsItemProps>((props, ref) => {\n const {\n _index = 0,\n _orientation = 'horizontal',\n action,\n helperText,\n label,\n state,\n } = props as BitkitStepsItemInternalProps;\n\n const styles = useStepsStyles();\n const stepsCtx = useStepsContext();\n const status = getEffectiveStatus(state, _index, stepsCtx.value);\n const resolvedAction = state !== 'disabled' ? action : undefined;\n const statusAttr = { 'data-step-status': status };\n\n return (\n <Steps.Item {...statusAttr} index={_index} ref={ref}>\n <Steps.Indicator {...statusAttr}>{renderIndicatorContent(_index, status)}</Steps.Indicator>\n <Box css={styles.trigger}>\n <Steps.Title {...statusAttr}>{renderLabel(label, resolvedAction)}</Steps.Title>\n {_orientation === 'vertical' && helperText && (\n <Steps.Description {...statusAttr}>{helperText}</Steps.Description>\n )}\n </Box>\n <Steps.Separator />\n </Steps.Item>\n );\n});\n\nBitkitStepsItem.displayName = 'BitkitStepsItem';\n\nexport default Object.assign(BitkitSteps, { Item: BitkitStepsItem });\n"],"mappings":";;;;;;;;;AAaA,IAAM,sBACJ,WACA,OACA,SACoB;AACpB,KAAI,cAAc,WAAY,QAAO;AACrC,KAAI,cAAc,UAAW,QAAO;AACpC,KAAI,cAAc,YAAa,QAAO,QAAQ,OAAO,YAAY;AACjE,KAAI,QAAQ,KAAM,QAAO;AACzB,KAAI,UAAU,KAAM,QAAO;AAC3B,QAAO;;AAGT,IAAM,0BAA0B,OAAe,WAA4B;AACzE,KAAI,WAAW,YAAa,QAAO,oBAAC,WAAD,EAAW,MAAK,MAAO,CAAA;AAC1D,KAAI,WAAW,eAAe,WAAW,UAAW,QAAO,oBAAC,UAAD,EAAU,MAAK,MAAO,CAAA;AACjF,KAAI,WAAW,UAAW,QAAO;AACjC,QAAO,QAAQ;;AAGjB,IAAM,eAAe,OAAe,WAA2C;AAC7E,KAAI,CAAC,OAAQ,QAAO;AAEpB,KAAI,OAAO,KACT,QACE,oBAAC,MAAD;EACE,aAAY;EACZ,MAAM,OAAO;EACb,SAAS,OAAO;EAChB,KAAK,OAAO,aAAa,wBAAwB,KAAA;EACjD,QAAQ,OAAO,aAAa,WAAW,KAAA;YAEtC;EACI,CAAA;AAIX,QACE,oBAAC,MAAD;EAAM,IAAG;EAAS,aAAY;EAAS,SAAS,OAAO;EAAS,MAAK;YAClE;EACI,CAAA;;AAUX,IAAM,cAAc,YAA8C,OAAO,QAAQ;CAC/E,MAAM,EAAE,UAAU,cAAc,cAAc,MAAM,aAAa;CACjE,MAAM,cAAc,oBAAoB;CACxC,MAAM,OAAO,YAAY,aAAa,QAAQ;CAC9C,MAAM,QAAQ,SAAS,MAAM,SAAS;AAEtC,QACE,oBAAC,MAAM,MAAP;EAAiB;EAAY;EAAO,QAAQ;EAAoB;EAAmB;YACjF,oBAAC,MAAM,MAAP,EAAA,UACG,SAAS,IAAI,WAAW,OAAO,UAAU;AACxC,OAAI,eAAe,MAAM,CACvB,QAAO,aAAa,OAAqD;IACvE,QAAQ;IACR,cAAc;IACf,CAAC;AAEJ,UAAO;IACP,EACS,CAAA;EACF,CAAA;EAEf;AAEF,YAAY,cAAc;AAkB1B,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EACJ,SAAS,GACT,eAAe,cACf,QACA,YACA,OACA,UACE;CAEJ,MAAM,SAAS,gBAAgB;CAE/B,MAAM,SAAS,mBAAmB,OAAO,QADxB,iBAAiB,CACwB,MAAM;CAChE,MAAM,iBAAiB,UAAU,aAAa,SAAS,KAAA;CACvD,MAAM,aAAa,EAAE,oBAAoB,QAAQ;AAEjD,QACE,qBAAC,MAAM,MAAP;EAAY,GAAI;EAAY,OAAO;EAAa;YAAhD;GACE,oBAAC,MAAM,WAAP;IAAiB,GAAI;cAAa,uBAAuB,QAAQ,OAAO;IAAmB,CAAA;GAC3F,qBAAC,KAAD;IAAK,KAAK,OAAO;cAAjB,CACE,oBAAC,MAAM,OAAP;KAAa,GAAI;eAAa,YAAY,OAAO,eAAe;KAAe,CAAA,EAC9E,iBAAiB,cAAc,cAC9B,oBAAC,MAAM,aAAP;KAAmB,GAAI;eAAa;KAA+B,CAAA,CAEjE;;GACN,oBAAC,MAAM,WAAP,EAAmB,CAAA;GACR;;EAEf;AAEF,gBAAgB,cAAc;AAE9B,IAAA,sBAAe,OAAO,OAAO,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { CardBodyProps, CardFooterProps, CardHeaderProps, CardRootProps } from '@chakra-ui/react/card';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
export interface BitkitStepsCardProps extends Omit<CardRootProps, 'children' | 'title'> {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
step: number;
|
|
6
|
+
}
|
|
7
|
+
export interface BitkitStepsCardHeaderProps extends Omit<CardHeaderProps, 'children'> {
|
|
8
|
+
children: ReactNode;
|
|
9
|
+
}
|
|
10
|
+
export interface BitkitStepsCardBodyProps extends Omit<CardBodyProps, 'children'> {
|
|
11
|
+
children: ReactNode;
|
|
12
|
+
}
|
|
13
|
+
export interface BitkitStepsCardStepProps {
|
|
14
|
+
children?: ReactNode;
|
|
15
|
+
description?: string;
|
|
16
|
+
title: string;
|
|
17
|
+
}
|
|
18
|
+
export interface BitkitStepsCardFooterProps extends Omit<CardFooterProps, 'children'> {
|
|
19
|
+
children: ReactNode;
|
|
20
|
+
}
|
|
21
|
+
declare const _default: import('react').ForwardRefExoticComponent<BitkitStepsCardProps & import('react').RefAttributes<HTMLDivElement>> & {
|
|
22
|
+
Body: import('react').ForwardRefExoticComponent<BitkitStepsCardBodyProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
23
|
+
Footer: import('react').ForwardRefExoticComponent<BitkitStepsCardFooterProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
24
|
+
Header: import('react').ForwardRefExoticComponent<BitkitStepsCardHeaderProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
25
|
+
Step: {
|
|
26
|
+
(props: BitkitStepsCardStepProps): import("react/jsx-runtime").JSX.Element | null;
|
|
27
|
+
displayName: string;
|
|
28
|
+
};
|
|
29
|
+
};
|
|
30
|
+
export default _default;
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import { StepCardProvider, useStepCardContext } from "./StepCardContext.js";
|
|
2
|
+
import { chakra, useSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
3
|
+
import { Children, cloneElement, forwardRef, isValidElement } from "react";
|
|
4
|
+
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
5
|
+
import { Card } from "@chakra-ui/react/card";
|
|
6
|
+
//#region lib/components/BitkitStepsCard/BitkitStepsCard.tsx
|
|
7
|
+
var useStepsCardStyles = () => {
|
|
8
|
+
return useSlotRecipe({ key: "stepsCard" })();
|
|
9
|
+
};
|
|
10
|
+
var BitkitStepsCard = forwardRef((props, ref) => {
|
|
11
|
+
const { children, step, ...rest } = props;
|
|
12
|
+
const styles = useStepsCardStyles();
|
|
13
|
+
return /* @__PURE__ */ jsx(StepCardProvider, {
|
|
14
|
+
value: { step },
|
|
15
|
+
children: /* @__PURE__ */ jsx(Card.Root, {
|
|
16
|
+
ref,
|
|
17
|
+
css: styles.root,
|
|
18
|
+
unstyled: true,
|
|
19
|
+
...rest,
|
|
20
|
+
children
|
|
21
|
+
})
|
|
22
|
+
});
|
|
23
|
+
});
|
|
24
|
+
BitkitStepsCard.displayName = "BitkitStepsCard";
|
|
25
|
+
var BitkitStepsCardHeader = forwardRef((props, ref) => {
|
|
26
|
+
const { children, ...rest } = props;
|
|
27
|
+
const styles = useStepsCardStyles();
|
|
28
|
+
return /* @__PURE__ */ jsx(Card.Header, {
|
|
29
|
+
ref,
|
|
30
|
+
css: styles.header,
|
|
31
|
+
...rest,
|
|
32
|
+
children
|
|
33
|
+
});
|
|
34
|
+
});
|
|
35
|
+
BitkitStepsCardHeader.displayName = "BitkitStepsCardHeader";
|
|
36
|
+
var BitkitStepsCardBody = forwardRef((props, ref) => {
|
|
37
|
+
const { children, ...rest } = props;
|
|
38
|
+
const styles = useStepsCardStyles();
|
|
39
|
+
return /* @__PURE__ */ jsx(Card.Body, {
|
|
40
|
+
ref,
|
|
41
|
+
css: styles.body,
|
|
42
|
+
...rest,
|
|
43
|
+
children: Children.map(children, (child, index) => {
|
|
44
|
+
if (isValidElement(child)) return cloneElement(child, { _index: index });
|
|
45
|
+
return child;
|
|
46
|
+
})
|
|
47
|
+
});
|
|
48
|
+
});
|
|
49
|
+
BitkitStepsCardBody.displayName = "BitkitStepsCardBody";
|
|
50
|
+
var BitkitStepsCardStep = (props) => {
|
|
51
|
+
const { _index = 0, children, description, title } = props;
|
|
52
|
+
const { step } = useStepCardContext() ?? { step: 0 };
|
|
53
|
+
const styles = useStepsCardStyles();
|
|
54
|
+
if (_index !== step) return null;
|
|
55
|
+
return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs(chakra.div, {
|
|
56
|
+
css: styles.titleGroup,
|
|
57
|
+
children: [/* @__PURE__ */ jsx(Card.Title, {
|
|
58
|
+
css: styles.title,
|
|
59
|
+
children: title
|
|
60
|
+
}), description && /* @__PURE__ */ jsx(Card.Description, {
|
|
61
|
+
css: styles.description,
|
|
62
|
+
children: description
|
|
63
|
+
})]
|
|
64
|
+
}), children] });
|
|
65
|
+
};
|
|
66
|
+
BitkitStepsCardStep.displayName = "BitkitStepsCardStep";
|
|
67
|
+
var BitkitStepsCardFooter = forwardRef((props, ref) => {
|
|
68
|
+
const { children, ...rest } = props;
|
|
69
|
+
const styles = useStepsCardStyles();
|
|
70
|
+
return /* @__PURE__ */ jsx(Card.Footer, {
|
|
71
|
+
ref,
|
|
72
|
+
css: styles.footer,
|
|
73
|
+
...rest,
|
|
74
|
+
children
|
|
75
|
+
});
|
|
76
|
+
});
|
|
77
|
+
BitkitStepsCardFooter.displayName = "BitkitStepsCardFooter";
|
|
78
|
+
var BitkitStepsCard_default = Object.assign(BitkitStepsCard, {
|
|
79
|
+
Body: BitkitStepsCardBody,
|
|
80
|
+
Footer: BitkitStepsCardFooter,
|
|
81
|
+
Header: BitkitStepsCardHeader,
|
|
82
|
+
Step: BitkitStepsCardStep
|
|
83
|
+
});
|
|
84
|
+
//#endregion
|
|
85
|
+
export { BitkitStepsCard_default as default };
|
|
86
|
+
|
|
87
|
+
//# sourceMappingURL=BitkitStepsCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BitkitStepsCard.js","names":[],"sources":["../../../lib/components/BitkitStepsCard/BitkitStepsCard.tsx"],"sourcesContent":["import {\n Card,\n type CardBodyProps,\n type CardFooterProps,\n type CardHeaderProps,\n type CardRootProps,\n} from '@chakra-ui/react/card';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Children, cloneElement, forwardRef, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport { StepCardProvider, useStepCardContext } from './StepCardContext';\n\nconst useStepsCardStyles = () => {\n const recipe = useSlotRecipe({ key: 'stepsCard' });\n return recipe();\n};\n\nexport interface BitkitStepsCardProps extends Omit<CardRootProps, 'children' | 'title'> {\n children: ReactNode;\n step: number;\n}\n\nconst BitkitStepsCard = forwardRef<HTMLDivElement, BitkitStepsCardProps>((props, ref) => {\n const { children, step, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <StepCardProvider value={{ step }}>\n <Card.Root ref={ref} css={styles.root} unstyled {...rest}>\n {children}\n </Card.Root>\n </StepCardProvider>\n );\n});\n\nBitkitStepsCard.displayName = 'BitkitStepsCard';\n\nexport interface BitkitStepsCardHeaderProps extends Omit<CardHeaderProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitStepsCardHeader = forwardRef<HTMLDivElement, BitkitStepsCardHeaderProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <Card.Header ref={ref} css={styles.header} {...rest}>\n {children}\n </Card.Header>\n );\n});\n\nBitkitStepsCardHeader.displayName = 'BitkitStepsCardHeader';\n\nexport interface BitkitStepsCardBodyProps extends Omit<CardBodyProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitStepsCardBody = forwardRef<HTMLDivElement, BitkitStepsCardBodyProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <Card.Body ref={ref} css={styles.body} {...rest}>\n {Children.map(children, (child, index) => {\n if (isValidElement(child)) {\n return cloneElement(child as ReactElement<{ _index?: number }>, { _index: index });\n }\n return child;\n })}\n </Card.Body>\n );\n});\n\nBitkitStepsCardBody.displayName = 'BitkitStepsCardBody';\n\nexport interface BitkitStepsCardStepProps {\n children?: ReactNode;\n description?: string;\n title: string;\n}\n\ninterface BitkitStepsCardStepInternalProps extends BitkitStepsCardStepProps {\n _index?: number;\n}\n\nconst BitkitStepsCardStep = (props: BitkitStepsCardStepProps) => {\n const { _index = 0, children, description, title } = props as BitkitStepsCardStepInternalProps;\n const { step } = useStepCardContext() ?? { step: 0 };\n const styles = useStepsCardStyles();\n\n if (_index !== step) return null;\n\n return (\n <>\n <chakra.div css={styles.titleGroup}>\n <Card.Title css={styles.title}>{title}</Card.Title>\n {description && <Card.Description css={styles.description}>{description}</Card.Description>}\n </chakra.div>\n {children}\n </>\n );\n};\n\nBitkitStepsCardStep.displayName = 'BitkitStepsCardStep';\n\nexport interface BitkitStepsCardFooterProps extends Omit<CardFooterProps, 'children'> {\n children: ReactNode;\n}\n\nconst BitkitStepsCardFooter = forwardRef<HTMLDivElement, BitkitStepsCardFooterProps>((props, ref) => {\n const { children, ...rest } = props;\n const styles = useStepsCardStyles();\n\n return (\n <Card.Footer ref={ref} css={styles.footer} {...rest}>\n {children}\n </Card.Footer>\n );\n});\n\nBitkitStepsCardFooter.displayName = 'BitkitStepsCardFooter';\n\nexport default Object.assign(BitkitStepsCard, {\n Body: BitkitStepsCardBody,\n Footer: BitkitStepsCardFooter,\n Header: BitkitStepsCardHeader,\n Step: BitkitStepsCardStep,\n});\n"],"mappings":";;;;;;AAYA,IAAM,2BAA2B;AAE/B,QADe,cAAc,EAAE,KAAK,aAAa,CAAC,EACnC;;AAQjB,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EAAE,UAAU,MAAM,GAAG,SAAS;CACpC,MAAM,SAAS,oBAAoB;AAEnC,QACE,oBAAC,kBAAD;EAAkB,OAAO,EAAE,MAAM;YAC/B,oBAAC,KAAK,MAAN;GAAgB;GAAK,KAAK,OAAO;GAAM,UAAA;GAAS,GAAI;GACjD;GACS,CAAA;EACK,CAAA;EAErB;AAEF,gBAAgB,cAAc;AAM9B,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,oBAAoB;AAEnC,QACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;EAC5C;EACW,CAAA;EAEhB;AAEF,sBAAsB,cAAc;AAMpC,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,oBAAoB;AAEnC,QACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,OAAO;EAAM,GAAI;YACxC,SAAS,IAAI,WAAW,OAAO,UAAU;AACxC,OAAI,eAAe,MAAM,CACvB,QAAO,aAAa,OAA4C,EAAE,QAAQ,OAAO,CAAC;AAEpF,UAAO;IACP;EACQ,CAAA;EAEd;AAEF,oBAAoB,cAAc;AAYlC,IAAM,uBAAuB,UAAoC;CAC/D,MAAM,EAAE,SAAS,GAAG,UAAU,aAAa,UAAU;CACrD,MAAM,EAAE,SAAS,oBAAoB,IAAI,EAAE,MAAM,GAAG;CACpD,MAAM,SAAS,oBAAoB;AAEnC,KAAI,WAAW,KAAM,QAAO;AAE5B,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,qBAAC,OAAO,KAAR;EAAY,KAAK,OAAO;YAAxB,CACE,oBAAC,KAAK,OAAN;GAAY,KAAK,OAAO;aAAQ;GAAmB,CAAA,EAClD,eAAe,oBAAC,KAAK,aAAN;GAAkB,KAAK,OAAO;aAAc;GAA+B,CAAA,CAChF;KACZ,SACA,EAAA,CAAA;;AAIP,oBAAoB,cAAc;AAMlC,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,oBAAoB;AAEnC,QACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;EAC5C;EACW,CAAA;EAEhB;AAEF,sBAAsB,cAAc;AAEpC,IAAA,0BAAe,OAAO,OAAO,iBAAiB;CAC5C,MAAM;CACN,QAAQ;CACR,QAAQ;CACR,MAAM;CACP,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { createContext } from "@chakra-ui/react";
|
|
2
|
+
//#region lib/components/BitkitStepsCard/StepCardContext.ts
|
|
3
|
+
var [StepCardProvider, useStepCardContext] = createContext({
|
|
4
|
+
name: "StepCardContext",
|
|
5
|
+
strict: false
|
|
6
|
+
});
|
|
7
|
+
//#endregion
|
|
8
|
+
export { StepCardProvider, useStepCardContext };
|
|
9
|
+
|
|
10
|
+
//# sourceMappingURL=StepCardContext.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StepCardContext.js","names":[],"sources":["../../../lib/components/BitkitStepsCard/StepCardContext.ts"],"sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { createContext } from '@chakra-ui/react';\n\ninterface StepCardContextValue {\n step: number;\n}\n\nconst [StepCardProvider, useStepCardContext] = createContext<StepCardContextValue>({\n name: 'StepCardContext',\n strict: false,\n});\n\nexport { StepCardProvider, useStepCardContext };\n"],"mappings":";;AAOA,IAAM,CAAC,kBAAkB,sBAAsB,cAAoC;CACjF,MAAM;CACN,QAAQ;CACT,CAAC"}
|
|
@@ -50,9 +50,11 @@ export { default as BitkitSegmentedControl, type BitkitSegmentedControlItemProps
|
|
|
50
50
|
export { default as BitkitSelect, type BitkitSelectProps } from './BitkitSelect/BitkitSelect';
|
|
51
51
|
export { default as BitkitSelectableTag, type BitkitSelectableTagItemProps, type BitkitSelectableTagProps, } from './BitkitSelectableTag/BitkitSelectableTag';
|
|
52
52
|
export { default as BitkitSelectMenu, type BitkitSelectMenuProps } from './BitkitSelectMenu/BitkitSelectMenu';
|
|
53
|
+
export { default as BitkitSidebar, type BitkitSidebarFooterProps, type BitkitSidebarGroupHeadingProps, type BitkitSidebarItemProps, type BitkitSidebarProjectProps, type BitkitSidebarProps, type BitkitSidebarTitleProps, } from './BitkitSidebar/BitkitSidebar';
|
|
53
54
|
export { default as BitkitSplitButton, type BitkitSplitButtonProps } from './BitkitSplitButton/BitkitSplitButton';
|
|
54
55
|
export { default as BitkitStat, type BitkitStatProps, type TrendColor, type TrendDirection, type TrendTextPlacement, } from './BitkitStat/BitkitStat';
|
|
55
|
-
export { default as BitkitSteps, type
|
|
56
|
+
export { default as BitkitSteps, type BitkitStepsItemProps, type BitkitStepsItemState, type BitkitStepsProps, } from './BitkitSteps/BitkitSteps';
|
|
57
|
+
export { default as BitkitStepsCard, type BitkitStepsCardBodyProps, type BitkitStepsCardFooterProps, type BitkitStepsCardHeaderProps, type BitkitStepsCardProps, type BitkitStepsCardStepProps, } from './BitkitStepsCard/BitkitStepsCard';
|
|
56
58
|
export { default as BitkitTabs } from './BitkitTabs/BitkitTabs';
|
|
57
59
|
export { default as BitkitTag, type BitkitTagProps } from './BitkitTag/BitkitTag';
|
|
58
60
|
export { default as BitkitTagsInput, type BitkitTagsInputProps } from './BitkitTagsInput/BitkitTagsInput';
|
package/dist/main.js
CHANGED
|
@@ -333,9 +333,11 @@ import BitkitSectionHeading from "./components/BitkitSectionHeading/BitkitSectio
|
|
|
333
333
|
import BitkitSegmentedControl_default from "./components/BitkitSegmentedControl/BitkitSegmentedControl.js";
|
|
334
334
|
import BitkitSelect from "./components/BitkitSelect/BitkitSelect.js";
|
|
335
335
|
import BitkitSelectableTag_default from "./components/BitkitSelectableTag/BitkitSelectableTag.js";
|
|
336
|
+
import BitkitSidebar_default from "./components/BitkitSidebar/BitkitSidebar.js";
|
|
336
337
|
import BitkitSplitButton_default from "./components/BitkitSplitButton/BitkitSplitButton.js";
|
|
337
338
|
import BitkitStat from "./components/BitkitStat/BitkitStat.js";
|
|
338
|
-
import
|
|
339
|
+
import BitkitSteps_default from "./components/BitkitSteps/BitkitSteps.js";
|
|
340
|
+
import BitkitStepsCard_default from "./components/BitkitStepsCard/BitkitStepsCard.js";
|
|
339
341
|
import BitkitTabs from "./components/BitkitTabs/BitkitTabs.js";
|
|
340
342
|
import BitkitTag from "./components/BitkitTag/BitkitTag.js";
|
|
341
343
|
import BitkitTagsInput from "./components/BitkitTagsInput/BitkitTagsInput.js";
|
|
@@ -345,4 +347,4 @@ import BitkitToggle from "./components/BitkitToggle/BitkitToggle.js";
|
|
|
345
347
|
import BitkitToggleButton from "./components/BitkitToggleButton/BitkitToggleButton.js";
|
|
346
348
|
import bitkitTheme from "./theme/index.js";
|
|
347
349
|
import Provider from "./providers/BitkitProvider.js";
|
|
348
|
-
export { BitkitAccordion, BitkitActionBar, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitButton, BitkitCalendar, BitkitCard, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox, BitkitControlButton, BitkitDefinitionTooltip, BitkitDialog, BitkitDialogBody, BitkitDialogContent, BitkitDialogRoot, BitkitDraggableCard, BitkitEmptyState, BitkitExpandableCard, BitkitExplainerList_default as BitkitExplainerList, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, 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, BitkitStat, BitkitSteps, 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, IconDragHandle, 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, IconSkip, 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 };
|
|
350
|
+
export { BitkitAccordion, BitkitActionBar, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitButton, BitkitCalendar, BitkitCard, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox, BitkitControlButton, BitkitDefinitionTooltip, BitkitDialog, BitkitDialogBody, BitkitDialogContent, BitkitDialogRoot, BitkitDraggableCard, BitkitEmptyState, BitkitExpandableCard, BitkitExplainerList_default as BitkitExplainerList, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, 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, BitkitSidebar_default as BitkitSidebar, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, 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, IconDragHandle, 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, IconSkip, 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,22 @@
|
|
|
1
|
+
declare const sidebarSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"footer" | "title" | "root" | "item" | "suffixIcon" | "divider" | "itemIcon" | "itemLabel" | "project" | "projectLabel" | "projectValue" | "selectionMarker" | "titleWithBack", {
|
|
2
|
+
selected: {
|
|
3
|
+
true: {
|
|
4
|
+
item: {
|
|
5
|
+
background: "background/selected";
|
|
6
|
+
_hover: {
|
|
7
|
+
background: "background/selected-hover";
|
|
8
|
+
};
|
|
9
|
+
};
|
|
10
|
+
itemIcon: {
|
|
11
|
+
color: "icon/interactive";
|
|
12
|
+
};
|
|
13
|
+
itemLabel: {
|
|
14
|
+
textStyle: "body/lg/semibold";
|
|
15
|
+
};
|
|
16
|
+
selectionMarker: {
|
|
17
|
+
display: "block";
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
};
|
|
21
|
+
}>;
|
|
22
|
+
export default sidebarSlotRecipe;
|
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
import { rem } from "../themeUtils.js";
|
|
2
|
+
import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
3
|
+
//#region lib/theme/slot-recipes/Sidebar.recipe.ts
|
|
4
|
+
var sidebarSlotRecipe = defineSlotRecipe({
|
|
5
|
+
className: "sidebar",
|
|
6
|
+
slots: [
|
|
7
|
+
"divider",
|
|
8
|
+
"suffixIcon",
|
|
9
|
+
"footer",
|
|
10
|
+
"item",
|
|
11
|
+
"itemIcon",
|
|
12
|
+
"itemLabel",
|
|
13
|
+
"project",
|
|
14
|
+
"projectLabel",
|
|
15
|
+
"projectValue",
|
|
16
|
+
"root",
|
|
17
|
+
"selectionMarker",
|
|
18
|
+
"title",
|
|
19
|
+
"titleWithBack"
|
|
20
|
+
],
|
|
21
|
+
base: {
|
|
22
|
+
root: {
|
|
23
|
+
background: "background/primary",
|
|
24
|
+
borderInlineEnd: "1px solid",
|
|
25
|
+
borderColor: "border/regular",
|
|
26
|
+
display: "flex",
|
|
27
|
+
flexDirection: "column",
|
|
28
|
+
width: rem(256),
|
|
29
|
+
height: "100dvh"
|
|
30
|
+
},
|
|
31
|
+
item: {
|
|
32
|
+
alignItems: "center",
|
|
33
|
+
cursor: "pointer",
|
|
34
|
+
display: "flex",
|
|
35
|
+
gap: "16",
|
|
36
|
+
overflow: "clip",
|
|
37
|
+
paddingBlock: "12",
|
|
38
|
+
paddingInlineEnd: "24",
|
|
39
|
+
paddingInlineStart: "32",
|
|
40
|
+
position: "relative",
|
|
41
|
+
width: "full",
|
|
42
|
+
_hover: { background: "background/hover" }
|
|
43
|
+
},
|
|
44
|
+
itemIcon: {
|
|
45
|
+
color: "icon/secondary",
|
|
46
|
+
flexShrink: 0
|
|
47
|
+
},
|
|
48
|
+
itemLabel: {
|
|
49
|
+
color: "text/primary",
|
|
50
|
+
flex: 1,
|
|
51
|
+
minWidth: 0,
|
|
52
|
+
overflow: "hidden",
|
|
53
|
+
textAlign: "start",
|
|
54
|
+
textOverflow: "ellipsis",
|
|
55
|
+
textStyle: "body/lg/regular",
|
|
56
|
+
whiteSpace: "nowrap"
|
|
57
|
+
},
|
|
58
|
+
suffixIcon: {
|
|
59
|
+
color: "icon/tertiary",
|
|
60
|
+
display: "none",
|
|
61
|
+
flexShrink: 0,
|
|
62
|
+
_groupHover: { display: "block" }
|
|
63
|
+
},
|
|
64
|
+
selectionMarker: {
|
|
65
|
+
background: "border/selected",
|
|
66
|
+
borderStartEndRadius: "2",
|
|
67
|
+
borderEndEndRadius: "2",
|
|
68
|
+
display: "none",
|
|
69
|
+
height: "full",
|
|
70
|
+
insetBlockStart: 0,
|
|
71
|
+
insetInlineEnd: 0,
|
|
72
|
+
position: "absolute",
|
|
73
|
+
width: "2"
|
|
74
|
+
},
|
|
75
|
+
footer: {
|
|
76
|
+
borderBlockStart: "1px solid",
|
|
77
|
+
borderColor: "border/regular",
|
|
78
|
+
display: "flex",
|
|
79
|
+
flexDirection: "column",
|
|
80
|
+
marginBlockStart: "auto",
|
|
81
|
+
paddingBlock: "12"
|
|
82
|
+
},
|
|
83
|
+
project: {
|
|
84
|
+
display: "flex",
|
|
85
|
+
flexDirection: "column",
|
|
86
|
+
gap: "4",
|
|
87
|
+
justifyContent: "center",
|
|
88
|
+
overflow: "clip",
|
|
89
|
+
paddingBlockEnd: "12",
|
|
90
|
+
paddingBlockStart: "8",
|
|
91
|
+
paddingInlineEnd: "24",
|
|
92
|
+
paddingInlineStart: "32",
|
|
93
|
+
whiteSpace: "nowrap"
|
|
94
|
+
},
|
|
95
|
+
projectLabel: {
|
|
96
|
+
color: "text/tertiary",
|
|
97
|
+
textStyle: "heading/h6"
|
|
98
|
+
},
|
|
99
|
+
projectValue: {
|
|
100
|
+
color: "text/body",
|
|
101
|
+
textStyle: "body/lg/semibold"
|
|
102
|
+
},
|
|
103
|
+
title: {
|
|
104
|
+
alignItems: "center",
|
|
105
|
+
color: "text/primary",
|
|
106
|
+
display: "flex",
|
|
107
|
+
gap: "12",
|
|
108
|
+
paddingBlock: "16",
|
|
109
|
+
paddingInlineEnd: "8",
|
|
110
|
+
paddingInlineStart: "32",
|
|
111
|
+
textStyle: "heading/h3"
|
|
112
|
+
},
|
|
113
|
+
titleWithBack: {
|
|
114
|
+
alignItems: "center",
|
|
115
|
+
color: "text/primary",
|
|
116
|
+
display: "flex",
|
|
117
|
+
gap: "12",
|
|
118
|
+
paddingBlockEnd: "16",
|
|
119
|
+
paddingBlockStart: "24",
|
|
120
|
+
paddingInlineEnd: "8",
|
|
121
|
+
paddingInlineStart: "24",
|
|
122
|
+
textStyle: "heading/h3"
|
|
123
|
+
},
|
|
124
|
+
divider: {
|
|
125
|
+
marginInline: "32",
|
|
126
|
+
marginBlock: "24",
|
|
127
|
+
width: "auto"
|
|
128
|
+
}
|
|
129
|
+
},
|
|
130
|
+
variants: { selected: { true: {
|
|
131
|
+
item: {
|
|
132
|
+
background: "background/selected",
|
|
133
|
+
_hover: { background: "background/selected-hover" }
|
|
134
|
+
},
|
|
135
|
+
itemIcon: { color: "icon/interactive" },
|
|
136
|
+
itemLabel: { textStyle: "body/lg/semibold" },
|
|
137
|
+
selectionMarker: { display: "block" }
|
|
138
|
+
} } }
|
|
139
|
+
});
|
|
140
|
+
//#endregion
|
|
141
|
+
export { sidebarSlotRecipe as default };
|
|
142
|
+
|
|
143
|
+
//# sourceMappingURL=Sidebar.recipe.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Sidebar.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Sidebar.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst sidebarSlotRecipe = defineSlotRecipe({\n className: 'sidebar',\n slots: [\n 'divider',\n 'suffixIcon',\n 'footer',\n 'item',\n 'itemIcon',\n 'itemLabel',\n 'project',\n 'projectLabel',\n 'projectValue',\n 'root',\n 'selectionMarker',\n 'title',\n 'titleWithBack',\n ],\n base: {\n root: {\n background: 'background/primary',\n borderInlineEnd: '1px solid',\n borderColor: 'border/regular',\n display: 'flex',\n flexDirection: 'column',\n width: rem(256),\n height: '100dvh',\n },\n item: {\n alignItems: 'center',\n cursor: 'pointer',\n display: 'flex',\n gap: '16',\n overflow: 'clip',\n paddingBlock: '12',\n paddingInlineEnd: '24',\n paddingInlineStart: '32',\n position: 'relative',\n width: 'full',\n _hover: {\n background: 'background/hover',\n },\n },\n itemIcon: {\n color: 'icon/secondary',\n flexShrink: 0,\n },\n itemLabel: {\n color: 'text/primary',\n flex: 1,\n minWidth: 0,\n overflow: 'hidden',\n textAlign: 'start',\n textOverflow: 'ellipsis',\n textStyle: 'body/lg/regular',\n whiteSpace: 'nowrap',\n },\n suffixIcon: {\n color: 'icon/tertiary',\n display: 'none',\n flexShrink: 0,\n _groupHover: {\n display: 'block',\n },\n },\n selectionMarker: {\n background: 'border/selected',\n borderStartEndRadius: '2',\n borderEndEndRadius: '2',\n display: 'none',\n height: 'full',\n insetBlockStart: 0,\n insetInlineEnd: 0,\n position: 'absolute',\n width: '2',\n },\n footer: {\n borderBlockStart: '1px solid',\n borderColor: 'border/regular',\n display: 'flex',\n flexDirection: 'column',\n marginBlockStart: 'auto',\n paddingBlock: '12',\n },\n project: {\n display: 'flex',\n flexDirection: 'column',\n gap: '4',\n justifyContent: 'center',\n overflow: 'clip',\n paddingBlockEnd: '12',\n paddingBlockStart: '8',\n paddingInlineEnd: '24',\n paddingInlineStart: '32',\n whiteSpace: 'nowrap',\n },\n projectLabel: {\n color: 'text/tertiary',\n textStyle: 'heading/h6',\n },\n projectValue: {\n color: 'text/body',\n textStyle: 'body/lg/semibold',\n },\n title: {\n alignItems: 'center',\n color: 'text/primary',\n display: 'flex',\n gap: '12',\n paddingBlock: '16',\n paddingInlineEnd: '8',\n paddingInlineStart: '32',\n textStyle: 'heading/h3',\n },\n titleWithBack: {\n alignItems: 'center',\n color: 'text/primary',\n display: 'flex',\n gap: '12',\n paddingBlockEnd: '16',\n paddingBlockStart: '24',\n paddingInlineEnd: '8',\n paddingInlineStart: '24',\n textStyle: 'heading/h3',\n },\n divider: {\n marginInline: '32',\n marginBlock: '24',\n width: 'auto',\n },\n },\n variants: {\n selected: {\n true: {\n item: {\n background: 'background/selected',\n _hover: {\n background: 'background/selected-hover',\n },\n },\n itemIcon: {\n color: 'icon/interactive',\n },\n itemLabel: {\n textStyle: 'body/lg/semibold',\n },\n selectionMarker: {\n display: 'block',\n },\n },\n },\n },\n});\n\nexport default sidebarSlotRecipe;\n"],"mappings":";;;AAIA,IAAM,oBAAoB,iBAAiB;CACzC,WAAW;CACX,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,iBAAiB;GACjB,aAAa;GACb,SAAS;GACT,eAAe;GACf,OAAO,IAAI,IAAI;GACf,QAAQ;GACT;EACD,MAAM;GACJ,YAAY;GACZ,QAAQ;GACR,SAAS;GACT,KAAK;GACL,UAAU;GACV,cAAc;GACd,kBAAkB;GAClB,oBAAoB;GACpB,UAAU;GACV,OAAO;GACP,QAAQ,EACN,YAAY,oBACb;GACF;EACD,UAAU;GACR,OAAO;GACP,YAAY;GACb;EACD,WAAW;GACT,OAAO;GACP,MAAM;GACN,UAAU;GACV,UAAU;GACV,WAAW;GACX,cAAc;GACd,WAAW;GACX,YAAY;GACb;EACD,YAAY;GACV,OAAO;GACP,SAAS;GACT,YAAY;GACZ,aAAa,EACX,SAAS,SACV;GACF;EACD,iBAAiB;GACf,YAAY;GACZ,sBAAsB;GACtB,oBAAoB;GACpB,SAAS;GACT,QAAQ;GACR,iBAAiB;GACjB,gBAAgB;GAChB,UAAU;GACV,OAAO;GACR;EACD,QAAQ;GACN,kBAAkB;GAClB,aAAa;GACb,SAAS;GACT,eAAe;GACf,kBAAkB;GAClB,cAAc;GACf;EACD,SAAS;GACP,SAAS;GACT,eAAe;GACf,KAAK;GACL,gBAAgB;GAChB,UAAU;GACV,iBAAiB;GACjB,mBAAmB;GACnB,kBAAkB;GAClB,oBAAoB;GACpB,YAAY;GACb;EACD,cAAc;GACZ,OAAO;GACP,WAAW;GACZ;EACD,cAAc;GACZ,OAAO;GACP,WAAW;GACZ;EACD,OAAO;GACL,YAAY;GACZ,OAAO;GACP,SAAS;GACT,KAAK;GACL,cAAc;GACd,kBAAkB;GAClB,oBAAoB;GACpB,WAAW;GACZ;EACD,eAAe;GACb,YAAY;GACZ,OAAO;GACP,SAAS;GACT,KAAK;GACL,iBAAiB;GACjB,mBAAmB;GACnB,kBAAkB;GAClB,oBAAoB;GACpB,WAAW;GACZ;EACD,SAAS;GACP,cAAc;GACd,aAAa;GACb,OAAO;GACR;EACF;CACD,UAAU,EACR,UAAU,EACR,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,QAAQ,EACN,YAAY,6BACb;GACF;EACD,UAAU,EACR,OAAO,oBACR;EACD,WAAW,EACT,WAAW,oBACZ;EACD,iBAAiB,EACf,SAAS,SACV;EACF,EACF,EACF;CACF,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
declare const stepCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "root" | "description" | "titleGroup", import('@chakra-ui/react').SlotRecipeVariantRecord<"body" | "footer" | "header" | "title" | "root" | "description" | "titleGroup">>;
|
|
2
|
+
export default stepCardSlotRecipe;
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
2
|
+
import { cardAnatomy } from "@chakra-ui/react/anatomy";
|
|
3
|
+
//#region lib/theme/slot-recipes/StepCard.recipe.ts
|
|
4
|
+
var stepCardSlotRecipe = defineSlotRecipe({
|
|
5
|
+
className: "steps-card",
|
|
6
|
+
slots: cardAnatomy.extendWith("titleGroup").keys(),
|
|
7
|
+
base: {
|
|
8
|
+
root: {
|
|
9
|
+
backgroundColor: "background/primary",
|
|
10
|
+
border: "1px solid",
|
|
11
|
+
borderColor: "border/minimal",
|
|
12
|
+
borderRadius: "8",
|
|
13
|
+
boxShadow: "elevation/md",
|
|
14
|
+
overflow: "hidden"
|
|
15
|
+
},
|
|
16
|
+
header: {
|
|
17
|
+
paddingBlockStart: "32",
|
|
18
|
+
paddingInline: "32"
|
|
19
|
+
},
|
|
20
|
+
body: {
|
|
21
|
+
display: "flex",
|
|
22
|
+
flexDirection: "column",
|
|
23
|
+
gap: "24",
|
|
24
|
+
paddingBlockEnd: "48",
|
|
25
|
+
paddingBlockStart: "32",
|
|
26
|
+
paddingInline: "32"
|
|
27
|
+
},
|
|
28
|
+
titleGroup: {
|
|
29
|
+
display: "flex",
|
|
30
|
+
flexDirection: "column",
|
|
31
|
+
gap: "4"
|
|
32
|
+
},
|
|
33
|
+
title: {
|
|
34
|
+
color: "text/primary",
|
|
35
|
+
textStyle: "heading/h3"
|
|
36
|
+
},
|
|
37
|
+
description: {
|
|
38
|
+
color: "text/secondary",
|
|
39
|
+
textStyle: "body/md/regular"
|
|
40
|
+
},
|
|
41
|
+
footer: {
|
|
42
|
+
alignItems: "center",
|
|
43
|
+
borderBlockStart: "1px solid",
|
|
44
|
+
borderColor: "border/minimal",
|
|
45
|
+
display: "flex",
|
|
46
|
+
gap: "16",
|
|
47
|
+
justifyContent: "flex-end",
|
|
48
|
+
padding: "32"
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
});
|
|
52
|
+
//#endregion
|
|
53
|
+
export { stepCardSlotRecipe as default };
|
|
54
|
+
|
|
55
|
+
//# sourceMappingURL=StepCard.recipe.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StepCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/StepCard.recipe.ts"],"sourcesContent":["import { cardAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst stepsCardAnatomy = cardAnatomy.extendWith('titleGroup');\n\nconst stepCardSlotRecipe = defineSlotRecipe({\n className: 'steps-card',\n slots: stepsCardAnatomy.keys(),\n base: {\n root: {\n backgroundColor: 'background/primary',\n border: '1px solid',\n borderColor: 'border/minimal',\n borderRadius: '8',\n boxShadow: 'elevation/md',\n overflow: 'hidden',\n },\n header: {\n paddingBlockStart: '32',\n paddingInline: '32',\n },\n body: {\n display: 'flex',\n flexDirection: 'column',\n gap: '24',\n paddingBlockEnd: '48',\n paddingBlockStart: '32',\n paddingInline: '32',\n },\n titleGroup: {\n display: 'flex',\n flexDirection: 'column',\n gap: '4',\n },\n title: {\n color: 'text/primary',\n textStyle: 'heading/h3',\n },\n description: {\n color: 'text/secondary',\n textStyle: 'body/md/regular',\n },\n footer: {\n alignItems: 'center',\n borderBlockStart: '1px solid',\n borderColor: 'border/minimal',\n display: 'flex',\n gap: '16',\n justifyContent: 'flex-end',\n padding: '32',\n },\n },\n});\n\nexport default stepCardSlotRecipe;\n"],"mappings":";;;AAKA,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAJuB,YAAY,WAAW,aAAa,CAInC,MAAM;CAC9B,MAAM;EACJ,MAAM;GACJ,iBAAiB;GACjB,QAAQ;GACR,aAAa;GACb,cAAc;GACd,WAAW;GACX,UAAU;GACX;EACD,QAAQ;GACN,mBAAmB;GACnB,eAAe;GAChB;EACD,MAAM;GACJ,SAAS;GACT,eAAe;GACf,KAAK;GACL,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;GAChB;EACD,YAAY;GACV,SAAS;GACT,eAAe;GACf,KAAK;GACN;EACD,OAAO;GACL,OAAO;GACP,WAAW;GACZ;EACD,aAAa;GACX,OAAO;GACP,WAAW;GACZ;EACD,QAAQ;GACN,YAAY;GACZ,kBAAkB;GAClB,aAAa;GACb,SAAS;GACT,KAAK;GACL,gBAAgB;GAChB,SAAS;GACV;EACF;CACF,CAAC"}
|
|
@@ -1090,6 +1090,27 @@ declare const slotRecipes: {
|
|
|
1090
1090
|
};
|
|
1091
1091
|
};
|
|
1092
1092
|
}>;
|
|
1093
|
+
sidebar: import('@chakra-ui/react').SlotRecipeDefinition<"footer" | "title" | "root" | "item" | "suffixIcon" | "divider" | "itemIcon" | "itemLabel" | "project" | "projectLabel" | "projectValue" | "selectionMarker" | "titleWithBack", {
|
|
1094
|
+
selected: {
|
|
1095
|
+
true: {
|
|
1096
|
+
item: {
|
|
1097
|
+
background: "background/selected";
|
|
1098
|
+
_hover: {
|
|
1099
|
+
background: "background/selected-hover";
|
|
1100
|
+
};
|
|
1101
|
+
};
|
|
1102
|
+
itemIcon: {
|
|
1103
|
+
color: "icon/interactive";
|
|
1104
|
+
};
|
|
1105
|
+
itemLabel: {
|
|
1106
|
+
textStyle: "body/lg/semibold";
|
|
1107
|
+
};
|
|
1108
|
+
selectionMarker: {
|
|
1109
|
+
display: "block";
|
|
1110
|
+
};
|
|
1111
|
+
};
|
|
1112
|
+
};
|
|
1113
|
+
}>;
|
|
1093
1114
|
select: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "label" | "list" | "root" | "item" | "itemIndicator" | "trigger" | "positioner" | "indicator" | "clearTrigger" | "control" | "valueText" | "itemText" | "itemGroup" | "itemGroupLabel" | "indicatorGroup" | "searchInputGroup" | "searchInput" | "createItemContainer" | "createItem", {
|
|
1094
1115
|
size: {
|
|
1095
1116
|
lg: Record<string, import('@chakra-ui/react').SystemStyleObject>;
|
|
@@ -1189,6 +1210,7 @@ declare const slotRecipes: {
|
|
|
1189
1210
|
};
|
|
1190
1211
|
};
|
|
1191
1212
|
}>;
|
|
1213
|
+
stepsCard: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "root" | "description" | "titleGroup", import('@chakra-ui/react').SlotRecipeVariantRecord<"body" | "footer" | "header" | "title" | "root" | "description" | "titleGroup">>;
|
|
1192
1214
|
steps: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "progress" | "title" | "separator" | "list" | "root" | "item" | "trigger" | "description" | "indicator" | "nextTrigger" | "prevTrigger", {
|
|
1193
1215
|
orientation: {
|
|
1194
1216
|
horizontal: {
|
|
@@ -34,8 +34,10 @@ import radioGroupSlotRecipe from "./RadioGroup.recipe.js";
|
|
|
34
34
|
import ribbonSlotRecipe from "./Ribbon.recipe.js";
|
|
35
35
|
import sectionHeadingRecipe from "./SectionHeading.recipe.js";
|
|
36
36
|
import segmentGroupSlotRecipe from "./SegmentGroup.recipe.js";
|
|
37
|
+
import sidebarSlotRecipe from "./Sidebar.recipe.js";
|
|
37
38
|
import splitButtonSlotRecipe from "./SplitButton.recipe.js";
|
|
38
39
|
import statSlotRecipe from "./Stat.recipe.js";
|
|
40
|
+
import stepCardSlotRecipe from "./StepCard.recipe.js";
|
|
39
41
|
import stepsSlotRecipe from "./Steps.recipe.js";
|
|
40
42
|
import switchSlotRecipe from "./Switch.recipe.js";
|
|
41
43
|
import tableSlotRecipe from "./Table.recipe.js";
|
|
@@ -81,9 +83,11 @@ var slotRecipes = {
|
|
|
81
83
|
sectionHeading: sectionHeadingRecipe,
|
|
82
84
|
labeledData: labeledDataSlotRecipe,
|
|
83
85
|
segmentGroup: segmentGroupSlotRecipe,
|
|
86
|
+
sidebar: sidebarSlotRecipe,
|
|
84
87
|
select: selectSlotRecipe,
|
|
85
88
|
splitButton: splitButtonSlotRecipe,
|
|
86
89
|
stat: statSlotRecipe,
|
|
90
|
+
stepsCard: stepCardSlotRecipe,
|
|
87
91
|
steps: stepsSlotRecipe,
|
|
88
92
|
switch: switchSlotRecipe,
|
|
89
93
|
table: tableSlotRecipe,
|
|
@@ -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 draggableCardSlotRecipe from './DraggableCard.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 labeledDataSlotRecipe from './LabeledData.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 statSlotRecipe from './Stat.recipe.ts';\nimport stepsSlotRecipe from './Steps.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 draggableCard: draggableCardSlotRecipe,\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 labeledData: labeledDataSlotRecipe,\n segmentGroup: segmentGroupSlotRecipe,\n select: selectSlotRecipe,\n splitButton: splitButtonSlotRecipe,\n stat: statSlotRecipe,\n steps: stepsSlotRecipe,\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 draggableCardSlotRecipe from './DraggableCard.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 labeledDataSlotRecipe from './LabeledData.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 sidebarSlotRecipe from './Sidebar.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.recipe.ts';\nimport stepCardSlotRecipe from './StepCard.recipe.ts';\nimport stepsSlotRecipe from './Steps.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 draggableCard: draggableCardSlotRecipe,\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 labeledData: labeledDataSlotRecipe,\n segmentGroup: segmentGroupSlotRecipe,\n sidebar: sidebarSlotRecipe,\n select: selectSlotRecipe,\n splitButton: splitButtonSlotRecipe,\n stat: statSlotRecipe,\n stepsCard: stepCardSlotRecipe,\n steps: stepsSlotRecipe,\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDA,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,eAAe;CACf,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,aAAa;CACb,cAAc;CACd,SAAS;CACT,QAAQ;CACR,aAAa;CACb,MAAM;CACN,WAAW;CACX,OAAO;CACP,QAAQ;CACR,OAAO;CACP,MAAM;CACN,KAAK;CACL,WAAW;CACX,OAAO;CACP,SAAS;CACV"}
|