@bitrise/bitkit-v2 0.3.231 → 0.3.233
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/BitkitDialog/BitkitDialog.d.ts +1 -0
- package/dist/components/BitkitDialog/BitkitDialog.js +1 -0
- package/dist/components/BitkitDialog/BitkitDialog.js.map +1 -1
- package/dist/components/BitkitDialog/BitkitDialogContent.d.ts +2 -1
- package/dist/components/BitkitDialog/BitkitDialogContent.js +2 -1
- package/dist/components/BitkitDialog/BitkitDialogContent.js.map +1 -1
- package/dist/components/BitkitExpandableCard/BitkitExpandableCard.d.ts +3 -2
- package/dist/components/BitkitExpandableCard/BitkitExpandableCard.js +7 -3
- package/dist/components/BitkitExpandableCard/BitkitExpandableCard.js.map +1 -1
- package/dist/theme/slot-recipes/Dialog.recipe.js +0 -4
- package/dist/theme/slot-recipes/Dialog.recipe.js.map +1 -1
- package/package.json +1 -1
|
@@ -27,6 +27,7 @@ declare const _default: {
|
|
|
27
27
|
ActionTrigger: import('react').ForwardRefExoticComponent<Dialog.ActionTriggerProps & import('react').RefAttributes<HTMLButtonElement>>;
|
|
28
28
|
Body: ({ children, ...rest }: import('./BitkitDialogBody').BitkitDialogBodyProps) => import("react/jsx-runtime").JSX.Element;
|
|
29
29
|
Buttons: import('react').ForwardRefExoticComponent<import('@chakra-ui/react').BoxProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
30
|
+
Content: ({ asChild, children, closable, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp, showScrollGradient, step, stepHeader, title, variant, }: import('./BitkitDialogContent').BitkitDialogContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
30
31
|
Footer: import('react').ForwardRefExoticComponent<Dialog.FooterProps & import('react').RefAttributes<HTMLDivElement>>;
|
|
31
32
|
Header: {
|
|
32
33
|
({ children }: BitkitDialogHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -47,6 +47,7 @@ var BitkitDialog_default = withSubComponents(BitkitDialog, {
|
|
|
47
47
|
ActionTrigger: Dialog.ActionTrigger,
|
|
48
48
|
Body: BitkitDialogBody,
|
|
49
49
|
Buttons: BitkitDialogButtons,
|
|
50
|
+
Content: BitkitDialogContent,
|
|
50
51
|
Footer: Dialog.Footer,
|
|
51
52
|
Header: BitkitDialogHeader,
|
|
52
53
|
Step: BitkitDialogStep
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { Children, isValidElement, type ReactNode } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitDialogBody from './BitkitDialogBody';\nimport BitkitDialogButtons from './BitkitDialogButtons';\nimport BitkitDialogContent from './BitkitDialogContent';\nimport BitkitDialogHeader, { type BitkitDialogHeaderProps } from './BitkitDialogHeader';\nimport BitkitDialogRoot from './BitkitDialogRoot';\nimport BitkitDialogStep from './BitkitDialogStep';\n\nexport interface BitkitDialogProps {\n children?: ReactNode;\n closable?: boolean;\n headerLabel?: string;\n maxHeight?: string;\n onExitComplete?: () => void;\n onOpenChange?: (details: { open: boolean }) => void;\n open?: boolean;\n preventScroll?: boolean;\n scrollBehavior?: 'inside' | 'outside';\n showScrollGradient?: boolean;\n size?: 'sm' | 'md' | 'lg' | 'full';\n step?: number;\n title: ReactNode;\n trigger?: ReactNode;\n variant?: 'overflowContent';\n}\n\nconst BitkitDialog = ({\n children,\n closable = true,\n headerLabel,\n maxHeight,\n onExitComplete,\n onOpenChange,\n open,\n preventScroll,\n scrollBehavior: scrollBehaviorProp,\n showScrollGradient,\n size,\n step = 0,\n title,\n trigger,\n variant,\n}: BitkitDialogProps) => {\n const scrollBehavior = variant === 'overflowContent' ? 'inside' : scrollBehaviorProp;\n\n const childrenArray = Children.toArray(children);\n const headerChild = childrenArray.find((child) => isValidElement(child) && child.type === BitkitDialogHeader);\n const bodyChildren = childrenArray.filter((child) => !(isValidElement(child) && child.type === BitkitDialogHeader));\n const stepHeader = isValidElement(headerChild) ? (headerChild.props as BitkitDialogHeaderProps).children : undefined;\n\n return (\n <BitkitDialogRoot\n closeOnEscape={closable}\n onExitComplete={onExitComplete}\n onOpenChange={onOpenChange}\n open={open}\n preventScroll={preventScroll}\n scrollBehavior={scrollBehavior}\n size={size}\n variant={variant}\n >\n {trigger && <Dialog.Trigger asChild>{trigger}</Dialog.Trigger>}\n <Portal>\n <Dialog.Backdrop />\n <Dialog.Positioner>\n <BitkitDialogContent\n closable={closable}\n headerLabel={headerLabel}\n maxHeight={maxHeight}\n scrollBehavior={scrollBehavior}\n showScrollGradient={showScrollGradient}\n step={step}\n stepHeader={stepHeader}\n title={title}\n variant={variant}\n >\n {bodyChildren}\n </BitkitDialogContent>\n </Dialog.Positioner>\n </Portal>\n </BitkitDialogRoot>\n );\n};\n\nBitkitDialog.displayName = 'BitkitDialog';\n\nexport default withSubComponents(BitkitDialog, {\n ActionTrigger: Dialog.ActionTrigger,\n Body: BitkitDialogBody,\n Buttons: BitkitDialogButtons,\n Footer: Dialog.Footer,\n Header: BitkitDialogHeader,\n Step: BitkitDialogStep,\n});\n"],"mappings":";;;;;;;;;;;;AA8BA,IAAM,gBAAgB,EACpB,UACA,WAAW,MACX,aACA,WACA,gBACA,cACA,MACA,eACA,gBAAgB,oBAChB,oBACA,MACA,OAAO,GACP,OACA,SACA,cACuB;CACvB,MAAM,iBAAiB,YAAY,oBAAoB,WAAW;CAElE,MAAM,gBAAgB,SAAS,QAAQ,QAAQ;CAC/C,MAAM,cAAc,cAAc,MAAM,UAAU,eAAe,KAAK,KAAK,MAAM,SAAS,kBAAkB;CAC5G,MAAM,eAAe,cAAc,QAAQ,UAAU,EAAE,eAAe,KAAK,KAAK,MAAM,SAAS,mBAAmB;CAClH,MAAM,aAAa,eAAe,WAAW,IAAK,YAAY,MAAkC,WAAW,KAAA;CAE3G,OACE,qBAAC,kBAAD;EACE,eAAe;EACC;EACF;EACR;EACS;EACC;EACV;EACG;YARX,CAUG,WAAW,oBAAC,OAAO,SAAR;GAAgB,SAAA;aAAS;EAAwB,CAAA,GAC7D,qBAAC,QAAD,EAAA,UAAA,CACE,oBAAC,OAAO,UAAR,CAAkB,CAAA,GAClB,oBAAC,OAAO,YAAR,EAAA,UACE,oBAAC,qBAAD;GACY;GACG;GACF;GACK;GACI;GACd;GACM;GACL;GACE;aAER;EACkB,CAAA,EACJ,CAAA,CACb,EAAA,CAAA,CACQ;;AAEtB;AAEA,aAAa,cAAc;AAE3B,IAAA,uBAAe,kBAAkB,cAAc;CAC7C,eAAe,OAAO;CACtB,MAAM;CACN,SAAS;CACT,QAAQ,OAAO;CACf,QAAQ;CACR,MAAM;AACR,CAAC"}
|
|
1
|
+
{"version":3,"file":"BitkitDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { Children, isValidElement, type ReactNode } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitDialogBody from './BitkitDialogBody';\nimport BitkitDialogButtons from './BitkitDialogButtons';\nimport BitkitDialogContent from './BitkitDialogContent';\nimport BitkitDialogHeader, { type BitkitDialogHeaderProps } from './BitkitDialogHeader';\nimport BitkitDialogRoot from './BitkitDialogRoot';\nimport BitkitDialogStep from './BitkitDialogStep';\n\nexport interface BitkitDialogProps {\n children?: ReactNode;\n closable?: boolean;\n headerLabel?: string;\n maxHeight?: string;\n onExitComplete?: () => void;\n onOpenChange?: (details: { open: boolean }) => void;\n open?: boolean;\n preventScroll?: boolean;\n scrollBehavior?: 'inside' | 'outside';\n showScrollGradient?: boolean;\n size?: 'sm' | 'md' | 'lg' | 'full';\n step?: number;\n title: ReactNode;\n trigger?: ReactNode;\n variant?: 'overflowContent';\n}\n\nconst BitkitDialog = ({\n children,\n closable = true,\n headerLabel,\n maxHeight,\n onExitComplete,\n onOpenChange,\n open,\n preventScroll,\n scrollBehavior: scrollBehaviorProp,\n showScrollGradient,\n size,\n step = 0,\n title,\n trigger,\n variant,\n}: BitkitDialogProps) => {\n const scrollBehavior = variant === 'overflowContent' ? 'inside' : scrollBehaviorProp;\n\n const childrenArray = Children.toArray(children);\n const headerChild = childrenArray.find((child) => isValidElement(child) && child.type === BitkitDialogHeader);\n const bodyChildren = childrenArray.filter((child) => !(isValidElement(child) && child.type === BitkitDialogHeader));\n const stepHeader = isValidElement(headerChild) ? (headerChild.props as BitkitDialogHeaderProps).children : undefined;\n\n return (\n <BitkitDialogRoot\n closeOnEscape={closable}\n onExitComplete={onExitComplete}\n onOpenChange={onOpenChange}\n open={open}\n preventScroll={preventScroll}\n scrollBehavior={scrollBehavior}\n size={size}\n variant={variant}\n >\n {trigger && <Dialog.Trigger asChild>{trigger}</Dialog.Trigger>}\n <Portal>\n <Dialog.Backdrop />\n <Dialog.Positioner>\n <BitkitDialogContent\n closable={closable}\n headerLabel={headerLabel}\n maxHeight={maxHeight}\n scrollBehavior={scrollBehavior}\n showScrollGradient={showScrollGradient}\n step={step}\n stepHeader={stepHeader}\n title={title}\n variant={variant}\n >\n {bodyChildren}\n </BitkitDialogContent>\n </Dialog.Positioner>\n </Portal>\n </BitkitDialogRoot>\n );\n};\n\nBitkitDialog.displayName = 'BitkitDialog';\n\nexport default withSubComponents(BitkitDialog, {\n ActionTrigger: Dialog.ActionTrigger,\n Body: BitkitDialogBody,\n Buttons: BitkitDialogButtons,\n Content: BitkitDialogContent,\n Footer: Dialog.Footer,\n Header: BitkitDialogHeader,\n Step: BitkitDialogStep,\n});\n"],"mappings":";;;;;;;;;;;;AA8BA,IAAM,gBAAgB,EACpB,UACA,WAAW,MACX,aACA,WACA,gBACA,cACA,MACA,eACA,gBAAgB,oBAChB,oBACA,MACA,OAAO,GACP,OACA,SACA,cACuB;CACvB,MAAM,iBAAiB,YAAY,oBAAoB,WAAW;CAElE,MAAM,gBAAgB,SAAS,QAAQ,QAAQ;CAC/C,MAAM,cAAc,cAAc,MAAM,UAAU,eAAe,KAAK,KAAK,MAAM,SAAS,kBAAkB;CAC5G,MAAM,eAAe,cAAc,QAAQ,UAAU,EAAE,eAAe,KAAK,KAAK,MAAM,SAAS,mBAAmB;CAClH,MAAM,aAAa,eAAe,WAAW,IAAK,YAAY,MAAkC,WAAW,KAAA;CAE3G,OACE,qBAAC,kBAAD;EACE,eAAe;EACC;EACF;EACR;EACS;EACC;EACV;EACG;YARX,CAUG,WAAW,oBAAC,OAAO,SAAR;GAAgB,SAAA;aAAS;EAAwB,CAAA,GAC7D,qBAAC,QAAD,EAAA,UAAA,CACE,oBAAC,OAAO,UAAR,CAAkB,CAAA,GAClB,oBAAC,OAAO,YAAR,EAAA,UACE,oBAAC,qBAAD;GACY;GACG;GACF;GACK;GACI;GACd;GACM;GACL;GACE;aAER;EACkB,CAAA,EACJ,CAAA,CACb,EAAA,CAAA,CACQ;;AAEtB;AAEA,aAAa,cAAc;AAE3B,IAAA,uBAAe,kBAAkB,cAAc;CAC7C,eAAe,OAAO;CACtB,MAAM;CACN,SAAS;CACT,SAAS;CACT,QAAQ,OAAO;CACf,QAAQ;CACR,MAAM;AACR,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
2
|
export interface BitkitDialogContentProps {
|
|
3
|
+
asChild?: boolean;
|
|
3
4
|
children?: ReactNode;
|
|
4
5
|
closable?: boolean;
|
|
5
6
|
headerLabel?: string;
|
|
@@ -11,5 +12,5 @@ export interface BitkitDialogContentProps {
|
|
|
11
12
|
title: ReactNode;
|
|
12
13
|
variant?: 'overflowContent';
|
|
13
14
|
}
|
|
14
|
-
declare const BitkitDialogContent: ({ children, closable, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp, showScrollGradient, step, stepHeader, title, variant, }: BitkitDialogContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
declare const BitkitDialogContent: ({ asChild, children, closable, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp, showScrollGradient, step, stepHeader, title, variant, }: BitkitDialogContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
15
16
|
export default BitkitDialogContent;
|
|
@@ -6,10 +6,11 @@ import { chakra } from "@chakra-ui/react/styled-system";
|
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
import { Dialog, useDialogStyles } from "@chakra-ui/react/dialog";
|
|
8
8
|
//#region lib/components/BitkitDialog/BitkitDialogContent.tsx
|
|
9
|
-
var BitkitDialogContent = ({ children, closable = true, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp = "outside", showScrollGradient = true, step = 0, stepHeader, title, variant }) => {
|
|
9
|
+
var BitkitDialogContent = ({ asChild, children, closable = true, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp = "outside", showScrollGradient = true, step = 0, stepHeader, title, variant }) => {
|
|
10
10
|
const scrollBehavior = variant === "overflowContent" ? "inside" : scrollBehaviorProp;
|
|
11
11
|
const styles = useDialogStyles();
|
|
12
12
|
return /* @__PURE__ */ jsx(Dialog.Content, {
|
|
13
|
+
asChild,
|
|
13
14
|
maxHeight,
|
|
14
15
|
children: /* @__PURE__ */ jsx(BitkitDialogStepProvider, {
|
|
15
16
|
value: { step },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitDialogContent.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialogContent.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Dialog, useDialogStyles } from '@chakra-ui/react/dialog';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { type ReactNode } from 'react';\n\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport { DialogBodyContext } from './BitkitDialogBody';\nimport { BitkitDialogStepProvider } from './BitkitDialogStepContext';\n\nexport interface BitkitDialogContentProps {\n children?: ReactNode;\n closable?: boolean;\n headerLabel?: string;\n maxHeight?: string;\n scrollBehavior?: 'inside' | 'outside';\n showScrollGradient?: boolean;\n step?: number;\n stepHeader?: ReactNode;\n title: ReactNode;\n variant?: 'overflowContent';\n}\n\nconst BitkitDialogContent = ({\n children,\n closable = true,\n headerLabel,\n maxHeight,\n scrollBehavior: scrollBehaviorProp = 'outside',\n showScrollGradient = true,\n step = 0,\n stepHeader,\n title,\n variant,\n}: BitkitDialogContentProps) => {\n const scrollBehavior = variant === 'overflowContent' ? 'inside' : scrollBehaviorProp;\n const styles = useDialogStyles();\n\n return (\n <Dialog.Content maxHeight={maxHeight}>\n <BitkitDialogStepProvider value={{ step }}>\n <DialogBodyContext.Provider value={{ scrollBehavior, showScrollGradient }}>\n <Dialog.Header>\n <Box display=\"flex\" flexDirection=\"column\" gap=\"4\">\n {headerLabel && <chakra.p css={styles.label}>{headerLabel}</chakra.p>}\n <Dialog.Title>{title}</Dialog.Title>\n </Box>\n {!!stepHeader && <Box css={styles.stepHeader}>{stepHeader}</Box>}\n <Dialog.CloseTrigger asChild>\n <BitkitCloseButton disabled={!closable} size={variant === 'overflowContent' ? 'xs' : 'md'} />\n </Dialog.CloseTrigger>\n </Dialog.Header>\n {children}\n </DialogBodyContext.Provider>\n </BitkitDialogStepProvider>\n </Dialog.Content>\n );\n};\n\nexport default BitkitDialogContent;\n"],"mappings":";;;;;;;;
|
|
1
|
+
{"version":3,"file":"BitkitDialogContent.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialogContent.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Dialog, useDialogStyles } from '@chakra-ui/react/dialog';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { type ReactNode } from 'react';\n\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport { DialogBodyContext } from './BitkitDialogBody';\nimport { BitkitDialogStepProvider } from './BitkitDialogStepContext';\n\nexport interface BitkitDialogContentProps {\n asChild?: boolean;\n children?: ReactNode;\n closable?: boolean;\n headerLabel?: string;\n maxHeight?: string;\n scrollBehavior?: 'inside' | 'outside';\n showScrollGradient?: boolean;\n step?: number;\n stepHeader?: ReactNode;\n title: ReactNode;\n variant?: 'overflowContent';\n}\n\nconst BitkitDialogContent = ({\n asChild,\n children,\n closable = true,\n headerLabel,\n maxHeight,\n scrollBehavior: scrollBehaviorProp = 'outside',\n showScrollGradient = true,\n step = 0,\n stepHeader,\n title,\n variant,\n}: BitkitDialogContentProps) => {\n const scrollBehavior = variant === 'overflowContent' ? 'inside' : scrollBehaviorProp;\n const styles = useDialogStyles();\n\n return (\n <Dialog.Content asChild={asChild} maxHeight={maxHeight}>\n <BitkitDialogStepProvider value={{ step }}>\n <DialogBodyContext.Provider value={{ scrollBehavior, showScrollGradient }}>\n <Dialog.Header>\n <Box display=\"flex\" flexDirection=\"column\" gap=\"4\">\n {headerLabel && <chakra.p css={styles.label}>{headerLabel}</chakra.p>}\n <Dialog.Title>{title}</Dialog.Title>\n </Box>\n {!!stepHeader && <Box css={styles.stepHeader}>{stepHeader}</Box>}\n <Dialog.CloseTrigger asChild>\n <BitkitCloseButton disabled={!closable} size={variant === 'overflowContent' ? 'xs' : 'md'} />\n </Dialog.CloseTrigger>\n </Dialog.Header>\n {children}\n </DialogBodyContext.Provider>\n </BitkitDialogStepProvider>\n </Dialog.Content>\n );\n};\n\nexport default BitkitDialogContent;\n"],"mappings":";;;;;;;;AAuBA,IAAM,uBAAuB,EAC3B,SACA,UACA,WAAW,MACX,aACA,WACA,gBAAgB,qBAAqB,WACrC,qBAAqB,MACrB,OAAO,GACP,YACA,OACA,cAC8B;CAC9B,MAAM,iBAAiB,YAAY,oBAAoB,WAAW;CAClE,MAAM,SAAS,gBAAgB;CAE/B,OACE,oBAAC,OAAO,SAAR;EAAyB;EAAoB;YAC3C,oBAAC,0BAAD;GAA0B,OAAO,EAAE,KAAK;aACtC,qBAAC,kBAAkB,UAAnB;IAA4B,OAAO;KAAE;KAAgB;IAAmB;cAAxE,CACE,qBAAC,OAAO,QAAR,EAAA,UAAA;KACE,qBAAC,KAAD;MAAK,SAAQ;MAAO,eAAc;MAAS,KAAI;gBAA/C,CACG,eAAe,oBAAC,OAAO,GAAR;OAAU,KAAK,OAAO;iBAAQ;MAAsB,CAAA,GACpE,oBAAC,OAAO,OAAR,EAAA,UAAe,MAAoB,CAAA,CAChC;;KACJ,CAAC,CAAC,cAAc,oBAAC,KAAD;MAAK,KAAK,OAAO;gBAAa;KAAgB,CAAA;KAC/D,oBAAC,OAAO,cAAR;MAAqB,SAAA;gBACnB,oBAAC,mBAAD;OAAmB,UAAU,CAAC;OAAU,MAAM,YAAY,oBAAoB,OAAO;MAAO,CAAA;KACzE,CAAA;IACR,EAAA,CAAA,GACd,QACyB;;EACJ,CAAA;CACZ,CAAA;AAEpB"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { CollapsibleRootProps } from '@chakra-ui/react/collapsible';
|
|
2
|
-
import { ReactNode } from 'react';
|
|
2
|
+
import { ReactElement, ReactNode } from 'react';
|
|
3
3
|
import { BitkitIconComponent } from '../../icons';
|
|
4
|
+
import { BitkitAvatarProps } from '../BitkitAvatar/BitkitAvatar';
|
|
4
5
|
type UncontrolledProps = {
|
|
5
6
|
defaultExpanded?: boolean;
|
|
6
7
|
expanded?: never;
|
|
@@ -13,7 +14,7 @@ type ControlledProps = {
|
|
|
13
14
|
};
|
|
14
15
|
export type BitkitExpandableCardProps = Omit<CollapsibleRootProps, 'defaultOpen' | 'onOpenChange' | 'open'> & {
|
|
15
16
|
children: ReactNode;
|
|
16
|
-
icon?: BitkitIconComponent
|
|
17
|
+
icon?: BitkitIconComponent | ReactElement<BitkitAvatarProps>;
|
|
17
18
|
secdText?: ReactNode;
|
|
18
19
|
size: 'md' | 'lg';
|
|
19
20
|
suffix?: ReactNode;
|
|
@@ -2,14 +2,18 @@ import AssetSelectChevron from "../../utilities/AssetSelectChevron.js";
|
|
|
2
2
|
import { Box } from "@chakra-ui/react/box";
|
|
3
3
|
import { useSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
4
4
|
import { Text } from "@chakra-ui/react/text";
|
|
5
|
+
import { cloneElement, isValidElement } from "react";
|
|
5
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
7
|
import { Card } from "@chakra-ui/react/card";
|
|
7
8
|
import { Collapsible } from "@chakra-ui/react/collapsible";
|
|
8
9
|
//#region lib/components/BitkitExpandableCard/BitkitExpandableCard.tsx
|
|
9
10
|
var BitkitExpandableCard = (props) => {
|
|
10
|
-
const { children, defaultExpanded, expanded, icon
|
|
11
|
+
const { children, defaultExpanded, expanded, icon, onChange, secdText, size = "lg", suffix, title, ...rest } = props;
|
|
11
12
|
const styles = useSlotRecipe({ key: "expandableCard" })({ size });
|
|
12
13
|
const handleOpenChange = onChange ? (details) => onChange(details.open) : void 0;
|
|
14
|
+
let renderedIcon = null;
|
|
15
|
+
if (isValidElement(icon)) renderedIcon = cloneElement(icon, { size: "24" });
|
|
16
|
+
else if (icon) renderedIcon = /* @__PURE__ */ jsx(icon, { size: "24" });
|
|
13
17
|
return /* @__PURE__ */ jsx(Card.Root, {
|
|
14
18
|
css: styles.root,
|
|
15
19
|
children: /* @__PURE__ */ jsxs(Collapsible.Root, {
|
|
@@ -23,9 +27,9 @@ var BitkitExpandableCard = (props) => {
|
|
|
23
27
|
display: "flex",
|
|
24
28
|
alignItems: "center",
|
|
25
29
|
gap: "8",
|
|
26
|
-
children: [
|
|
30
|
+
children: [!!renderedIcon && /* @__PURE__ */ jsx(Box, {
|
|
27
31
|
css: styles.icon,
|
|
28
|
-
children:
|
|
32
|
+
children: renderedIcon
|
|
29
33
|
}), /* @__PURE__ */ jsxs(Box, {
|
|
30
34
|
display: "flex",
|
|
31
35
|
alignItems: "flex-start",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitExpandableCard.js","names":[],"sources":["../../../lib/components/BitkitExpandableCard/BitkitExpandableCard.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Card } from '@chakra-ui/react/card';\nimport { Collapsible, type CollapsibleRootProps } from '@chakra-ui/react/collapsible';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport AssetSelectChevron from '../../utilities/AssetSelectChevron';\n\ntype UncontrolledProps = {\n defaultExpanded?: boolean;\n expanded?: never;\n onChange?: never;\n};\n\ntype ControlledProps = {\n defaultExpanded?: never;\n expanded: boolean;\n onChange: (expanded: boolean) => void;\n};\n\nexport type BitkitExpandableCardProps = Omit<CollapsibleRootProps, 'defaultOpen' | 'onOpenChange' | 'open'> & {\n children: ReactNode;\n icon?: BitkitIconComponent
|
|
1
|
+
{"version":3,"file":"BitkitExpandableCard.js","names":[],"sources":["../../../lib/components/BitkitExpandableCard/BitkitExpandableCard.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Card } from '@chakra-ui/react/card';\nimport { Collapsible, type CollapsibleRootProps } from '@chakra-ui/react/collapsible';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { cloneElement, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport AssetSelectChevron from '../../utilities/AssetSelectChevron';\nimport { type BitkitAvatarProps } from '../BitkitAvatar/BitkitAvatar';\n\ntype UncontrolledProps = {\n defaultExpanded?: boolean;\n expanded?: never;\n onChange?: never;\n};\n\ntype ControlledProps = {\n defaultExpanded?: never;\n expanded: boolean;\n onChange: (expanded: boolean) => void;\n};\n\nexport type BitkitExpandableCardProps = Omit<CollapsibleRootProps, 'defaultOpen' | 'onOpenChange' | 'open'> & {\n children: ReactNode;\n icon?: BitkitIconComponent | ReactElement<BitkitAvatarProps>;\n secdText?: ReactNode;\n size: 'md' | 'lg';\n suffix?: ReactNode;\n title: ReactNode;\n} & (UncontrolledProps | ControlledProps);\n\nconst BitkitExpandableCard = (props: BitkitExpandableCardProps) => {\n const { children, defaultExpanded, expanded, icon, onChange, secdText, size = 'lg', suffix, title, ...rest } = props;\n\n const recipe = useSlotRecipe({ key: 'expandableCard' });\n const styles = recipe({ size });\n\n const handleOpenChange = onChange ? (details: { open: boolean }) => onChange(details.open) : undefined;\n\n let renderedIcon: ReactNode = null;\n if (isValidElement<BitkitAvatarProps>(icon)) {\n renderedIcon = cloneElement(icon, { size: '24' });\n } else if (icon) {\n const Icon = icon;\n renderedIcon = <Icon size=\"24\" />;\n }\n\n return (\n <Card.Root css={styles.root}>\n <Collapsible.Root defaultOpen={defaultExpanded} open={expanded} onOpenChange={handleOpenChange} {...rest}>\n <Collapsible.Trigger css={styles.header}>\n <Box display=\"flex\" alignItems=\"center\" gap=\"8\">\n {!!renderedIcon && <Box css={styles.icon}>{renderedIcon}</Box>}\n <Box display=\"flex\" alignItems=\"flex-start\" flexDirection=\"column\">\n {title}\n {!!secdText && <Text css={styles.secdText}>{secdText}</Text>}\n </Box>\n </Box>\n <Box display=\"flex\" alignItems=\"center\">\n {!!suffix && <Text css={styles.suffix}>{suffix}</Text>}\n <Collapsible.Indicator asChild>\n <AssetSelectChevron />\n </Collapsible.Indicator>\n </Box>\n </Collapsible.Trigger>\n <Collapsible.Content css={styles.collapsible}>\n <Box css={styles.body}>{children}</Box>\n </Collapsible.Content>\n </Collapsible.Root>\n </Card.Root>\n );\n};\n\nBitkitExpandableCard.displayName = 'BitkitExpandableCard';\n\nexport default BitkitExpandableCard;\n"],"mappings":";;;;;;;;;AAgCA,IAAM,wBAAwB,UAAqC;CACjE,MAAM,EAAE,UAAU,iBAAiB,UAAU,MAAM,UAAU,UAAU,OAAO,MAAM,QAAQ,OAAO,GAAG,SAAS;CAG/G,MAAM,SADS,cAAc,EAAE,KAAK,iBAAiB,CACtC,EAAO,EAAE,KAAK,CAAC;CAE9B,MAAM,mBAAmB,YAAY,YAA+B,SAAS,QAAQ,IAAI,IAAI,KAAA;CAE7F,IAAI,eAA0B;CAC9B,IAAI,eAAkC,IAAI,GACxC,eAAe,aAAa,MAAM,EAAE,MAAM,KAAK,CAAC;MAC3C,IAAI,MAET,eAAe,oBAAC,MAAD,EAAM,MAAK,KAAM,CAAA;CAGlC,OACE,oBAAC,KAAK,MAAN;EAAW,KAAK,OAAO;YACrB,qBAAC,YAAY,MAAb;GAAkB,aAAa;GAAiB,MAAM;GAAU,cAAc;GAAkB,GAAI;aAApG,CACE,qBAAC,YAAY,SAAb;IAAqB,KAAK,OAAO;cAAjC,CACE,qBAAC,KAAD;KAAK,SAAQ;KAAO,YAAW;KAAS,KAAI;eAA5C,CACG,CAAC,CAAC,gBAAgB,oBAAC,KAAD;MAAK,KAAK,OAAO;gBAAO;KAAkB,CAAA,GAC7D,qBAAC,KAAD;MAAK,SAAQ;MAAO,YAAW;MAAa,eAAc;gBAA1D,CACG,OACA,CAAC,CAAC,YAAY,oBAAC,MAAD;OAAM,KAAK,OAAO;iBAAW;MAAe,CAAA,CACxD;OACF;QACL,qBAAC,KAAD;KAAK,SAAQ;KAAO,YAAW;eAA/B,CACG,CAAC,CAAC,UAAU,oBAAC,MAAD;MAAM,KAAK,OAAO;gBAAS;KAAa,CAAA,GACrD,oBAAC,YAAY,WAAb;MAAuB,SAAA;gBACrB,oBAAC,oBAAD,CAAqB,CAAA;KACA,CAAA,CACpB;MACc;OACrB,oBAAC,YAAY,SAAb;IAAqB,KAAK,OAAO;cAC/B,oBAAC,KAAD;KAAK,KAAK,OAAO;KAAO;IAAc,CAAA;GACnB,CAAA,CACL;;CACT,CAAA;AAEf;AAEA,qBAAqB,cAAc"}
|
|
@@ -101,10 +101,6 @@ var dialogSlotRecipe = defineSlotRecipe({
|
|
|
101
101
|
_last: { paddingBlockEnd: "48" }
|
|
102
102
|
},
|
|
103
103
|
footer: {
|
|
104
|
-
alignItems: "center",
|
|
105
|
-
display: "flex",
|
|
106
|
-
gap: "16",
|
|
107
|
-
justifyContent: "flex-end",
|
|
108
104
|
paddingBlockEnd: "32",
|
|
109
105
|
paddingBlockStart: "24",
|
|
110
106
|
paddingInline: "32"
|
|
@@ -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
|
|
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: '1px',\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.background.primary} 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":"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"}
|