@bitrise/bitkit-v2 0.3.263 → 0.3.265
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/BitkitPopover/BitkitPopover.d.ts +31 -0
- package/dist/components/BitkitPopover/BitkitPopover.js +92 -0
- package/dist/components/BitkitPopover/BitkitPopover.js.map +1 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/main.js +2 -1
- package/dist/theme/common/InputAndTextarea.common.d.ts +1 -1
- package/dist/theme/common/InputAndTextarea.common.js +1 -1
- package/dist/theme/common/InputAndTextarea.common.js.map +1 -1
- package/dist/theme/recipes/Button.recipe.js +1 -1
- package/dist/theme/recipes/Button.recipe.js.map +1 -1
- package/dist/theme/recipes/Spinner.recipe.js +1 -2
- package/dist/theme/recipes/Spinner.recipe.js.map +1 -1
- package/dist/theme/recipes/ToggleButton.recipe.js +1 -1
- package/dist/theme/recipes/ToggleButton.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Dialog.recipe.js +1 -1
- package/dist/theme/slot-recipes/Dialog.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Drawer.recipe.js +1 -1
- package/dist/theme/slot-recipes/Drawer.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/FileUpload.recipe.js +1 -1
- package/dist/theme/slot-recipes/FileUpload.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/ImageCropper.recipe.js +5 -5
- package/dist/theme/slot-recipes/ImageCropper.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Multiselect.recipe.js +1 -1
- package/dist/theme/slot-recipes/Multiselect.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/NativeSelect.recipe.js +1 -1
- package/dist/theme/slot-recipes/NativeSelect.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Pagination.recipe.d.ts +1 -1
- package/dist/theme/slot-recipes/Pagination.recipe.js +1 -1
- package/dist/theme/slot-recipes/Pagination.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/PaginationLoadMore.recipe.js +1 -1
- package/dist/theme/slot-recipes/PaginationLoadMore.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Popover.recipe.d.ts +2 -0
- package/dist/theme/slot-recipes/Popover.recipe.js +107 -0
- package/dist/theme/slot-recipes/Popover.recipe.js.map +1 -0
- package/dist/theme/slot-recipes/Ribbon.recipe.js +1 -1
- package/dist/theme/slot-recipes/Ribbon.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/SegmentGroup.recipe.js +1 -1
- package/dist/theme/slot-recipes/SegmentGroup.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Select.recipe.js +2 -2
- package/dist/theme/slot-recipes/Select.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/SplitButton.recipe.d.ts +1 -1
- package/dist/theme/slot-recipes/SplitButton.recipe.js +1 -2
- package/dist/theme/slot-recipes/SplitButton.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Steps.recipe.d.ts +2 -2
- package/dist/theme/slot-recipes/Steps.recipe.js +3 -3
- package/dist/theme/slot-recipes/Steps.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Table.recipe.d.ts +5 -5
- package/dist/theme/slot-recipes/Table.recipe.js +6 -6
- package/dist/theme/slot-recipes/Table.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/TagsInput.recipe.js +2 -2
- package/dist/theme/slot-recipes/TagsInput.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Tooltip.recipe.js +2 -2
- package/dist/theme/slot-recipes/Tooltip.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/index.d.ts +10 -9
- package/dist/theme/slot-recipes/index.js +2 -0
- package/dist/theme/slot-recipes/index.js.map +1 -1
- package/dist/theme/tokens/border-widths.d.ts +9 -0
- package/dist/theme/tokens/border-widths.js +10 -0
- package/dist/theme/tokens/border-widths.js.map +1 -0
- package/dist/theme/tokens/index.d.ts +8 -0
- package/dist/theme/tokens/index.js +2 -0
- package/dist/theme/tokens/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { PopoverRootProps } from '@chakra-ui/react/popover';
|
|
2
|
+
import { ReactNode } from 'react';
|
|
3
|
+
export interface BitkitPopoverProps {
|
|
4
|
+
/** Body content of the panel. Scrolls within the panel when it overflows. */
|
|
5
|
+
children: ReactNode;
|
|
6
|
+
/** Header title, shown next to the close button. */
|
|
7
|
+
title: ReactNode;
|
|
8
|
+
/** Optional footer content (e.g. actions). Laid out with space between for a secondary/primary pair. */
|
|
9
|
+
footer?: ReactNode;
|
|
10
|
+
/**
|
|
11
|
+
* Element that toggles and anchors the popover. Omit when anchoring via
|
|
12
|
+
* `positioning.getAnchorElement` (e.g. a trigger that can't be wrapped) and controlling `open`.
|
|
13
|
+
*/
|
|
14
|
+
trigger?: ReactNode;
|
|
15
|
+
open?: PopoverRootProps['open'];
|
|
16
|
+
defaultOpen?: PopoverRootProps['defaultOpen'];
|
|
17
|
+
onOpenChange?: (open: boolean) => void;
|
|
18
|
+
positioning?: PopoverRootProps['positioning'];
|
|
19
|
+
persistentElements?: PopoverRootProps['persistentElements'];
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* An anchored, non-modal floating panel built on Chakra Popover, styled as a compact dialog:
|
|
23
|
+
* a header (title + close button), a scrollable body, and an optional footer. Anchor it with a
|
|
24
|
+
* `trigger`, or — when the trigger can't be wrapped — control `open` and pass
|
|
25
|
+
* `positioning.getAnchorElement`.
|
|
26
|
+
*/
|
|
27
|
+
declare const BitkitPopover: {
|
|
28
|
+
({ children, title, footer, trigger, open, defaultOpen, onOpenChange, positioning, persistentElements, }: BitkitPopoverProps): import("react").JSX.Element;
|
|
29
|
+
displayName: string;
|
|
30
|
+
};
|
|
31
|
+
export default BitkitPopover;
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
import IconArrowDown from "../../icons/IconArrowDown.js";
|
|
2
|
+
import BitkitCloseButton from "../BitkitCloseButton/BitkitCloseButton.js";
|
|
3
|
+
import { Box } from "@chakra-ui/react/box";
|
|
4
|
+
import { chakra } from "@chakra-ui/react/styled-system";
|
|
5
|
+
import { useCallback, useEffect, useRef, useState } from "react";
|
|
6
|
+
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
+
import { Portal } from "@chakra-ui/react/portal";
|
|
8
|
+
import { Popover, usePopoverContext, usePopoverStyles } from "@chakra-ui/react/popover";
|
|
9
|
+
//#region lib/components/BitkitPopover/BitkitPopover.tsx
|
|
10
|
+
/**
|
|
11
|
+
* Scrolls the body and shows a scroll-to-bottom button with a fade gradient while the content
|
|
12
|
+
* isn't scrolled to the bottom — mirrors the BitkitDialog scrollable-body behaviour.
|
|
13
|
+
*/
|
|
14
|
+
var ScrollablePopoverBody = ({ children }) => {
|
|
15
|
+
const styles = usePopoverStyles();
|
|
16
|
+
const { open } = usePopoverContext();
|
|
17
|
+
const contentRef = useRef(null);
|
|
18
|
+
const [isScrollButtonVisible, setIsScrollButtonVisible] = useState(false);
|
|
19
|
+
const updateScrollButtonVisibility = useCallback(() => {
|
|
20
|
+
const content = contentRef.current;
|
|
21
|
+
if (!content) {
|
|
22
|
+
setIsScrollButtonVisible(false);
|
|
23
|
+
return;
|
|
24
|
+
}
|
|
25
|
+
setIsScrollButtonVisible(!(content.scrollTop >= content.scrollHeight - content.offsetHeight - 1));
|
|
26
|
+
}, []);
|
|
27
|
+
useEffect(() => {
|
|
28
|
+
const content = contentRef.current;
|
|
29
|
+
if (!open || !content) return void 0;
|
|
30
|
+
content.addEventListener("scroll", updateScrollButtonVisibility);
|
|
31
|
+
const resizeObserver = new ResizeObserver(updateScrollButtonVisibility);
|
|
32
|
+
resizeObserver.observe(content);
|
|
33
|
+
return () => {
|
|
34
|
+
content.removeEventListener("scroll", updateScrollButtonVisibility);
|
|
35
|
+
resizeObserver.disconnect();
|
|
36
|
+
};
|
|
37
|
+
}, [open, updateScrollButtonVisibility]);
|
|
38
|
+
return /* @__PURE__ */ jsxs(Box, {
|
|
39
|
+
css: styles.scrollBody,
|
|
40
|
+
children: [/* @__PURE__ */ jsx(Popover.Body, {
|
|
41
|
+
ref: contentRef,
|
|
42
|
+
children
|
|
43
|
+
}), isScrollButtonVisible && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Box, { css: styles.scrollGradient }), /* @__PURE__ */ jsx(chakra.button, {
|
|
44
|
+
"aria-label": "Scroll to bottom",
|
|
45
|
+
css: styles.scrollButton,
|
|
46
|
+
type: "button",
|
|
47
|
+
onClick: () => {
|
|
48
|
+
contentRef.current?.scrollTo({
|
|
49
|
+
top: contentRef.current.scrollHeight,
|
|
50
|
+
behavior: "smooth"
|
|
51
|
+
});
|
|
52
|
+
},
|
|
53
|
+
children: /* @__PURE__ */ jsx(IconArrowDown, {
|
|
54
|
+
color: "icon/tertiary",
|
|
55
|
+
size: "16"
|
|
56
|
+
})
|
|
57
|
+
})] })]
|
|
58
|
+
});
|
|
59
|
+
};
|
|
60
|
+
/**
|
|
61
|
+
* An anchored, non-modal floating panel built on Chakra Popover, styled as a compact dialog:
|
|
62
|
+
* a header (title + close button), a scrollable body, and an optional footer. Anchor it with a
|
|
63
|
+
* `trigger`, or — when the trigger can't be wrapped — control `open` and pass
|
|
64
|
+
* `positioning.getAnchorElement`.
|
|
65
|
+
*/
|
|
66
|
+
var BitkitPopover = ({ children, title, footer, trigger, open, defaultOpen, onOpenChange, positioning, persistentElements }) => /* @__PURE__ */ jsxs(Popover.Root, {
|
|
67
|
+
open,
|
|
68
|
+
defaultOpen,
|
|
69
|
+
onOpenChange: onOpenChange ? ({ open: isOpen }) => onOpenChange(isOpen) : void 0,
|
|
70
|
+
positioning: {
|
|
71
|
+
placement: "bottom-start",
|
|
72
|
+
gutter: 4,
|
|
73
|
+
...positioning
|
|
74
|
+
},
|
|
75
|
+
persistentElements,
|
|
76
|
+
children: [trigger ? /* @__PURE__ */ jsx(Popover.Trigger, {
|
|
77
|
+
asChild: true,
|
|
78
|
+
children: trigger
|
|
79
|
+
}) : null, /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Popover.Positioner, { children: /* @__PURE__ */ jsxs(Popover.Content, { children: [
|
|
80
|
+
/* @__PURE__ */ jsxs(Popover.Header, { children: [/* @__PURE__ */ jsx(Popover.Title, { children: title }), /* @__PURE__ */ jsx(Popover.CloseTrigger, {
|
|
81
|
+
asChild: true,
|
|
82
|
+
children: /* @__PURE__ */ jsx(BitkitCloseButton, { "aria-label": "Close" })
|
|
83
|
+
})] }),
|
|
84
|
+
/* @__PURE__ */ jsx(ScrollablePopoverBody, { children }),
|
|
85
|
+
footer ? /* @__PURE__ */ jsx(Popover.Footer, { children: footer }) : null
|
|
86
|
+
] }) }) })]
|
|
87
|
+
});
|
|
88
|
+
BitkitPopover.displayName = "BitkitPopover";
|
|
89
|
+
//#endregion
|
|
90
|
+
export { BitkitPopover as default };
|
|
91
|
+
|
|
92
|
+
//# sourceMappingURL=BitkitPopover.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BitkitPopover.js","names":[],"sources":["../../../lib/components/BitkitPopover/BitkitPopover.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Popover, type PopoverRootProps, usePopoverContext, usePopoverStyles } from '@chakra-ui/react/popover';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { type ReactNode, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { IconArrowDown } from '../../icons';\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\n\nexport interface BitkitPopoverProps {\n /** Body content of the panel. Scrolls within the panel when it overflows. */\n children: ReactNode;\n /** Header title, shown next to the close button. */\n title: ReactNode;\n /** Optional footer content (e.g. actions). Laid out with space between for a secondary/primary pair. */\n footer?: ReactNode;\n /**\n * Element that toggles and anchors the popover. Omit when anchoring via\n * `positioning.getAnchorElement` (e.g. a trigger that can't be wrapped) and controlling `open`.\n */\n trigger?: ReactNode;\n open?: PopoverRootProps['open'];\n defaultOpen?: PopoverRootProps['defaultOpen'];\n onOpenChange?: (open: boolean) => void;\n positioning?: PopoverRootProps['positioning'];\n persistentElements?: PopoverRootProps['persistentElements'];\n}\n\n/**\n * Scrolls the body and shows a scroll-to-bottom button with a fade gradient while the content\n * isn't scrolled to the bottom — mirrors the BitkitDialog scrollable-body behaviour.\n */\nconst ScrollablePopoverBody = ({ children }: { children: ReactNode }) => {\n const styles = usePopoverStyles();\n const { open } = usePopoverContext();\n const contentRef = useRef<HTMLDivElement>(null);\n const [isScrollButtonVisible, setIsScrollButtonVisible] = useState(false);\n\n const updateScrollButtonVisibility = useCallback(() => {\n const content = contentRef.current;\n if (!content) {\n setIsScrollButtonVisible(false);\n return;\n }\n const didScrollToBottom = content.scrollTop >= content.scrollHeight - content.offsetHeight - 1;\n setIsScrollButtonVisible(!didScrollToBottom);\n }, []);\n\n useEffect(() => {\n const content = contentRef.current;\n if (!open || !content) return undefined;\n\n content.addEventListener('scroll', updateScrollButtonVisibility);\n const resizeObserver = new ResizeObserver(updateScrollButtonVisibility);\n resizeObserver.observe(content);\n\n return () => {\n content.removeEventListener('scroll', updateScrollButtonVisibility);\n resizeObserver.disconnect();\n };\n }, [open, updateScrollButtonVisibility]);\n\n return (\n <Box css={styles.scrollBody}>\n <Popover.Body ref={contentRef}>{children}</Popover.Body>\n {isScrollButtonVisible && (\n <>\n <Box css={styles.scrollGradient} />\n <chakra.button\n aria-label=\"Scroll to bottom\"\n css={styles.scrollButton}\n type=\"button\"\n onClick={() => {\n contentRef.current?.scrollTo({ top: contentRef.current.scrollHeight, behavior: 'smooth' });\n }}\n >\n <IconArrowDown color=\"icon/tertiary\" size=\"16\" />\n </chakra.button>\n </>\n )}\n </Box>\n );\n};\n\n/**\n * An anchored, non-modal floating panel built on Chakra Popover, styled as a compact dialog:\n * a header (title + close button), a scrollable body, and an optional footer. Anchor it with a\n * `trigger`, or — when the trigger can't be wrapped — control `open` and pass\n * `positioning.getAnchorElement`.\n */\nconst BitkitPopover = ({\n children,\n title,\n footer,\n trigger,\n open,\n defaultOpen,\n onOpenChange,\n positioning,\n persistentElements,\n}: BitkitPopoverProps) => (\n <Popover.Root\n open={open}\n defaultOpen={defaultOpen}\n onOpenChange={onOpenChange ? ({ open: isOpen }) => onOpenChange(isOpen) : undefined}\n positioning={{ placement: 'bottom-start', gutter: 4, ...positioning }}\n persistentElements={persistentElements}\n >\n {trigger ? <Popover.Trigger asChild>{trigger}</Popover.Trigger> : null}\n <Portal>\n {/* z-index belongs on Content, not Positioner: Zag derives the positioner's inline z-index\n from Content's computed z-index, so a value set on Positioner is ignored. */}\n <Popover.Positioner>\n <Popover.Content>\n <Popover.Header>\n <Popover.Title>{title}</Popover.Title>\n <Popover.CloseTrigger asChild>\n <BitkitCloseButton aria-label=\"Close\" />\n </Popover.CloseTrigger>\n </Popover.Header>\n <ScrollablePopoverBody>{children}</ScrollablePopoverBody>\n {footer ? <Popover.Footer>{footer}</Popover.Footer> : null}\n </Popover.Content>\n </Popover.Positioner>\n </Portal>\n </Popover.Root>\n);\n\nBitkitPopover.displayName = 'BitkitPopover';\n\nexport default BitkitPopover;\n"],"mappings":";;;;;;;;;;;;;AAgCA,IAAM,yBAAyB,EAAE,eAAwC;CACvE,MAAM,SAAS,iBAAiB;CAChC,MAAM,EAAE,SAAS,kBAAkB;CACnC,MAAM,aAAa,OAAuB,IAAI;CAC9C,MAAM,CAAC,uBAAuB,4BAA4B,SAAS,KAAK;CAExE,MAAM,+BAA+B,kBAAkB;EACrD,MAAM,UAAU,WAAW;EAC3B,IAAI,CAAC,SAAS;GACZ,yBAAyB,KAAK;GAC9B;EACF;EAEA,yBAAyB,EADC,QAAQ,aAAa,QAAQ,eAAe,QAAQ,eAAe,EAClD;CAC7C,GAAG,CAAC,CAAC;CAEL,gBAAgB;EACd,MAAM,UAAU,WAAW;EAC3B,IAAI,CAAC,QAAQ,CAAC,SAAS,OAAO,KAAA;EAE9B,QAAQ,iBAAiB,UAAU,4BAA4B;EAC/D,MAAM,iBAAiB,IAAI,eAAe,4BAA4B;EACtE,eAAe,QAAQ,OAAO;EAE9B,aAAa;GACX,QAAQ,oBAAoB,UAAU,4BAA4B;GAClE,eAAe,WAAW;EAC5B;CACF,GAAG,CAAC,MAAM,4BAA4B,CAAC;CAEvC,OACE,qBAAC,KAAD;EAAK,KAAK,OAAO;YAAjB,CACE,oBAAC,QAAQ,MAAT;GAAc,KAAK;GAAa;EAAuB,CAAA,GACtD,yBACC,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,KAAD,EAAK,KAAK,OAAO,eAAiB,CAAA,GAClC,oBAAC,OAAO,QAAR;GACE,cAAW;GACX,KAAK,OAAO;GACZ,MAAK;GACL,eAAe;IACb,WAAW,SAAS,SAAS;KAAE,KAAK,WAAW,QAAQ;KAAc,UAAU;IAAS,CAAC;GAC3F;aAEA,oBAAC,eAAD;IAAe,OAAM;IAAgB,MAAK;GAAM,CAAA;EACnC,CAAA,CACf,EAAA,CAAA,CAED;;AAET;;;;;;;AAQA,IAAM,iBAAiB,EACrB,UACA,OACA,QACA,SACA,MACA,aACA,cACA,aACA,yBAEA,qBAAC,QAAQ,MAAT;CACQ;CACO;CACb,cAAc,gBAAgB,EAAE,MAAM,aAAa,aAAa,MAAM,IAAI,KAAA;CAC1E,aAAa;EAAE,WAAW;EAAgB,QAAQ;EAAG,GAAG;CAAY;CAChD;WALtB,CAOG,UAAU,oBAAC,QAAQ,SAAT;EAAiB,SAAA;YAAS;CAAyB,CAAA,IAAI,MAClE,oBAAC,QAAD,EAAA,UAGE,oBAAC,QAAQ,YAAT,EAAA,UACE,qBAAC,QAAQ,SAAT,EAAA,UAAA;EACE,qBAAC,QAAQ,QAAT,EAAA,UAAA,CACE,oBAAC,QAAQ,OAAT,EAAA,UAAgB,MAAqB,CAAA,GACrC,oBAAC,QAAQ,cAAT;GAAsB,SAAA;aACpB,oBAAC,mBAAD,EAAmB,cAAW,QAAS,CAAA;EACnB,CAAA,CACR,EAAA,CAAA;EAChB,oBAAC,uBAAD,EAAwB,SAAgC,CAAA;EACvD,SAAS,oBAAC,QAAQ,QAAT,EAAA,UAAiB,OAAuB,CAAA,IAAI;CACvC,EAAA,CAAA,EACC,CAAA,EACd,CAAA,CACI;;AAGhB,cAAc,cAAc"}
|
|
@@ -52,6 +52,7 @@ export { default as BitkitOverflowTooltip, type BitkitOverflowTooltipProps, } fr
|
|
|
52
52
|
export { default as BitkitPageFooter, type BitkitPageFooterItemProps, type BitkitPageFooterProps, } from './BitkitPageFooter/BitkitPageFooter';
|
|
53
53
|
export { default as BitkitPagination, type BitkitPaginationLabels, type BitkitPaginationProps, } from './BitkitPagination/BitkitPagination';
|
|
54
54
|
export { default as BitkitPaginationLoadMore, type BitkitPaginationLoadMoreProps, } from './BitkitPaginationLoadMore/BitkitPaginationLoadMore';
|
|
55
|
+
export { default as BitkitPopover, type BitkitPopoverProps } from './BitkitPopover/BitkitPopover';
|
|
55
56
|
export { default as BitkitRadio, type BitkitRadioProps } from './BitkitRadio/BitkitRadio';
|
|
56
57
|
export { default as BitkitRadioGroup, type BitkitRadioGroupProps } from './BitkitRadioGroup/BitkitRadioGroup';
|
|
57
58
|
export { default as BitkitRibbon, type BitkitRibbonProps } from './BitkitRibbon/BitkitRibbon';
|
package/dist/main.js
CHANGED
|
@@ -341,6 +341,7 @@ import BitkitOverflowTooltip from "./components/BitkitOverflowTooltip/BitkitOver
|
|
|
341
341
|
import BitkitPageFooter_default from "./components/BitkitPageFooter/BitkitPageFooter.js";
|
|
342
342
|
import BitkitPagination from "./components/BitkitPagination/BitkitPagination.js";
|
|
343
343
|
import BitkitPaginationLoadMore from "./components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.js";
|
|
344
|
+
import BitkitPopover from "./components/BitkitPopover/BitkitPopover.js";
|
|
344
345
|
import BitkitRadio from "./components/BitkitRadio/BitkitRadio.js";
|
|
345
346
|
import BitkitRadioGroup from "./components/BitkitRadioGroup/BitkitRadioGroup.js";
|
|
346
347
|
import BitkitRibbon from "./components/BitkitRibbon/BitkitRibbon.js";
|
|
@@ -369,4 +370,4 @@ import BitkitTreeView, { createTreeCollection } from "./components/BitkitTreeVie
|
|
|
369
370
|
import useResponsive, { ResponsiveProvider } from "./hooks/useResponsive.js";
|
|
370
371
|
import bitkitTheme from "./theme/index.js";
|
|
371
372
|
import Provider from "./providers/BitkitProvider.js";
|
|
372
|
-
export { BitkitAccordion, BitkitActionBar, BitkitActionMenu, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitBreadcrumb, BitkitButton, BitkitCalendar, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox_default as BitkitCombobox, BitkitControlButton, BitkitDataWidget, BitkitDefinitionTooltip, BitkitDialog_default as BitkitDialog, BitkitDialogBody, BitkitDialogButtons, BitkitDialogContent, BitkitDialogFormContent, BitkitDialogHeader, BitkitDialogRoot, BitkitDialogStep, BitkitDraggableCard, BitkitDrawer, BitkitEmptyState, BitkitExpandableCard, BitkitExpandableRow, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLink, BitkitLinkButton, BitkitList_default as BitkitList, BitkitMarkdown, BitkitMarkdownCard, BitkitMultiselect_default as BitkitMultiselect, BitkitMultiselectMenu, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPageFooter_default as BitkitPageFooter, BitkitPagination, BitkitPaginationLoadMore, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect_default as BitkitSelect, BitkitSelectMenu, BitkitSelectMenuAction, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSettingsCard_default as BitkitSettingsCard, BitkitSidebar_default as BitkitSidebar, BitkitSortableColumnHeader, BitkitSpinner, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitSwitch, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextArea, BitkitTextInput, BitkitToggleButton, BitkitTooltip, BitkitTreeView, 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, IconBuildHub, IconBuildHubFilled, 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, IconFileYml, 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, ResponsiveProvider, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast, createTreeCollection, rem, useResponsive };
|
|
373
|
+
export { BitkitAccordion, BitkitActionBar, BitkitActionMenu, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitBreadcrumb, BitkitButton, BitkitCalendar, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox_default as BitkitCombobox, BitkitControlButton, BitkitDataWidget, BitkitDefinitionTooltip, BitkitDialog_default as BitkitDialog, BitkitDialogBody, BitkitDialogButtons, BitkitDialogContent, BitkitDialogFormContent, BitkitDialogHeader, BitkitDialogRoot, BitkitDialogStep, BitkitDraggableCard, BitkitDrawer, BitkitEmptyState, BitkitExpandableCard, BitkitExpandableRow, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLink, BitkitLinkButton, BitkitList_default as BitkitList, BitkitMarkdown, BitkitMarkdownCard, BitkitMultiselect_default as BitkitMultiselect, BitkitMultiselectMenu, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPageFooter_default as BitkitPageFooter, BitkitPagination, BitkitPaginationLoadMore, BitkitPopover, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect_default as BitkitSelect, BitkitSelectMenu, BitkitSelectMenuAction, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSettingsCard_default as BitkitSettingsCard, BitkitSidebar_default as BitkitSidebar, BitkitSortableColumnHeader, BitkitSpinner, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitSwitch, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextArea, BitkitTextInput, BitkitToggleButton, BitkitTooltip, BitkitTreeView, 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, IconBuildHub, IconBuildHubFilled, 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, IconFileYml, 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, ResponsiveProvider, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast, createTreeCollection, rem, useResponsive };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputAndTextarea.common.js","names":[],"sources":["../../../lib/theme/common/InputAndTextarea.common.ts"],"sourcesContent":["import { type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nexport const base = {\n appearance: 'none',\n background: 'background/primary',\n borderColor: 'border/regular',\n borderRadius: '4',\n borderWidth:
|
|
1
|
+
{"version":3,"file":"InputAndTextarea.common.js","names":[],"sources":["../../../lib/theme/common/InputAndTextarea.common.ts"],"sourcesContent":["import { type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nexport const base = {\n appearance: 'none',\n background: 'background/primary',\n borderColor: 'border/regular',\n borderRadius: '4',\n borderWidth: '1',\n color: 'input/text/inputValue',\n textStyle: 'body/lg/regular',\n width: '100%',\n boxShadow: 'inset/field',\n transition: 'border 200ms',\n _placeholder: {\n color: 'input/text/placeholder',\n },\n _hover: {\n borderColor: 'border/hover',\n },\n _invalid: {\n borderColor: 'border/error',\n _hover: {\n borderColor: 'border/error',\n },\n },\n _disabled: {\n _hover: {\n borderColor: 'border/disabled',\n },\n _placeholder: {\n color: 'text/disabled',\n },\n color: 'text/disabled',\n background: 'background/disabled',\n cursor: 'not-allowed',\n },\n _readOnly: {\n _hover: {\n borderColor: 'border/regular',\n },\n background: 'background/disabled',\n },\n} satisfies SystemStyleObject;\n\nexport const variants = {\n size: {\n md: {\n paddingInline: rem(11),\n paddingBlock: rem(9),\n textStyle: 'body/md/regular',\n '--input-height': rem(40),\n },\n lg: {\n paddingInline: rem(15),\n paddingBlock: rem(11),\n textStyle: 'body/lg/regular',\n '--input-height': rem(48),\n },\n },\n} satisfies Record<'size', Record<'md' | 'lg', SystemStyleObject>>;\n\nexport const defaultVariants: Record<'size', 'md' | 'lg'> = {\n size: 'lg',\n};\n\n/**\n * Additional styles for single-line `<input>` elements to opt out of the textStyle's explicit\n * line-height. With this override the caret follows the font's natural metrics (~font-size ×\n * 1.15) instead of the 20/24px line-height, so it no longer visually extends past sibling icons\n * in input groups. Textarea should NOT use this — multi-line text needs the textStyle line-height.\n */\nexport const singleLineInputOverrides = {\n lineHeight: 'normal',\n} satisfies SystemStyleObject;\n"],"mappings":";;AAIA,IAAa,OAAO;CAClB,YAAY;CACZ,YAAY;CACZ,aAAa;CACb,cAAc;CACd,aAAa;CACb,OAAO;CACP,WAAW;CACX,OAAO;CACP,WAAW;CACX,YAAY;CACZ,cAAc,EACZ,OAAO,yBACT;CACA,QAAQ,EACN,aAAa,eACf;CACA,UAAU;EACR,aAAa;EACb,QAAQ,EACN,aAAa,eACf;CACF;CACA,WAAW;EACT,QAAQ,EACN,aAAa,kBACf;EACA,cAAc,EACZ,OAAO,gBACT;EACA,OAAO;EACP,YAAY;EACZ,QAAQ;CACV;CACA,WAAW;EACT,QAAQ,EACN,aAAa,iBACf;EACA,YAAY;CACd;AACF;AAEA,IAAa,WAAW,EACtB,MAAM;CACJ,IAAI;EACF,eAAe,IAAI,EAAE;EACrB,cAAc,IAAI,CAAC;EACnB,WAAW;EACX,kBAAkB,IAAI,EAAE;CAC1B;CACA,IAAI;EACF,eAAe,IAAI,EAAE;EACrB,cAAc,IAAI,EAAE;EACpB,WAAW;EACX,kBAAkB,IAAI,EAAE;CAC1B;AACF,EACF;AAEA,IAAa,kBAA+C,EAC1D,MAAM,KACR;;;;;;;AAQA,IAAa,2BAA2B,EACtC,YAAY,SACd"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.recipe.js","names":[],"sources":["../../../lib/theme/recipes/Button.recipe.ts"],"sourcesContent":["import { defineRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\n// `as const` is load-bearing: without it `(typeof buttonVariants)[number]` widens to `string`,\n// which collapses the recipe's `variant` prop type to `string` — losing TS autocomplete/checking\n// and leaving Storybook/docgen (and the bitkit-storybook MCP) unable to enumerate the variants.\nconst buttonVariants = [\n 'primary',\n 'secondary',\n 'tertiary',\n 'danger-primary',\n 'danger-secondary',\n 'danger-tertiary',\n 'ai-primary',\n 'ai-secondary',\n 'ai-tertiary',\n] as const;\n\nexport type Variant = (typeof buttonVariants)[number];\n\nconst variantStyles = buttonVariants.reduce(\n (obj, variant) => {\n let borderColor = variant?.includes('secondary') ? `button/${variant}/border` : `button/${variant}/bg`;\n let disabledBorderColor = variant?.includes('secondary')\n ? `button/${variant}/border-disabled`\n : `button/${variant}/bg-disabled`;\n if (variant?.includes('tertiary')) {\n borderColor = 'transparent';\n disabledBorderColor = 'transparent';\n }\n const isSecondary = variant === 'secondary';\n obj[variant as NonNullable<Variant>] = {\n '&:hover': {\n backgroundColor: `button/${variant}/bg-hover`,\n borderColor: variant?.includes('secondary') ? `button/${variant}/border-hover` : `button/${variant}/bg-hover`,\n color: isSecondary ? 'button/secondary/text-hover' : `button/${variant}/fg-hover`,\n _icon: {\n color: isSecondary ? 'button/secondary/icon-hover' : undefined,\n },\n },\n '&:active': {\n backgroundColor: `button/${variant}/bg-active`,\n borderColor: variant?.includes('secondary') ? `button/${variant}/border-active` : `button/${variant}/bg-active`,\n color: isSecondary ? 'button/secondary/text-active' : `button/${variant}/fg-active`,\n _icon: {\n color: isSecondary ? 'button/secondary/icon-active' : undefined,\n },\n },\n _disabled: {\n backgroundColor: `button/${variant}/bg-disabled!`,\n borderColor: `${disabledBorderColor}!`,\n color: isSecondary ? 'button/secondary/text-disabled!' : `button/${variant}/fg-disabled!`,\n cursor: 'not-allowed',\n _icon: {\n color: isSecondary ? 'button/secondary/icon-disabled' : undefined,\n },\n },\n _icon: {\n color: isSecondary ? 'button/secondary/icon' : undefined,\n },\n backgroundColor: `button/${variant}/bg`,\n borderColor,\n borderStyle: 'solid',\n borderWidth:
|
|
1
|
+
{"version":3,"file":"Button.recipe.js","names":[],"sources":["../../../lib/theme/recipes/Button.recipe.ts"],"sourcesContent":["import { defineRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\n// `as const` is load-bearing: without it `(typeof buttonVariants)[number]` widens to `string`,\n// which collapses the recipe's `variant` prop type to `string` — losing TS autocomplete/checking\n// and leaving Storybook/docgen (and the bitkit-storybook MCP) unable to enumerate the variants.\nconst buttonVariants = [\n 'primary',\n 'secondary',\n 'tertiary',\n 'danger-primary',\n 'danger-secondary',\n 'danger-tertiary',\n 'ai-primary',\n 'ai-secondary',\n 'ai-tertiary',\n] as const;\n\nexport type Variant = (typeof buttonVariants)[number];\n\nconst variantStyles = buttonVariants.reduce(\n (obj, variant) => {\n let borderColor = variant?.includes('secondary') ? `button/${variant}/border` : `button/${variant}/bg`;\n let disabledBorderColor = variant?.includes('secondary')\n ? `button/${variant}/border-disabled`\n : `button/${variant}/bg-disabled`;\n if (variant?.includes('tertiary')) {\n borderColor = 'transparent';\n disabledBorderColor = 'transparent';\n }\n const isSecondary = variant === 'secondary';\n obj[variant as NonNullable<Variant>] = {\n '&:hover': {\n backgroundColor: `button/${variant}/bg-hover`,\n borderColor: variant?.includes('secondary') ? `button/${variant}/border-hover` : `button/${variant}/bg-hover`,\n color: isSecondary ? 'button/secondary/text-hover' : `button/${variant}/fg-hover`,\n _icon: {\n color: isSecondary ? 'button/secondary/icon-hover' : undefined,\n },\n },\n '&:active': {\n backgroundColor: `button/${variant}/bg-active`,\n borderColor: variant?.includes('secondary') ? `button/${variant}/border-active` : `button/${variant}/bg-active`,\n color: isSecondary ? 'button/secondary/text-active' : `button/${variant}/fg-active`,\n _icon: {\n color: isSecondary ? 'button/secondary/icon-active' : undefined,\n },\n },\n _disabled: {\n backgroundColor: `button/${variant}/bg-disabled!`,\n borderColor: `${disabledBorderColor}!`,\n color: isSecondary ? 'button/secondary/text-disabled!' : `button/${variant}/fg-disabled!`,\n cursor: 'not-allowed',\n _icon: {\n color: isSecondary ? 'button/secondary/icon-disabled' : undefined,\n },\n },\n _icon: {\n color: isSecondary ? 'button/secondary/icon' : undefined,\n },\n backgroundColor: `button/${variant}/bg`,\n borderColor,\n borderStyle: 'solid',\n borderWidth: '1',\n color: isSecondary ? 'button/secondary/text' : `button/${variant}/fg`,\n };\n return obj;\n },\n {} as Record<NonNullable<Variant>, SystemStyleObject>,\n);\n\nconst buttonRecipe = defineRecipe({\n className: 'button',\n base: {\n borderRadius: '4',\n cursor: 'pointer',\n fontWeight: 600,\n border: '1px solid transparent',\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n gap: '8',\n position: 'relative',\n '--spinner-color': 'currentColor',\n '--spinner-size': 'sizes.16',\n _disabled: {\n cursor: 'not-allowed',\n },\n },\n variants: {\n variant: variantStyles,\n size: {\n sm: {\n minWidth: '32',\n height: '32',\n paddingInline: rem(11),\n paddingBlock: rem(5),\n textStyle: 'comp/button/sm',\n },\n md: {\n minWidth: '40',\n height: '40',\n paddingInline: rem(15),\n paddingBlock: rem(7),\n textStyle: 'comp/button/md',\n },\n lg: {\n minWidth: '48',\n height: '48',\n padding: rem(15),\n textStyle: 'comp/button/lg',\n },\n },\n },\n defaultVariants: {\n variant: 'primary',\n size: 'lg',\n },\n});\n\nexport default buttonRecipe;\n"],"mappings":";;;AAwEA,IAAM,eAAe,aAAa;CAChC,WAAW;CACX,MAAM;EACJ,cAAc;EACd,QAAQ;EACR,YAAY;EACZ,QAAQ;EACR,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,KAAK;EACL,UAAU;EACV,mBAAmB;EACnB,kBAAkB;EAClB,WAAW,EACT,QAAQ,cACV;CACF;CACA,UAAU;EACR,SAtEkB;GAbpB;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EAKoB,EAAe,QAClC,KAAK,YAAY;GAChB,IAAI,cAAc,SAAS,SAAS,WAAW,IAAI,UAAU,QAAQ,WAAW,UAAU,QAAQ;GAClG,IAAI,sBAAsB,SAAS,SAAS,WAAW,IACnD,UAAU,QAAQ,oBAClB,UAAU,QAAQ;GACtB,IAAI,SAAS,SAAS,UAAU,GAAG;IACjC,cAAc;IACd,sBAAsB;GACxB;GACA,MAAM,cAAc,YAAY;GAChC,IAAI,WAAmC;IACrC,WAAW;KACT,iBAAiB,UAAU,QAAQ;KACnC,aAAa,SAAS,SAAS,WAAW,IAAI,UAAU,QAAQ,iBAAiB,UAAU,QAAQ;KACnG,OAAO,cAAc,gCAAgC,UAAU,QAAQ;KACvE,OAAO,EACL,OAAO,cAAc,gCAAgC,KAAA,EACvD;IACF;IACA,YAAY;KACV,iBAAiB,UAAU,QAAQ;KACnC,aAAa,SAAS,SAAS,WAAW,IAAI,UAAU,QAAQ,kBAAkB,UAAU,QAAQ;KACpG,OAAO,cAAc,iCAAiC,UAAU,QAAQ;KACxE,OAAO,EACL,OAAO,cAAc,iCAAiC,KAAA,EACxD;IACF;IACA,WAAW;KACT,iBAAiB,UAAU,QAAQ;KACnC,aAAa,GAAG,oBAAoB;KACpC,OAAO,cAAc,oCAAoC,UAAU,QAAQ;KAC3E,QAAQ;KACR,OAAO,EACL,OAAO,cAAc,mCAAmC,KAAA,EAC1D;IACF;IACA,OAAO,EACL,OAAO,cAAc,0BAA0B,KAAA,EACjD;IACA,iBAAiB,UAAU,QAAQ;IACnC;IACA,aAAa;IACb,aAAa;IACb,OAAO,cAAc,0BAA0B,UAAU,QAAQ;GACnE;GACA,OAAO;EACT,GACA,CAAC,CAsBU;EACT,MAAM;GACJ,IAAI;IACF,UAAU;IACV,QAAQ;IACR,eAAe,IAAI,EAAE;IACrB,cAAc,IAAI,CAAC;IACnB,WAAW;GACb;GACA,IAAI;IACF,UAAU;IACV,QAAQ;IACR,eAAe,IAAI,EAAE;IACrB,cAAc,IAAI,CAAC;IACnB,WAAW;GACb;GACA,IAAI;IACF,UAAU;IACV,QAAQ;IACR,SAAS,IAAI,EAAE;IACf,WAAW;GACb;EACF;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CAAC"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { rem } from "../themeUtils.js";
|
|
2
1
|
import { defineRecipe } from "@chakra-ui/react/styled-system";
|
|
3
2
|
//#region lib/theme/recipes/Spinner.recipe.ts
|
|
4
3
|
var spinnerRecipe = defineRecipe({
|
|
@@ -9,7 +8,7 @@ var spinnerRecipe = defineRecipe({
|
|
|
9
8
|
display: "inline-block",
|
|
10
9
|
borderColor: "var(--spinner-color)",
|
|
11
10
|
borderStyle: "solid",
|
|
12
|
-
borderWidth:
|
|
11
|
+
borderWidth: "2",
|
|
13
12
|
borderRadius: "100%",
|
|
14
13
|
width: "var(--spinner-size)",
|
|
15
14
|
height: "var(--spinner-size)",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Spinner.recipe.js","names":[],"sources":["../../../lib/theme/recipes/Spinner.recipe.ts"],"sourcesContent":["import { defineRecipe } from '@chakra-ui/react/styled-system';\n\
|
|
1
|
+
{"version":3,"file":"Spinner.recipe.js","names":[],"sources":["../../../lib/theme/recipes/Spinner.recipe.ts"],"sourcesContent":["import { defineRecipe } from '@chakra-ui/react/styled-system';\n\nconst spinnerRecipe = defineRecipe({\n className: 'spinner',\n base: {\n '--spinner-color': 'currentColor',\n '--spinner-track-color': 'transparent',\n display: 'inline-block',\n borderColor: 'var(--spinner-color)',\n borderStyle: 'solid',\n borderWidth: '2',\n borderRadius: '100%',\n width: 'var(--spinner-size)',\n height: 'var(--spinner-size)',\n animation: 'spin',\n animationDuration: '500ms',\n borderBottomColor: 'var(--spinner-track-color)',\n borderInlineStartColor: 'var(--spinner-track-color)',\n },\n variants: {\n size: {\n md: { '--spinner-size': 'sizes.12' },\n lg: { '--spinner-size': 'sizes.20' },\n },\n variant: {\n primary: {\n '--spinner-color': 'colors.purple.10',\n },\n purple: {\n '--spinner-color': 'colors.purple.40',\n },\n white: {\n '--spinner-color': 'colors.neutral.100',\n },\n 'on-disabled': {\n '--spinner-color': 'colors.neutral.70',\n },\n },\n },\n defaultVariants: {\n size: 'lg',\n },\n});\n\nexport default spinnerRecipe;\n"],"mappings":";;AAEA,IAAM,gBAAgB,aAAa;CACjC,WAAW;CACX,MAAM;EACJ,mBAAmB;EACnB,yBAAyB;EACzB,SAAS;EACT,aAAa;EACb,aAAa;EACb,aAAa;EACb,cAAc;EACd,OAAO;EACP,QAAQ;EACR,WAAW;EACX,mBAAmB;EACnB,mBAAmB;EACnB,wBAAwB;CAC1B;CACA,UAAU;EACR,MAAM;GACJ,IAAI,EAAE,kBAAkB,WAAW;GACnC,IAAI,EAAE,kBAAkB,WAAW;EACrC;EACA,SAAS;GACP,SAAS,EACP,mBAAmB,mBACrB;GACA,QAAQ,EACN,mBAAmB,mBACrB;GACA,OAAO,EACL,mBAAmB,qBACrB;GACA,eAAe,EACb,mBAAmB,oBACrB;EACF;CACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}
|
|
@@ -33,7 +33,7 @@ var toggleButtonRecipe = defineRecipe({
|
|
|
33
33
|
justifyContent: "center",
|
|
34
34
|
borderRadius: "4",
|
|
35
35
|
cursor: "pointer",
|
|
36
|
-
borderWidth: "
|
|
36
|
+
borderWidth: "1",
|
|
37
37
|
background: "button/secondary/bg",
|
|
38
38
|
borderColor: "button/secondary/border",
|
|
39
39
|
color: "button/secondary/icon",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleButton.recipe.js","names":[],"sources":["../../../lib/theme/recipes/ToggleButton.recipe.ts"],"sourcesContent":["import { defineRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nconst selected: SystemStyleObject = {\n background: 'background/selected',\n borderColor: 'border/selected',\n color: 'icon/interactive',\n};\n\nconst selectedHover: SystemStyleObject = {\n background: 'background/selected-hover',\n borderColor: 'border/selected',\n color: 'icon/interactive-hover',\n};\n\nconst selectedActive: SystemStyleObject = {\n background: 'background/selected-active',\n borderColor: 'border/selected',\n color: 'icon/interactive-hover',\n};\n\nconst active: SystemStyleObject = {\n background: 'button/secondary/bg-active',\n borderColor: 'button/secondary/border-active',\n color: 'button/secondary/icon-active',\n};\n\nconst disabled: SystemStyleObject = {\n background: 'button/secondary/bg-disabled',\n borderColor: 'button/secondary/border-disabled',\n color: 'button/secondary/icon-disabled',\n};\n\nconst toggleButtonRecipe = defineRecipe({\n className: 'toggle-button',\n base: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: '4',\n cursor: 'pointer',\n borderWidth: '
|
|
1
|
+
{"version":3,"file":"ToggleButton.recipe.js","names":[],"sources":["../../../lib/theme/recipes/ToggleButton.recipe.ts"],"sourcesContent":["import { defineRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nconst selected: SystemStyleObject = {\n background: 'background/selected',\n borderColor: 'border/selected',\n color: 'icon/interactive',\n};\n\nconst selectedHover: SystemStyleObject = {\n background: 'background/selected-hover',\n borderColor: 'border/selected',\n color: 'icon/interactive-hover',\n};\n\nconst selectedActive: SystemStyleObject = {\n background: 'background/selected-active',\n borderColor: 'border/selected',\n color: 'icon/interactive-hover',\n};\n\nconst active: SystemStyleObject = {\n background: 'button/secondary/bg-active',\n borderColor: 'button/secondary/border-active',\n color: 'button/secondary/icon-active',\n};\n\nconst disabled: SystemStyleObject = {\n background: 'button/secondary/bg-disabled',\n borderColor: 'button/secondary/border-disabled',\n color: 'button/secondary/icon-disabled',\n};\n\nconst toggleButtonRecipe = defineRecipe({\n className: 'toggle-button',\n base: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: '4',\n cursor: 'pointer',\n borderWidth: '1',\n background: 'button/secondary/bg',\n borderColor: 'button/secondary/border',\n color: 'button/secondary/icon',\n _hover: {\n background: 'button/secondary/bg-hover',\n borderColor: 'button/secondary/border-hover',\n _active: active,\n _pressed: {\n ...selectedHover,\n _active: selectedActive,\n },\n },\n _active: active,\n _pressed: {\n ...selected,\n _active: selectedActive,\n },\n _disabled: {\n cursor: 'not-allowed',\n ...disabled,\n _pressed: disabled,\n },\n },\n variants: {\n size: {\n sm: { padding: '8' },\n md: { padding: '12' },\n lg: { padding: '12' },\n },\n },\n defaultVariants: {\n size: 'md',\n },\n});\n\nexport default toggleButtonRecipe;\n"],"mappings":";;AAEA,IAAM,WAA8B;CAClC,YAAY;CACZ,aAAa;CACb,OAAO;AACT;AAEA,IAAM,gBAAmC;CACvC,YAAY;CACZ,aAAa;CACb,OAAO;AACT;AAEA,IAAM,iBAAoC;CACxC,YAAY;CACZ,aAAa;CACb,OAAO;AACT;AAEA,IAAM,SAA4B;CAChC,YAAY;CACZ,aAAa;CACb,OAAO;AACT;AAEA,IAAM,WAA8B;CAClC,YAAY;CACZ,aAAa;CACb,OAAO;AACT;AAEA,IAAM,qBAAqB,aAAa;CACtC,WAAW;CACX,MAAM;EACJ,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,cAAc;EACd,QAAQ;EACR,aAAa;EACb,YAAY;EACZ,aAAa;EACb,OAAO;EACP,QAAQ;GACN,YAAY;GACZ,aAAa;GACb,SAAS;GACT,UAAU;IACR,GAAG;IACH,SAAS;GACX;EACF;EACA,SAAS;EACT,UAAU;GACR,GAAG;GACH,SAAS;EACX;EACA,WAAW;GACT,QAAQ;GACR,GAAG;GACH,UAAU;EACZ;CACF;CACA,UAAU,EACR,MAAM;EACJ,IAAI,EAAE,SAAS,IAAI;EACnB,IAAI,EAAE,SAAS,KAAK;EACpB,IAAI,EAAE,SAAS,KAAK;CACtB,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}
|
|
@@ -116,7 +116,7 @@ var dialogSlotRecipe = defineSlotRecipe({
|
|
|
116
116
|
background: "background/primary",
|
|
117
117
|
borderColor: "border/minimal",
|
|
118
118
|
borderRadius: "100%",
|
|
119
|
-
borderWidth: "
|
|
119
|
+
borderWidth: "1",
|
|
120
120
|
bottom: "16",
|
|
121
121
|
boxShadow: "elevation/lg",
|
|
122
122
|
cursor: "pointer",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Dialog.recipe.ts"],"sourcesContent":["import { dialogAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst dialogSlotRecipe = defineSlotRecipe({\n className: 'dialog',\n slots: [\n ...dialogAnatomy.keys(),\n 'label',\n 'scrollBody',\n 'scrollButton',\n 'scrollGradient',\n 'stepDescription',\n 'stepHeader',\n 'stepTitle',\n 'stepTitleGroup',\n ] as const,\n base: {\n backdrop: {\n background: 'utilities/overlay',\n position: 'fixed',\n inset: 0,\n zIndex: 'dialogOverlay',\n _open: {\n animationStyle: 'fade-in',\n animationDuration: 'moderate',\n },\n _closed: {\n animationStyle: 'fade-out',\n animationDuration: 'moderate',\n },\n },\n positioner: {\n alignItems: { base: 'flex-start', tablet: 'center' },\n display: 'flex',\n height: '100dvh',\n justifyContent: 'center',\n left: 0,\n position: 'fixed',\n top: 0,\n width: '100dvw',\n zIndex: 'dialog',\n },\n content: {\n background: 'background/primary',\n borderRadius: { base: 0, tablet: '8' },\n boxShadow: 'elevation/lg',\n display: 'flex',\n flexDirection: 'column',\n outline: 'none',\n position: 'relative',\n _open: {\n animationStyle: 'scale-fade-in',\n animationDuration: 'moderate',\n },\n _closed: {\n animationStyle: 'scale-fade-out',\n animationDuration: 'faster',\n },\n },\n header: {\n display: 'flex',\n flexDirection: 'column',\n gap: '48',\n paddingBlock: '24',\n paddingInline: '32',\n position: 'relative',\n },\n title: {\n color: 'text/primary',\n paddingInlineEnd: '48',\n textStyle: 'comp/dialog/title',\n },\n description: {\n color: 'text/body',\n textStyle: 'body/lg/regular',\n },\n label: {\n color: 'text/secondary',\n textStyle: 'comp/dialog/label',\n },\n body: {\n display: 'flex',\n flex: '1',\n flexDirection: 'column',\n gap: '24',\n paddingInline: '32',\n _last: {\n paddingBlockEnd: '48',\n },\n },\n scrollBody: {\n display: 'flex',\n flexDirection: 'column',\n minHeight: 0,\n position: 'relative',\n _last: {\n paddingBlockEnd: '48',\n },\n },\n footer: {\n paddingBlockEnd: '32',\n paddingBlockStart: '24',\n paddingInline: '32',\n },\n closeTrigger: {\n insetEnd: '24',\n position: 'absolute',\n top: '24',\n },\n scrollButton: {\n alignItems: 'center',\n alignSelf: 'center',\n background: 'background/primary',\n borderColor: 'border/minimal',\n borderRadius: '100%',\n borderWidth: '
|
|
1
|
+
{"version":3,"file":"Dialog.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Dialog.recipe.ts"],"sourcesContent":["import { dialogAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst dialogSlotRecipe = defineSlotRecipe({\n className: 'dialog',\n slots: [\n ...dialogAnatomy.keys(),\n 'label',\n 'scrollBody',\n 'scrollButton',\n 'scrollGradient',\n 'stepDescription',\n 'stepHeader',\n 'stepTitle',\n 'stepTitleGroup',\n ] as const,\n base: {\n backdrop: {\n background: 'utilities/overlay',\n position: 'fixed',\n inset: 0,\n zIndex: 'dialogOverlay',\n _open: {\n animationStyle: 'fade-in',\n animationDuration: 'moderate',\n },\n _closed: {\n animationStyle: 'fade-out',\n animationDuration: 'moderate',\n },\n },\n positioner: {\n alignItems: { base: 'flex-start', tablet: 'center' },\n display: 'flex',\n height: '100dvh',\n justifyContent: 'center',\n left: 0,\n position: 'fixed',\n top: 0,\n width: '100dvw',\n zIndex: 'dialog',\n },\n content: {\n background: 'background/primary',\n borderRadius: { base: 0, tablet: '8' },\n boxShadow: 'elevation/lg',\n display: 'flex',\n flexDirection: 'column',\n outline: 'none',\n position: 'relative',\n _open: {\n animationStyle: 'scale-fade-in',\n animationDuration: 'moderate',\n },\n _closed: {\n animationStyle: 'scale-fade-out',\n animationDuration: 'faster',\n },\n },\n header: {\n display: 'flex',\n flexDirection: 'column',\n gap: '48',\n paddingBlock: '24',\n paddingInline: '32',\n position: 'relative',\n },\n title: {\n color: 'text/primary',\n paddingInlineEnd: '48',\n textStyle: 'comp/dialog/title',\n },\n description: {\n color: 'text/body',\n textStyle: 'body/lg/regular',\n },\n label: {\n color: 'text/secondary',\n textStyle: 'comp/dialog/label',\n },\n body: {\n display: 'flex',\n flex: '1',\n flexDirection: 'column',\n gap: '24',\n paddingInline: '32',\n _last: {\n paddingBlockEnd: '48',\n },\n },\n scrollBody: {\n display: 'flex',\n flexDirection: 'column',\n minHeight: 0,\n position: 'relative',\n _last: {\n paddingBlockEnd: '48',\n },\n },\n footer: {\n paddingBlockEnd: '32',\n paddingBlockStart: '24',\n paddingInline: '32',\n },\n closeTrigger: {\n insetEnd: '24',\n position: 'absolute',\n top: '24',\n },\n scrollButton: {\n alignItems: 'center',\n alignSelf: 'center',\n background: 'background/primary',\n borderColor: 'border/minimal',\n borderRadius: '100%',\n borderWidth: '1',\n bottom: '16',\n boxShadow: 'elevation/lg',\n cursor: 'pointer',\n display: 'flex',\n height: '32',\n justifyContent: 'center',\n position: 'absolute',\n width: '32',\n },\n stepDescription: {\n color: 'text/secondary',\n textStyle: 'body/md/regular',\n },\n stepHeader: {\n overflowY: 'auto',\n },\n stepTitle: {\n color: 'text/primary',\n textStyle: 'heading/h3',\n },\n stepTitleGroup: {\n display: 'flex',\n flexDirection: 'column',\n gap: '4',\n },\n scrollGradient: {\n background: 'linear-gradient(0deg, {colors.neutral.100} 0%, transparent 100%)',\n bottom: 48,\n height: '32',\n pointerEvents: 'none',\n position: 'absolute',\n width: '100%',\n },\n },\n variants: {\n scrollBehavior: {\n inside: {\n body: {\n overflowY: 'auto',\n _last: {\n paddingBlockEnd: 0, // override base _last: scrollBody slot handles padding instead\n },\n },\n content: {\n maxHeight: 'calc(100dvh - 96px)',\n overflow: 'hidden',\n },\n },\n outside: {},\n },\n size: {\n full: {\n body: {\n minHeight: 0,\n overflowY: 'auto',\n },\n content: {\n borderRadius: '8',\n height: '100%',\n maxHeight: '100%',\n maxWidth: '100%',\n overflow: 'hidden',\n width: '100%',\n },\n positioner: {\n padding: '32',\n },\n },\n lg: {\n content: {\n width: { base: '100%', tablet: rem(800) },\n },\n },\n md: {\n content: {\n width: { base: '100%', tablet: rem(640) },\n },\n },\n sm: {\n content: {\n width: { base: '100%', tablet: rem(480) },\n },\n },\n },\n variant: {\n overflowContent: {\n content: {\n maxHeight: 'calc(100dvh - 48px)',\n overflow: 'hidden',\n },\n header: {\n gap: '8',\n paddingBlockEnd: '8',\n paddingBlockStart: '16',\n paddingInline: '16',\n },\n title: {\n paddingInlineEnd: '32',\n textStyle: 'heading/h4',\n },\n body: {\n overflowY: 'auto',\n paddingBlockEnd: '8',\n paddingInline: '16',\n _last: {\n paddingBlockEnd: 0,\n },\n },\n scrollBody: {\n _last: {\n paddingBlockEnd: '16',\n },\n },\n footer: {\n paddingBlockEnd: '16',\n paddingBlockStart: 0,\n paddingInline: '16',\n },\n closeTrigger: {\n insetEnd: '12',\n top: '12',\n },\n scrollGradient: {\n bottom: '16',\n },\n scrollButton: {\n bottom: '8',\n },\n },\n },\n },\n defaultVariants: {\n scrollBehavior: 'outside',\n size: 'md',\n },\n});\n\nexport default dialogSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,mBAAmB,iBAAiB;CACxC,WAAW;CACX,OAAO;EACL,GAAG,cAAc,KAAK;EACtB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,MAAM;EACJ,UAAU;GACR,YAAY;GACZ,UAAU;GACV,OAAO;GACP,QAAQ;GACR,OAAO;IACL,gBAAgB;IAChB,mBAAmB;GACrB;GACA,SAAS;IACP,gBAAgB;IAChB,mBAAmB;GACrB;EACF;EACA,YAAY;GACV,YAAY;IAAE,MAAM;IAAc,QAAQ;GAAS;GACnD,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,MAAM;GACN,UAAU;GACV,KAAK;GACL,OAAO;GACP,QAAQ;EACV;EACA,SAAS;GACP,YAAY;GACZ,cAAc;IAAE,MAAM;IAAG,QAAQ;GAAI;GACrC,WAAW;GACX,SAAS;GACT,eAAe;GACf,SAAS;GACT,UAAU;GACV,OAAO;IACL,gBAAgB;IAChB,mBAAmB;GACrB;GACA,SAAS;IACP,gBAAgB;IAChB,mBAAmB;GACrB;EACF;EACA,QAAQ;GACN,SAAS;GACT,eAAe;GACf,KAAK;GACL,cAAc;GACd,eAAe;GACf,UAAU;EACZ;EACA,OAAO;GACL,OAAO;GACP,kBAAkB;GAClB,WAAW;EACb;EACA,aAAa;GACX,OAAO;GACP,WAAW;EACb;EACA,OAAO;GACL,OAAO;GACP,WAAW;EACb;EACA,MAAM;GACJ,SAAS;GACT,MAAM;GACN,eAAe;GACf,KAAK;GACL,eAAe;GACf,OAAO,EACL,iBAAiB,KACnB;EACF;EACA,YAAY;GACV,SAAS;GACT,eAAe;GACf,WAAW;GACX,UAAU;GACV,OAAO,EACL,iBAAiB,KACnB;EACF;EACA,QAAQ;GACN,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;EACjB;EACA,cAAc;GACZ,UAAU;GACV,UAAU;GACV,KAAK;EACP;EACA,cAAc;GACZ,YAAY;GACZ,WAAW;GACX,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,QAAQ;GACR,WAAW;GACX,QAAQ;GACR,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,UAAU;GACV,OAAO;EACT;EACA,iBAAiB;GACf,OAAO;GACP,WAAW;EACb;EACA,YAAY,EACV,WAAW,OACb;EACA,WAAW;GACT,OAAO;GACP,WAAW;EACb;EACA,gBAAgB;GACd,SAAS;GACT,eAAe;GACf,KAAK;EACP;EACA,gBAAgB;GACd,YAAY;GACZ,QAAQ;GACR,QAAQ;GACR,eAAe;GACf,UAAU;GACV,OAAO;EACT;CACF;CACA,UAAU;EACR,gBAAgB;GACd,QAAQ;IACN,MAAM;KACJ,WAAW;KACX,OAAO,EACL,iBAAiB,EACnB;IACF;IACA,SAAS;KACP,WAAW;KACX,UAAU;IACZ;GACF;GACA,SAAS,CAAC;EACZ;EACA,MAAM;GACJ,MAAM;IACJ,MAAM;KACJ,WAAW;KACX,WAAW;IACb;IACA,SAAS;KACP,cAAc;KACd,QAAQ;KACR,WAAW;KACX,UAAU;KACV,UAAU;KACV,OAAO;IACT;IACA,YAAY,EACV,SAAS,KACX;GACF;GACA,IAAI,EACF,SAAS,EACP,OAAO;IAAE,MAAM;IAAQ,QAAQ,IAAI,GAAG;GAAE,EAC1C,EACF;GACA,IAAI,EACF,SAAS,EACP,OAAO;IAAE,MAAM;IAAQ,QAAQ,IAAI,GAAG;GAAE,EAC1C,EACF;GACA,IAAI,EACF,SAAS,EACP,OAAO;IAAE,MAAM;IAAQ,QAAQ,IAAI,GAAG;GAAE,EAC1C,EACF;EACF;EACA,SAAS,EACP,iBAAiB;GACf,SAAS;IACP,WAAW;IACX,UAAU;GACZ;GACA,QAAQ;IACN,KAAK;IACL,iBAAiB;IACjB,mBAAmB;IACnB,eAAe;GACjB;GACA,OAAO;IACL,kBAAkB;IAClB,WAAW;GACb;GACA,MAAM;IACJ,WAAW;IACX,iBAAiB;IACjB,eAAe;IACf,OAAO,EACL,iBAAiB,EACnB;GACF;GACA,YAAY,EACV,OAAO,EACL,iBAAiB,KACnB,EACF;GACA,QAAQ;IACN,iBAAiB;IACjB,mBAAmB;IACnB,eAAe;GACjB;GACA,cAAc;IACZ,UAAU;IACV,KAAK;GACP;GACA,gBAAgB,EACd,QAAQ,KACV;GACA,cAAc,EACZ,QAAQ,IACV;EACF,EACF;CACF;CACA,iBAAiB;EACf,gBAAgB;EAChB,MAAM;CACR;AACF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Drawer.recipe.ts"],"sourcesContent":["import { drawerAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst drawerSlotRecipe = defineSlotRecipe({\n className: 'drawer',\n slots: drawerAnatomy.keys(),\n base: {\n backdrop: {\n background: 'utilities/overlay-light',\n inset: 0,\n position: 'fixed',\n zIndex: 'dialogOverlay',\n _open: {\n animationName: 'fade-in',\n animationDuration: 'slow',\n },\n _closed: {\n animationName: 'fade-out',\n animationDuration: 'moderate',\n },\n },\n positioner: {\n alignItems: 'stretch',\n display: 'flex',\n inset: 0,\n justifyContent: 'flex-end',\n overscrollBehaviorY: 'none',\n position: 'fixed',\n zIndex: 'dialog',\n },\n content: {\n background: 'background/primary',\n display: 'flex',\n flexDirection: 'column',\n maxHeight: '100dvh',\n outline: 'none',\n position: 'relative',\n _open: {\n animationDuration: 'slowest',\n animationName: {\n base: 'slide-from-right-full, fade-in',\n _rtl: 'slide-from-left-full, fade-in',\n },\n animationTimingFunction: 'ease-in-smooth',\n },\n _closed: {\n animationDuration: 'slower',\n animationName: {\n base: 'slide-to-right-full, fade-out',\n _rtl: 'slide-to-left-full, fade-out',\n },\n animationTimingFunction: 'ease-in-smooth',\n },\n },\n header: {\n paddingBlockEnd: '8',\n paddingBlockStart: '24',\n paddingInline: '24',\n },\n body: {\n flex: '1',\n overflow: 'auto',\n },\n footer: {\n borderBlockStartColor: 'border/regular',\n borderBlockStartWidth: '
|
|
1
|
+
{"version":3,"file":"Drawer.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Drawer.recipe.ts"],"sourcesContent":["import { drawerAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst drawerSlotRecipe = defineSlotRecipe({\n className: 'drawer',\n slots: drawerAnatomy.keys(),\n base: {\n backdrop: {\n background: 'utilities/overlay-light',\n inset: 0,\n position: 'fixed',\n zIndex: 'dialogOverlay',\n _open: {\n animationName: 'fade-in',\n animationDuration: 'slow',\n },\n _closed: {\n animationName: 'fade-out',\n animationDuration: 'moderate',\n },\n },\n positioner: {\n alignItems: 'stretch',\n display: 'flex',\n inset: 0,\n justifyContent: 'flex-end',\n overscrollBehaviorY: 'none',\n position: 'fixed',\n zIndex: 'dialog',\n },\n content: {\n background: 'background/primary',\n display: 'flex',\n flexDirection: 'column',\n maxHeight: '100dvh',\n outline: 'none',\n position: 'relative',\n _open: {\n animationDuration: 'slowest',\n animationName: {\n base: 'slide-from-right-full, fade-in',\n _rtl: 'slide-from-left-full, fade-in',\n },\n animationTimingFunction: 'ease-in-smooth',\n },\n _closed: {\n animationDuration: 'slower',\n animationName: {\n base: 'slide-to-right-full, fade-out',\n _rtl: 'slide-to-left-full, fade-out',\n },\n animationTimingFunction: 'ease-in-smooth',\n },\n },\n header: {\n paddingBlockEnd: '8',\n paddingBlockStart: '24',\n paddingInline: '24',\n },\n body: {\n flex: '1',\n overflow: 'auto',\n },\n footer: {\n borderBlockStartColor: 'border/regular',\n borderBlockStartWidth: '1',\n paddingBlock: '12',\n },\n title: {\n color: 'text/tertiary',\n flex: '1',\n textStyle: 'heading/h6',\n },\n description: {},\n closeTrigger: {\n alignItems: 'center',\n borderRadius: '4',\n color: 'icon/primary',\n cursor: 'pointer',\n display: 'inline-flex',\n height: '40',\n justifyContent: 'center',\n position: 'absolute',\n width: '40',\n _hover: {\n backgroundColor: 'color/neutral/subtle',\n },\n _active: {\n backgroundColor: 'color/neutral/moderate',\n },\n },\n },\n variants: {\n variant: {\n docked: {\n closeTrigger: {\n insetEnd: rem(18),\n top: '12',\n },\n content: {\n width: { base: '100vw', tablet: rem(320) },\n },\n },\n floating: {\n body: {\n paddingInline: '24',\n },\n closeTrigger: {\n insetEnd: '24',\n top: '24',\n },\n positioner: {\n padding: '32',\n },\n content: {\n borderRadius: '12',\n boxShadow: 'elevation/lg',\n maxWidth: rem(700),\n },\n header: {\n paddingBlockEnd: '16',\n paddingBlockStart: '24',\n paddingInline: '24',\n },\n footer: {\n borderBlockStartColor: 'transparent',\n borderBlockStartWidth: '0',\n paddingBlockEnd: '24',\n paddingBlockStart: '32',\n paddingInline: '24',\n },\n title: {\n color: 'text/primary',\n textStyle: 'comp/dialog/title',\n },\n },\n },\n },\n defaultVariants: {\n variant: 'docked',\n },\n});\n\nexport default drawerSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,mBAAmB,iBAAiB;CACxC,WAAW;CACX,OAAO,cAAc,KAAK;CAC1B,MAAM;EACJ,UAAU;GACR,YAAY;GACZ,OAAO;GACP,UAAU;GACV,QAAQ;GACR,OAAO;IACL,eAAe;IACf,mBAAmB;GACrB;GACA,SAAS;IACP,eAAe;IACf,mBAAmB;GACrB;EACF;EACA,YAAY;GACV,YAAY;GACZ,SAAS;GACT,OAAO;GACP,gBAAgB;GAChB,qBAAqB;GACrB,UAAU;GACV,QAAQ;EACV;EACA,SAAS;GACP,YAAY;GACZ,SAAS;GACT,eAAe;GACf,WAAW;GACX,SAAS;GACT,UAAU;GACV,OAAO;IACL,mBAAmB;IACnB,eAAe;KACb,MAAM;KACN,MAAM;IACR;IACA,yBAAyB;GAC3B;GACA,SAAS;IACP,mBAAmB;IACnB,eAAe;KACb,MAAM;KACN,MAAM;IACR;IACA,yBAAyB;GAC3B;EACF;EACA,QAAQ;GACN,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;EACjB;EACA,MAAM;GACJ,MAAM;GACN,UAAU;EACZ;EACA,QAAQ;GACN,uBAAuB;GACvB,uBAAuB;GACvB,cAAc;EAChB;EACA,OAAO;GACL,OAAO;GACP,MAAM;GACN,WAAW;EACb;EACA,aAAa,CAAC;EACd,cAAc;GACZ,YAAY;GACZ,cAAc;GACd,OAAO;GACP,QAAQ;GACR,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,UAAU;GACV,OAAO;GACP,QAAQ,EACN,iBAAiB,uBACnB;GACA,SAAS,EACP,iBAAiB,yBACnB;EACF;CACF;CACA,UAAU,EACR,SAAS;EACP,QAAQ;GACN,cAAc;IACZ,UAAU,IAAI,EAAE;IAChB,KAAK;GACP;GACA,SAAS,EACP,OAAO;IAAE,MAAM;IAAS,QAAQ,IAAI,GAAG;GAAE,EAC3C;EACF;EACA,UAAU;GACR,MAAM,EACJ,eAAe,KACjB;GACA,cAAc;IACZ,UAAU;IACV,KAAK;GACP;GACA,YAAY,EACV,SAAS,KACX;GACA,SAAS;IACP,cAAc;IACd,WAAW;IACX,UAAU,IAAI,GAAG;GACnB;GACA,QAAQ;IACN,iBAAiB;IACjB,mBAAmB;IACnB,eAAe;GACjB;GACA,QAAQ;IACN,uBAAuB;IACvB,uBAAuB;IACvB,iBAAiB;IACjB,mBAAmB;IACnB,eAAe;GACjB;GACA,OAAO;IACL,OAAO;IACP,WAAW;GACb;EACF;CACF,EACF;CACA,iBAAiB,EACf,SAAS,SACX;AACF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileUpload.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/FileUpload.recipe.ts"],"sourcesContent":["import { fileUploadAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst fileUploadSlotRecipe = defineSlotRecipe({\n className: 'file-upload',\n slots: fileUploadAnatomy.keys(),\n base: {\n root: {\n gap: '8',\n display: 'flex',\n flexDirection: 'column',\n },\n dropzone: {\n flex: 1,\n padding: '8',\n display: 'flex',\n cursor: 'pointer',\n borderRadius: '8',\n color: 'text/link',\n alignItems: 'stretch',\n borderColor: 'border/selected',\n backgroundColor: 'background/secondary',\n _icon: {\n color: 'icon/interactive',\n },\n _hover: {\n backgroundColor: 'background/selected',\n _active: {\n color: 'text/primary',\n borderColor: 'icon/primary',\n backgroundColor: 'background/selected-hover',\n _icon: {\n color: 'icon/primary',\n },\n },\n },\n _invalid: {\n color: 'input/text/error',\n borderColor: 'border/error',\n _icon: {\n color: 'icon/negative',\n },\n },\n _disabled: {\n cursor: 'not-allowed',\n color: 'text/on-disabled',\n borderColor: 'border/strong',\n backgroundColor: 'background/disabled',\n _icon: {\n color: 'icon/on-disabled',\n },\n },\n },\n dropzoneContent: {\n flex: 1,\n gap: '4',\n padding: '24',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderWidth: '
|
|
1
|
+
{"version":3,"file":"FileUpload.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/FileUpload.recipe.ts"],"sourcesContent":["import { fileUploadAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst fileUploadSlotRecipe = defineSlotRecipe({\n className: 'file-upload',\n slots: fileUploadAnatomy.keys(),\n base: {\n root: {\n gap: '8',\n display: 'flex',\n flexDirection: 'column',\n },\n dropzone: {\n flex: 1,\n padding: '8',\n display: 'flex',\n cursor: 'pointer',\n borderRadius: '8',\n color: 'text/link',\n alignItems: 'stretch',\n borderColor: 'border/selected',\n backgroundColor: 'background/secondary',\n _icon: {\n color: 'icon/interactive',\n },\n _hover: {\n backgroundColor: 'background/selected',\n _active: {\n color: 'text/primary',\n borderColor: 'icon/primary',\n backgroundColor: 'background/selected-hover',\n _icon: {\n color: 'icon/primary',\n },\n },\n },\n _invalid: {\n color: 'input/text/error',\n borderColor: 'border/error',\n _icon: {\n color: 'icon/negative',\n },\n },\n _disabled: {\n cursor: 'not-allowed',\n color: 'text/on-disabled',\n borderColor: 'border/strong',\n backgroundColor: 'background/disabled',\n _icon: {\n color: 'icon/on-disabled',\n },\n },\n },\n dropzoneContent: {\n flex: 1,\n gap: '4',\n padding: '24',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderWidth: '1',\n borderStyle: 'dashed',\n borderRadius: '4',\n },\n },\n\n variants: {\n variant: {\n image: {\n root: {\n height: rem(256),\n },\n },\n },\n },\n\n defaultVariants: {},\n});\n\nexport default fileUploadSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,uBAAuB,iBAAiB;CAC5C,WAAW;CACX,OAAO,kBAAkB,KAAK;CAC9B,MAAM;EACJ,MAAM;GACJ,KAAK;GACL,SAAS;GACT,eAAe;EACjB;EACA,UAAU;GACR,MAAM;GACN,SAAS;GACT,SAAS;GACT,QAAQ;GACR,cAAc;GACd,OAAO;GACP,YAAY;GACZ,aAAa;GACb,iBAAiB;GACjB,OAAO,EACL,OAAO,mBACT;GACA,QAAQ;IACN,iBAAiB;IACjB,SAAS;KACP,OAAO;KACP,aAAa;KACb,iBAAiB;KACjB,OAAO,EACL,OAAO,eACT;IACF;GACF;GACA,UAAU;IACR,OAAO;IACP,aAAa;IACb,OAAO,EACL,OAAO,gBACT;GACF;GACA,WAAW;IACT,QAAQ;IACR,OAAO;IACP,aAAa;IACb,iBAAiB;IACjB,OAAO,EACL,OAAO,mBACT;GACF;EACF;EACA,iBAAiB;GACf,MAAM;GACN,KAAK;GACL,SAAS;GACT,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,aAAa;GACb,aAAa;GACb,cAAc;EAChB;CACF;CAEA,UAAU,EACR,SAAS,EACP,OAAO,EACL,MAAM,EACJ,QAAQ,IAAI,GAAG,EACjB,EACF,EACF,EACF;CAEA,iBAAiB,CAAC;AACpB,CAAC"}
|
|
@@ -20,7 +20,7 @@ var imageCropperSlotRecipe = defineSlotRecipe({
|
|
|
20
20
|
width: "auto"
|
|
21
21
|
},
|
|
22
22
|
selection: {
|
|
23
|
-
borderWidth: "
|
|
23
|
+
borderWidth: "1",
|
|
24
24
|
borderStyle: "solid",
|
|
25
25
|
borderColor: "border/regular",
|
|
26
26
|
boxSizing: "border-box",
|
|
@@ -39,15 +39,15 @@ var imageCropperSlotRecipe = defineSlotRecipe({
|
|
|
39
39
|
borderColor: "border/regular",
|
|
40
40
|
opacity: .5,
|
|
41
41
|
"&[data-axis=\"horizontal\"]": {
|
|
42
|
-
borderBlockStartWidth: "
|
|
42
|
+
borderBlockStartWidth: "1",
|
|
43
43
|
borderBlockStartStyle: "solid",
|
|
44
|
-
borderBlockEndWidth: "
|
|
44
|
+
borderBlockEndWidth: "1",
|
|
45
45
|
borderBlockEndStyle: "solid"
|
|
46
46
|
},
|
|
47
47
|
"&[data-axis=\"vertical\"]": {
|
|
48
|
-
borderInlineStartWidth: "
|
|
48
|
+
borderInlineStartWidth: "1",
|
|
49
49
|
borderInlineStartStyle: "solid",
|
|
50
|
-
borderInlineEndWidth: "
|
|
50
|
+
borderInlineEndWidth: "1",
|
|
51
51
|
borderInlineEndStyle: "solid"
|
|
52
52
|
}
|
|
53
53
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageCropper.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/ImageCropper.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { anatomy } from '@zag-js/image-cropper';\n\nconst imageCropperSlotRecipe = defineSlotRecipe({\n className: 'image-cropper',\n slots: anatomy.keys(),\n base: {\n root: {\n position: 'relative',\n backgroundColor: 'background/secondary',\n },\n viewport: {\n // position: relative; overflow: hidden set inline by Zag.js\n height: '100%',\n width: 'fit-content',\n },\n image: {\n // position and transform set inline by Zag.js\n userSelect: 'none',\n pointerEvents: 'none',\n height: '100%',\n width: 'auto',\n },\n selection: {\n // position: absolute; top/left/width/height set inline by Zag.js via --crop-* CSS vars\n borderWidth: '
|
|
1
|
+
{"version":3,"file":"ImageCropper.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/ImageCropper.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { anatomy } from '@zag-js/image-cropper';\n\nconst imageCropperSlotRecipe = defineSlotRecipe({\n className: 'image-cropper',\n slots: anatomy.keys(),\n base: {\n root: {\n position: 'relative',\n backgroundColor: 'background/secondary',\n },\n viewport: {\n // position: relative; overflow: hidden set inline by Zag.js\n height: '100%',\n width: 'fit-content',\n },\n image: {\n // position and transform set inline by Zag.js\n userSelect: 'none',\n pointerEvents: 'none',\n height: '100%',\n width: 'auto',\n },\n selection: {\n // position: absolute; top/left/width/height set inline by Zag.js via --crop-* CSS vars\n borderWidth: '1',\n borderStyle: 'solid',\n borderColor: 'border/regular',\n boxSizing: 'border-box',\n boxShadow: '0 0 0 9999px rgba(0, 0, 0, 0.5)', // overlay outside selection; clipped by viewport overflow:hidden\n _hover: {\n cursor: 'grab',\n _active: {\n cursor: 'grabbing',\n },\n },\n },\n handle: {\n // Structural position, cursor, and edge-handle sizing set inline by Zag.js\n // Corner handles: visible 8×8px squares\n '&[data-position=\"nw\"], &[data-position=\"ne\"], &[data-position=\"sw\"], &[data-position=\"se\"]': {\n width: '8',\n height: '8',\n backgroundColor: 'border/regular',\n },\n },\n grid: {\n // position: absolute; inset set inline by Zag.js\n borderColor: 'border/regular',\n opacity: 0.5,\n '&[data-axis=\"horizontal\"]': {\n borderBlockStartWidth: '1',\n borderBlockStartStyle: 'solid',\n borderBlockEndWidth: '1',\n borderBlockEndStyle: 'solid',\n },\n '&[data-axis=\"vertical\"]': {\n borderInlineStartWidth: '1',\n borderInlineStartStyle: 'solid',\n borderInlineEndWidth: '1',\n borderInlineEndStyle: 'solid',\n },\n },\n },\n});\n\nexport default imageCropperSlotRecipe;\n"],"mappings":";;;AAGA,IAAM,yBAAyB,iBAAiB;CAC9C,WAAW;CACX,OAAO,QAAQ,KAAK;CACpB,MAAM;EACJ,MAAM;GACJ,UAAU;GACV,iBAAiB;EACnB;EACA,UAAU;GAER,QAAQ;GACR,OAAO;EACT;EACA,OAAO;GAEL,YAAY;GACZ,eAAe;GACf,QAAQ;GACR,OAAO;EACT;EACA,WAAW;GAET,aAAa;GACb,aAAa;GACb,aAAa;GACb,WAAW;GACX,WAAW;GACX,QAAQ;IACN,QAAQ;IACR,SAAS,EACP,QAAQ,WACV;GACF;EACF;EACA,QAAQ,EAGN,sGAA8F;GAC5F,OAAO;GACP,QAAQ;GACR,iBAAiB;EACnB,EACF;EACA,MAAM;GAEJ,aAAa;GACb,SAAS;GACT,+BAA6B;IAC3B,uBAAuB;IACvB,uBAAuB;IACvB,qBAAqB;IACrB,qBAAqB;GACvB;GACA,6BAA2B;IACzB,wBAAwB;IACxB,wBAAwB;IACxB,sBAAsB;IACtB,sBAAsB;GACxB;EACF;CACF;AACF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Multiselect.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Multiselect.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nexport const multiselectSlotRecipe = defineSlotRecipe({\n className: 'multiselect',\n slots: ['control', 'trigger', 'overlay', 'tagsBlock', 'placeholderText', 'indicatorGroup', 'indicator'],\n base: {\n control: {\n position: 'relative',\n width: '100%',\n },\n trigger: {\n position: 'absolute',\n inset: 0,\n display: 'block',\n background: 'background/primary',\n borderWidth:
|
|
1
|
+
{"version":3,"file":"Multiselect.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Multiselect.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nexport const multiselectSlotRecipe = defineSlotRecipe({\n className: 'multiselect',\n slots: ['control', 'trigger', 'overlay', 'tagsBlock', 'placeholderText', 'indicatorGroup', 'indicator'],\n base: {\n control: {\n position: 'relative',\n width: '100%',\n },\n trigger: {\n position: 'absolute',\n inset: 0,\n display: 'block',\n background: 'background/primary',\n borderWidth: '1',\n borderColor: 'border/strong',\n borderRadius: '4',\n color: 'input/text/inputValue',\n width: '100%',\n textAlign: 'start',\n userSelect: 'none',\n focusVisibleRing: 'inside',\n _disabled: {\n background: 'background/disabled',\n color: 'text/disabled',\n },\n _invalid: {\n borderColor: 'border/error',\n },\n _readOnly: {\n background: 'background/disabled',\n },\n },\n overlay: {\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n paddingInlineStart: '12',\n paddingInlineEnd: '48',\n },\n tagsBlock: {\n display: 'flex',\n flex: '1 0 0',\n flexWrap: 'wrap',\n alignItems: 'center',\n alignContent: 'center',\n gap: '8',\n minWidth: 0,\n },\n placeholderText: {\n flex: '1 0 0',\n minWidth: 0,\n height: '24',\n display: 'inline-flex',\n alignItems: 'center',\n color: 'input/text/inputValue',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n '&[data-placeholder]': {\n color: 'text/secondary',\n },\n },\n indicatorGroup: {\n display: 'flex',\n alignItems: 'center',\n gap: '8',\n position: 'absolute',\n insetInlineEnd: 0,\n top: 0,\n height: '48',\n paddingInlineEnd: '16',\n paddingInlineStart: '8',\n pointerEvents: 'none',\n '& > button': {\n pointerEvents: 'auto',\n },\n },\n indicator: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: 'icon/secondary',\n _disabled: {\n color: 'icon/disabled',\n },\n _readOnly: {\n color: 'icon/on-disabled',\n },\n },\n },\n\n variants: {\n constrained: {\n true: {\n overlay: {\n overflow: 'hidden',\n },\n tagsBlock: {\n flexWrap: 'nowrap',\n },\n },\n false: {},\n },\n size: {\n lg: {\n overlay: {\n minHeight: '48',\n paddingBlock: rem(11),\n },\n trigger: {\n textStyle: 'body/lg/regular',\n },\n placeholderText: {\n textStyle: 'body/lg/regular',\n lineHeight: rem(24),\n },\n },\n md: {\n indicatorGroup: {\n height: '40',\n },\n overlay: {\n minHeight: '40',\n paddingBlock: rem(7),\n '&:has([data-slot=\"tag\"])': {\n paddingInlineStart: rem(7),\n },\n },\n trigger: {\n textStyle: 'body/md/regular',\n },\n placeholderText: {\n textStyle: 'body/md/regular',\n lineHeight: rem(20),\n },\n },\n },\n },\n compoundVariants: [\n {\n constrained: true,\n size: 'lg',\n css: {\n overlay: {\n height: '48',\n minHeight: '48',\n paddingBlock: '12',\n },\n },\n },\n {\n constrained: true,\n size: 'md',\n css: {\n overlay: {\n height: '40',\n minHeight: '40',\n paddingBlock: '8',\n },\n },\n },\n ],\n defaultVariants: {\n constrained: false,\n size: 'lg',\n },\n});\n\nexport default multiselectSlotRecipe;\n"],"mappings":";;;AAIA,IAAa,wBAAwB,iBAAiB;CACpD,WAAW;CACX,OAAO;EAAC;EAAW;EAAW;EAAW;EAAa;EAAmB;EAAkB;CAAW;CACtG,MAAM;EACJ,SAAS;GACP,UAAU;GACV,OAAO;EACT;EACA,SAAS;GACP,UAAU;GACV,OAAO;GACP,SAAS;GACT,YAAY;GACZ,aAAa;GACb,aAAa;GACb,cAAc;GACd,OAAO;GACP,OAAO;GACP,WAAW;GACX,YAAY;GACZ,kBAAkB;GAClB,WAAW;IACT,YAAY;IACZ,OAAO;GACT;GACA,UAAU,EACR,aAAa,eACf;GACA,WAAW,EACT,YAAY,sBACd;EACF;EACA,SAAS;GACP,UAAU;GACV,SAAS;GACT,YAAY;GACZ,oBAAoB;GACpB,kBAAkB;EACpB;EACA,WAAW;GACT,SAAS;GACT,MAAM;GACN,UAAU;GACV,YAAY;GACZ,cAAc;GACd,KAAK;GACL,UAAU;EACZ;EACA,iBAAiB;GACf,MAAM;GACN,UAAU;GACV,QAAQ;GACR,SAAS;GACT,YAAY;GACZ,OAAO;GACP,UAAU;GACV,cAAc;GACd,YAAY;GACZ,uBAAuB,EACrB,OAAO,iBACT;EACF;EACA,gBAAgB;GACd,SAAS;GACT,YAAY;GACZ,KAAK;GACL,UAAU;GACV,gBAAgB;GAChB,KAAK;GACL,QAAQ;GACR,kBAAkB;GAClB,oBAAoB;GACpB,eAAe;GACf,cAAc,EACZ,eAAe,OACjB;EACF;EACA,WAAW;GACT,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,OAAO;GACP,WAAW,EACT,OAAO,gBACT;GACA,WAAW,EACT,OAAO,mBACT;EACF;CACF;CAEA,UAAU;EACR,aAAa;GACX,MAAM;IACJ,SAAS,EACP,UAAU,SACZ;IACA,WAAW,EACT,UAAU,SACZ;GACF;GACA,OAAO,CAAC;EACV;EACA,MAAM;GACJ,IAAI;IACF,SAAS;KACP,WAAW;KACX,cAAc,IAAI,EAAE;IACtB;IACA,SAAS,EACP,WAAW,kBACb;IACA,iBAAiB;KACf,WAAW;KACX,YAAY,IAAI,EAAE;IACpB;GACF;GACA,IAAI;IACF,gBAAgB,EACd,QAAQ,KACV;IACA,SAAS;KACP,WAAW;KACX,cAAc,IAAI,CAAC;KACnB,8BAA4B,EAC1B,oBAAoB,IAAI,CAAC,EAC3B;IACF;IACA,SAAS,EACP,WAAW,kBACb;IACA,iBAAiB;KACf,WAAW;KACX,YAAY,IAAI,EAAE;IACpB;GACF;EACF;CACF;CACA,kBAAkB,CAChB;EACE,aAAa;EACb,MAAM;EACN,KAAK,EACH,SAAS;GACP,QAAQ;GACR,WAAW;GACX,cAAc;EAChB,EACF;CACF,GACA;EACE,aAAa;EACb,MAAM;EACN,KAAK,EACH,SAAS;GACP,QAAQ;GACR,WAAW;GACX,cAAc;EAChB,EACF;CACF,CACF;CACA,iBAAiB;EACf,aAAa;EACb,MAAM;CACR;AACF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NativeSelect.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/NativeSelect.recipe.ts"],"sourcesContent":["import { nativeSelectAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst nativeSelectSlotRecipe = defineSlotRecipe({\n className: 'native-select',\n slots: [...nativeSelectAnatomy.keys(), 'statusIcon'],\n base: {\n root: {\n position: 'relative',\n },\n field: {\n width: '100%',\n minWidth: 0,\n appearance: 'none',\n borderRadius: '4',\n borderWidth:
|
|
1
|
+
{"version":3,"file":"NativeSelect.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/NativeSelect.recipe.ts"],"sourcesContent":["import { nativeSelectAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst nativeSelectSlotRecipe = defineSlotRecipe({\n className: 'native-select',\n slots: [...nativeSelectAnatomy.keys(), 'statusIcon'],\n base: {\n root: {\n position: 'relative',\n },\n field: {\n width: '100%',\n minWidth: 0,\n appearance: 'none',\n borderRadius: '4',\n borderWidth: '1',\n borderColor: 'border/strong',\n background: 'background/primary',\n transition: '200ms',\n color: 'input/text/inputValue',\n _hover: {\n borderColor: 'border/hover',\n _invalid: {\n borderColor: 'border/error',\n },\n },\n _invalid: {\n borderColor: 'border/error',\n },\n _disabled: {\n _hover: {\n borderColor: 'border/disabled',\n },\n _placeholder: {\n color: 'text/disabled',\n },\n color: 'text/disabled',\n background: 'background/disabled',\n cursor: 'not-allowed',\n },\n _placeholderShown: {\n color: 'input/text/placeholder',\n },\n },\n statusIcon: {\n position: 'absolute',\n top: '50%',\n right: '48',\n transform: 'translateY(-50%)',\n pointerEvents: 'none',\n },\n indicator: {\n position: 'absolute',\n top: '50%',\n right: rem(15),\n transform: 'translateY(-50%)',\n },\n },\n variants: {\n size: {\n md: {\n field: { paddingInline: rem(11), paddingBlock: rem(9), textStyle: 'body/md/regular' },\n },\n lg: {\n field: { paddingInline: rem(15), paddingBlock: rem(11), textStyle: 'body/lg/regular' },\n },\n },\n },\n defaultVariants: {\n size: 'lg',\n },\n});\n\nexport default nativeSelectSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,yBAAyB,iBAAiB;CAC9C,WAAW;CACX,OAAO,CAAC,GAAG,oBAAoB,KAAK,GAAG,YAAY;CACnD,MAAM;EACJ,MAAM,EACJ,UAAU,WACZ;EACA,OAAO;GACL,OAAO;GACP,UAAU;GACV,YAAY;GACZ,cAAc;GACd,aAAa;GACb,aAAa;GACb,YAAY;GACZ,YAAY;GACZ,OAAO;GACP,QAAQ;IACN,aAAa;IACb,UAAU,EACR,aAAa,eACf;GACF;GACA,UAAU,EACR,aAAa,eACf;GACA,WAAW;IACT,QAAQ,EACN,aAAa,kBACf;IACA,cAAc,EACZ,OAAO,gBACT;IACA,OAAO;IACP,YAAY;IACZ,QAAQ;GACV;GACA,mBAAmB,EACjB,OAAO,yBACT;EACF;EACA,YAAY;GACV,UAAU;GACV,KAAK;GACL,OAAO;GACP,WAAW;GACX,eAAe;EACjB;EACA,WAAW;GACT,UAAU;GACV,KAAK;GACL,OAAO,IAAI,EAAE;GACb,WAAW;EACb;CACF;CACA,UAAU,EACR,MAAM;EACJ,IAAI,EACF,OAAO;GAAE,eAAe,IAAI,EAAE;GAAG,cAAc,IAAI,CAAC;GAAG,WAAW;EAAkB,EACtF;EACA,IAAI,EACF,OAAO;GAAE,eAAe,IAAI,EAAE;GAAG,cAAc,IAAI,EAAE;GAAG,WAAW;EAAkB,EACvF;CACF,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}
|
|
@@ -13,7 +13,7 @@ declare const paginationSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinit
|
|
|
13
13
|
root: {
|
|
14
14
|
paddingInline: "24";
|
|
15
15
|
paddingBlock: "16";
|
|
16
|
-
borderTopWidth:
|
|
16
|
+
borderTopWidth: "1";
|
|
17
17
|
borderTopStyle: "solid";
|
|
18
18
|
borderTopColor: "border/regular";
|
|
19
19
|
};
|