@bitrise/bitkit-v2 0.3.304 → 0.3.306
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/BitkitCombobox/BitkitCombobox.js +12 -6
- package/dist/components/BitkitCombobox/BitkitCombobox.js.map +1 -1
- package/dist/components/BitkitLabeledData/BitkitLabeledData.d.ts +3 -0
- package/dist/components/BitkitLabeledData/BitkitLabeledData.js +5 -1
- package/dist/components/BitkitLabeledData/BitkitLabeledData.js.map +1 -1
- package/package.json +1 -1
|
@@ -7,10 +7,10 @@ import BitkitSelectMenuAction from "../BitkitSelectMenu/BitkitSelectMenuAction.j
|
|
|
7
7
|
import BitkitSelectMenu from "../BitkitSelectMenu/BitkitSelectMenu.js";
|
|
8
8
|
import BitkitPortalContext from "../../utilities/BitkitPortalContext.js";
|
|
9
9
|
import BitkitField from "../BitkitField/BitkitField.js";
|
|
10
|
-
import { forwardRef, useContext } from "react";
|
|
10
|
+
import { forwardRef, useContext, useState } from "react";
|
|
11
11
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
12
12
|
import { Portal } from "@chakra-ui/react/portal";
|
|
13
|
-
import {
|
|
13
|
+
import { createListCollection } from "@chakra-ui/react/collection";
|
|
14
14
|
import { Combobox } from "@chakra-ui/react/combobox";
|
|
15
15
|
import { useFilter } from "@chakra-ui/react/locale";
|
|
16
16
|
//#region lib/components/BitkitCombobox/BitkitCombobox.tsx
|
|
@@ -18,11 +18,17 @@ var BitkitCombobox = forwardRef((props, ref) => {
|
|
|
18
18
|
const { children, comboboxProps, defaultValue, disablePortal, emptyHelperText, emptyLabel, isLoading, items, onSearchChange, onValueChange, placeholder = "Enter a value or select", searchValue, size, state, value, ...fieldProps } = props;
|
|
19
19
|
const { disablePortal: disablePortalFromContext } = useContext(BitkitPortalContext);
|
|
20
20
|
const { contains } = useFilter({ sensitivity: "base" });
|
|
21
|
-
const
|
|
22
|
-
|
|
23
|
-
|
|
21
|
+
const [filterText, setFilterText] = useState("");
|
|
22
|
+
const collection = createListCollection({
|
|
23
|
+
items: filterText ? items.filter((item) => contains(item.label, filterText)) : items,
|
|
24
24
|
isItemDisabled: (item) => !!item.disabled
|
|
25
25
|
});
|
|
26
|
+
const itemsKey = JSON.stringify(items.map((item) => item.value));
|
|
27
|
+
const [prevItemsKey, setPrevItemsKey] = useState(itemsKey);
|
|
28
|
+
if (prevItemsKey !== itemsKey) {
|
|
29
|
+
setPrevItemsKey(itemsKey);
|
|
30
|
+
setFilterText("");
|
|
31
|
+
}
|
|
26
32
|
const hasWarning = state === "warning" || !!fieldProps.warningText;
|
|
27
33
|
const isInvalid = state === "error" || !!fieldProps.errorText;
|
|
28
34
|
const iconSize = size === "md" ? "16" : "24";
|
|
@@ -44,7 +50,7 @@ var BitkitCombobox = forwardRef((props, ref) => {
|
|
|
44
50
|
hasStatusIcon: !!statusIcon,
|
|
45
51
|
invalid: isInvalid,
|
|
46
52
|
onInputValueChange: (e) => {
|
|
47
|
-
|
|
53
|
+
setFilterText(e.inputValue);
|
|
48
54
|
},
|
|
49
55
|
onValueChange: (details) => onValueChange?.(details.value[0]),
|
|
50
56
|
readOnly: state === "readOnly",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitCombobox.js","names":[],"sources":["../../../lib/components/BitkitCombobox/BitkitCombobox.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"BitkitCombobox.js","names":[],"sources":["../../../lib/components/BitkitCombobox/BitkitCombobox.tsx"],"sourcesContent":["import { createListCollection } from '@chakra-ui/react/collection';\nimport { Combobox, type ComboboxRootProps } from '@chakra-ui/react/combobox';\nimport { useFilter } from '@chakra-ui/react/locale';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { forwardRef, useContext, useState } from 'react';\n\nimport IconErrorCircleFilled from '../../icons/IconErrorCircleFilled';\nimport IconWarningYellow from '../../icons/IconWarningYellow';\nimport AssetSelectChevron from '../../utilities/AssetSelectChevron';\nimport BitkitPortalContext from '../../utilities/BitkitPortalContext';\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport BitkitField, { type BitkitFieldProps } from '../BitkitField/BitkitField';\nimport BitkitSelectMenu, {\n type BitkitSelectMenuEmptyStateProps,\n type BitkitSelectMenuItemProps,\n type BitkitSelectMenuSearchProps,\n} from '../BitkitSelectMenu/BitkitSelectMenu';\nimport BitkitSelectMenuAction, { type BitkitSelectMenuActionChild } from '../BitkitSelectMenu/BitkitSelectMenuAction';\n\nexport type BitkitComboboxProps = Omit<BitkitFieldProps, 'children' | 'state'> & {\n children?: BitkitSelectMenuActionChild;\n comboboxProps?: Omit<ComboboxRootProps, 'collection' | 'defaultValue' | 'onValueChange' | 'value'>;\n defaultValue?: string;\n disablePortal?: boolean;\n isLoading?: boolean;\n items: Array<BitkitSelectMenuItemProps>;\n onValueChange?: (newVal: string | undefined) => void;\n placeholder?: string;\n size?: 'md' | 'lg';\n state?: 'disabled' | 'error' | 'readOnly' | 'warning';\n value?: string;\n} & BitkitSelectMenuSearchProps &\n BitkitSelectMenuEmptyStateProps;\n\nconst BitkitCombobox = forwardRef<HTMLDivElement, BitkitComboboxProps>((props: BitkitComboboxProps, ref) => {\n const {\n children,\n comboboxProps,\n defaultValue,\n disablePortal,\n emptyHelperText,\n emptyLabel,\n isLoading,\n items,\n onSearchChange,\n onValueChange,\n placeholder = 'Enter a value or select',\n searchValue,\n size,\n state,\n value,\n ...fieldProps\n } = props;\n\n const { disablePortal: disablePortalFromContext } = useContext(BitkitPortalContext);\n\n const { contains } = useFilter({ sensitivity: 'base' });\n\n // Derive the collection on every render rather than using useListCollection, which snapshots\n // `items` into state as `initialItems` and never syncs it again, so changing `items` actually reaches the menu.\n // Deriving also keeps callers that pass an inline array literal safe, since nothing here is keyed on items identity.\n const [filterText, setFilterText] = useState('');\n const visibleItems = filterText ? items.filter((item) => contains(item.label, filterText)) : items;\n const collection = createListCollection<BitkitSelectMenuItemProps>({\n items: visibleItems,\n isItemDisabled: (item) => !!item.disabled,\n });\n\n // A new set of items invalidates whatever the old ones were filtered by — otherwise leftover\n // filter text (which Zag also sets from the selected item's label) can hide every new item and\n // leave the menu empty. Keyed on item values, not array identity, so an inline `items={[…]}`\n // literal doesn't wipe the filter on every keystroke. Matches what useListCollection's `set()`\n // used to do for us.\n const itemsKey = JSON.stringify(items.map((item) => item.value));\n const [prevItemsKey, setPrevItemsKey] = useState(itemsKey);\n if (prevItemsKey !== itemsKey) {\n setPrevItemsKey(itemsKey);\n setFilterText('');\n }\n\n const hasWarning = state === 'warning' || !!fieldProps.warningText;\n const isInvalid = state === 'error' || !!fieldProps.errorText;\n const iconSize = size === 'md' ? '16' : '24';\n\n let statusIcon;\n if (isInvalid) {\n statusIcon = <IconErrorCircleFilled size={iconSize} color=\"icon/negative\" />;\n } else if (hasWarning) {\n statusIcon = <IconWarningYellow size={iconSize} />;\n }\n\n return (\n <BitkitField ref={ref} state={state} {...fieldProps}>\n <Combobox.Root\n {...comboboxProps}\n collection={collection}\n defaultValue={defaultValue ? [defaultValue] : undefined}\n disabled={state === 'disabled'}\n hasStatusIcon={!!statusIcon}\n invalid={isInvalid}\n onInputValueChange={(e) => {\n setFilterText(e.inputValue);\n }}\n onValueChange={(details) => onValueChange?.(details.value[0])}\n readOnly={state === 'readOnly'}\n // Bypass Zag's isScrollable(contentEl) gate — our Content is overflow:hidden flex\n // column, so the real scroll container is itemList. See BitkitMultiselect for why.\n scrollToIndexFn={({ getElement }) => getElement()?.scrollIntoView({ block: 'nearest' })}\n size={size}\n // Stay controlled whenever `value` is provided — including `''` (\"nothing selected\"). A\n // truthiness check (`value ? … : undefined`) passes `undefined` for `''`, which flips\n // Combobox.Root to uncontrolled: it then ignores `value`, so resets don't take and\n // onValueChange stops firing when the same option is re-selected.\n value={value === undefined ? undefined : value ? [value] : []}\n >\n <Combobox.Control className=\"group\">\n <Combobox.Input placeholder={placeholder} />\n <Combobox.IndicatorGroup>\n <Combobox.ClearTrigger asChild>\n <BitkitCloseButton size=\"sm\" />\n </Combobox.ClearTrigger>\n {statusIcon}\n <Combobox.Trigger asChild>\n <AssetSelectChevron />\n </Combobox.Trigger>\n </Combobox.IndicatorGroup>\n </Combobox.Control>\n <Portal disabled={disablePortal || disablePortalFromContext}>\n <Combobox.Positioner>\n <BitkitSelectMenu\n collection={collection}\n emptyHelperText={emptyHelperText}\n emptyLabel={emptyLabel}\n isLoading={isLoading}\n onSearchChange={onSearchChange}\n searchValue={searchValue}\n size={size}\n variant=\"combobox\"\n >\n {children}\n </BitkitSelectMenu>\n </Combobox.Positioner>\n </Portal>\n </Combobox.Root>\n </BitkitField>\n );\n});\n\nBitkitCombobox.displayName = 'BitkitCombobox';\n\nexport default withSubComponents(BitkitCombobox, { Action: BitkitSelectMenuAction });\n"],"mappings":";;;;;;;;;;;;;;;;AAmCA,IAAM,iBAAiB,YAAiD,OAA4B,QAAQ;CAC1G,MAAM,EACJ,UACA,eACA,cACA,eACA,iBACA,YACA,WACA,OACA,gBACA,eACA,cAAc,2BACd,aACA,MACA,OACA,OACA,GAAG,eACD;CAEJ,MAAM,EAAE,eAAe,6BAA6B,WAAW,mBAAmB;CAElF,MAAM,EAAE,aAAa,UAAU,EAAE,aAAa,OAAO,CAAC;CAKtD,MAAM,CAAC,YAAY,iBAAiB,SAAS,EAAE;CAE/C,MAAM,aAAa,qBAAgD;EACjE,OAFmB,aAAa,MAAM,QAAQ,SAAS,SAAS,KAAK,OAAO,UAAU,CAAC,IAAI;EAG3F,iBAAiB,SAAS,CAAC,CAAC,KAAK;CACnC,CAAC;CAOD,MAAM,WAAW,KAAK,UAAU,MAAM,KAAK,SAAS,KAAK,KAAK,CAAC;CAC/D,MAAM,CAAC,cAAc,mBAAmB,SAAS,QAAQ;CACzD,IAAI,iBAAiB,UAAU;EAC7B,gBAAgB,QAAQ;EACxB,cAAc,EAAE;CAClB;CAEA,MAAM,aAAa,UAAU,aAAa,CAAC,CAAC,WAAW;CACvD,MAAM,YAAY,UAAU,WAAW,CAAC,CAAC,WAAW;CACpD,MAAM,WAAW,SAAS,OAAO,OAAO;CAExC,IAAI;CACJ,IAAI,WACF,aAAa,oBAAC,uBAAD;EAAuB,MAAM;EAAU,OAAM;CAAiB,CAAA;MACtE,IAAI,YACT,aAAa,oBAAC,mBAAD,EAAmB,MAAM,SAAW,CAAA;CAGnD,OACE,oBAAC,aAAD;EAAkB;EAAY;EAAO,GAAI;YACvC,qBAAC,SAAS,MAAV;GACE,GAAI;GACQ;GACZ,cAAc,eAAe,CAAC,YAAY,IAAI,KAAA;GAC9C,UAAU,UAAU;GACpB,eAAe,CAAC,CAAC;GACjB,SAAS;GACT,qBAAqB,MAAM;IACzB,cAAc,EAAE,UAAU;GAC5B;GACA,gBAAgB,YAAY,gBAAgB,QAAQ,MAAM,EAAE;GAC5D,UAAU,UAAU;GAGpB,kBAAkB,EAAE,iBAAiB,WAAW,CAAC,EAAE,eAAe,EAAE,OAAO,UAAU,CAAC;GAChF;GAKN,OAAO,UAAU,KAAA,IAAY,KAAA,IAAY,QAAQ,CAAC,KAAK,IAAI,CAAC;aApB9D,CAsBE,qBAAC,SAAS,SAAV;IAAkB,WAAU;cAA5B,CACE,oBAAC,SAAS,OAAV,EAA6B,YAAc,CAAA,GAC3C,qBAAC,SAAS,gBAAV,EAAA,UAAA;KACE,oBAAC,SAAS,cAAV;MAAuB,SAAA;gBACrB,oBAAC,mBAAD,EAAmB,MAAK,KAAM,CAAA;KACT,CAAA;KACtB;KACD,oBAAC,SAAS,SAAV;MAAkB,SAAA;gBAChB,oBAAC,oBAAD,CAAqB,CAAA;KACL,CAAA;IACK,EAAA,CAAA,CACT;OAClB,oBAAC,QAAD;IAAQ,UAAU,iBAAiB;cACjC,oBAAC,SAAS,YAAV,EAAA,UACE,oBAAC,kBAAD;KACc;KACK;KACL;KACD;KACK;KACH;KACP;KACN,SAAQ;KAEP;IACe,CAAA,EACC,CAAA;GACf,CAAA,CACK;;CACJ,CAAA;AAEjB,CAAC;AAED,eAAe,cAAc;AAE7B,IAAA,yBAAe,kBAAkB,gBAAgB,EAAE,QAAQ,uBAAuB,CAAC"}
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import { BoxProps } from '@chakra-ui/react/box';
|
|
2
|
+
import { BitkitTooltipProps } from '../BitkitTooltip/BitkitTooltip';
|
|
2
3
|
export interface BitkitLabeledDataProps extends Omit<BoxProps, 'colorPalette'> {
|
|
3
4
|
label: string;
|
|
4
5
|
labelVariant?: 'primary' | 'secondary';
|
|
6
|
+
learnMoreTarget?: BitkitTooltipProps['learnMoreTarget'];
|
|
7
|
+
learnMoreUrl?: BitkitTooltipProps['learnMoreUrl'];
|
|
5
8
|
limitValue?: string;
|
|
6
9
|
placeholder?: string;
|
|
7
10
|
showWarning?: boolean;
|
|
@@ -13,7 +13,7 @@ var SKELETON_VALUE_HEIGHTS = {
|
|
|
13
13
|
"3xl": "40"
|
|
14
14
|
};
|
|
15
15
|
var BitkitLabeledData = forwardRef((props, ref) => {
|
|
16
|
-
const { label, labelVariant = "primary", limitValue, placeholder = "N/A", showWarning, size = "lg", state = "default", subtext, tooltip, tooltipAnchor = "value", value, variant = "default", ...rest } = props;
|
|
16
|
+
const { label, labelVariant = "primary", learnMoreTarget, learnMoreUrl, limitValue, placeholder = "N/A", showWarning, size = "lg", state = "default", subtext, tooltip, tooltipAnchor = "value", value, variant = "default", ...rest } = props;
|
|
17
17
|
const styles = useSlotRecipe({ key: "labeledData" })({ size: variant === "inline" ? void 0 : size });
|
|
18
18
|
if (variant === "inline") {
|
|
19
19
|
const isSm = size === "sm";
|
|
@@ -41,6 +41,8 @@ var BitkitLabeledData = forwardRef((props, ref) => {
|
|
|
41
41
|
})]
|
|
42
42
|
});
|
|
43
43
|
const wrapWithTooltip = (text, anchor) => tooltip && tooltipAnchor === anchor ? /* @__PURE__ */ jsx(BitkitDefinitionTooltip, {
|
|
44
|
+
learnMoreTarget,
|
|
45
|
+
learnMoreUrl,
|
|
44
46
|
text: tooltip,
|
|
45
47
|
children: text
|
|
46
48
|
}) : text;
|
|
@@ -69,6 +71,8 @@ var BitkitLabeledData = forwardRef((props, ref) => {
|
|
|
69
71
|
const labelContent = /* @__PURE__ */ jsxs(chakra.dt, {
|
|
70
72
|
css: styles.label,
|
|
71
73
|
children: [label, !!tooltip && /* @__PURE__ */ jsx(BitkitTooltip, {
|
|
74
|
+
learnMoreTarget,
|
|
75
|
+
learnMoreUrl,
|
|
72
76
|
text: tooltip,
|
|
73
77
|
children: /* @__PURE__ */ jsx(IconInfoCircle, {
|
|
74
78
|
size: "16",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitLabeledData.js","names":[],"sources":["../../../lib/components/BitkitLabeledData/BitkitLabeledData.tsx"],"sourcesContent":["import { type BoxProps } from '@chakra-ui/react/box';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport { IconInfoCircle, IconWarningYellow } from '../../icons';\nimport BitkitDefinitionTooltip from '../BitkitDefinitionTooltip/BitkitDefinitionTooltip';\nimport BitkitTooltip from '../BitkitTooltip/BitkitTooltip';\n\n// --- Types ---\n\nexport interface BitkitLabeledDataProps extends Omit<BoxProps, 'colorPalette'> {\n label: string;\n labelVariant?: 'primary' | 'secondary';\n limitValue?: string;\n placeholder?: string;\n showWarning?: boolean;\n size?: 'lg' | '2xl' | '3xl' | 'sm' | 'md';\n state?: 'default' | 'skeleton';\n subtext?: string;\n tooltip?: string;\n tooltipAnchor?: 'label' | 'value';\n value?: string;\n variant?: 'default' | 'inline';\n}\n\nconst SKELETON_VALUE_HEIGHTS = { lg: '24', '2xl': '36px', '3xl': '40' } as const;\n\n// --- Component ---\n\nconst BitkitLabeledData = forwardRef<HTMLElement, BitkitLabeledDataProps>((props, ref) => {\n const {\n label,\n labelVariant = 'primary',\n limitValue,\n placeholder = 'N/A',\n showWarning,\n size = 'lg',\n state = 'default',\n subtext,\n tooltip,\n tooltipAnchor = 'value',\n value,\n variant = 'default',\n ...rest\n } = props;\n\n const styles = useSlotRecipe({ key: 'labeledData' })({\n size: variant === 'inline' ? undefined : (size as 'lg' | '2xl' | '3xl'),\n });\n\n // --- Inline variant ---\n if (variant === 'inline') {\n const isSm = size === 'sm';\n const isPrimary = labelVariant === 'primary';\n const labelTextStyle = isPrimary\n ? isSm\n ? 'body/sm/semibold'\n : 'body/md/semibold'\n : isSm\n ? 'body/sm/regular'\n : 'body/md/regular';\n const labelEndsWithColon = label.endsWith(':') || label.endsWith('：');\n const colonSuffix = labelEndsWithColon ? '' : ':';\n\n if (state === 'skeleton') {\n return (\n <chakra.div ref={ref} display=\"flex\" alignItems=\"center\" gap=\"8\" {...rest}>\n {!!showWarning && <IconWarningYellow size=\"16\" />}\n <chakra.div display=\"flex\" alignItems=\"center\" gap=\"4\">\n <chakra.span textStyle={labelTextStyle} color={isPrimary ? 'text/primary' : 'text/secondary'}>\n {label}\n {colonSuffix}\n </chakra.span>\n <Skeleton height={isSm ? '16' : '20'} width=\"64\" />\n </chakra.div>\n </chakra.div>\n );\n }\n\n const wrapWithTooltip = (text: string, anchor: 'label' | 'value') =>\n tooltip && tooltipAnchor === anchor ? (\n <BitkitDefinitionTooltip text={tooltip}
|
|
1
|
+
{"version":3,"file":"BitkitLabeledData.js","names":[],"sources":["../../../lib/components/BitkitLabeledData/BitkitLabeledData.tsx"],"sourcesContent":["import { type BoxProps } from '@chakra-ui/react/box';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport { IconInfoCircle, IconWarningYellow } from '../../icons';\nimport BitkitDefinitionTooltip from '../BitkitDefinitionTooltip/BitkitDefinitionTooltip';\nimport BitkitTooltip, { type BitkitTooltipProps } from '../BitkitTooltip/BitkitTooltip';\n\n// --- Types ---\n\nexport interface BitkitLabeledDataProps extends Omit<BoxProps, 'colorPalette'> {\n label: string;\n labelVariant?: 'primary' | 'secondary';\n learnMoreTarget?: BitkitTooltipProps['learnMoreTarget'];\n learnMoreUrl?: BitkitTooltipProps['learnMoreUrl'];\n limitValue?: string;\n placeholder?: string;\n showWarning?: boolean;\n size?: 'lg' | '2xl' | '3xl' | 'sm' | 'md';\n state?: 'default' | 'skeleton';\n subtext?: string;\n tooltip?: string;\n tooltipAnchor?: 'label' | 'value';\n value?: string;\n variant?: 'default' | 'inline';\n}\n\nconst SKELETON_VALUE_HEIGHTS = { lg: '24', '2xl': '36px', '3xl': '40' } as const;\n\n// --- Component ---\n\nconst BitkitLabeledData = forwardRef<HTMLElement, BitkitLabeledDataProps>((props, ref) => {\n const {\n label,\n labelVariant = 'primary',\n learnMoreTarget,\n learnMoreUrl,\n limitValue,\n placeholder = 'N/A',\n showWarning,\n size = 'lg',\n state = 'default',\n subtext,\n tooltip,\n tooltipAnchor = 'value',\n value,\n variant = 'default',\n ...rest\n } = props;\n\n const styles = useSlotRecipe({ key: 'labeledData' })({\n size: variant === 'inline' ? undefined : (size as 'lg' | '2xl' | '3xl'),\n });\n\n // --- Inline variant ---\n if (variant === 'inline') {\n const isSm = size === 'sm';\n const isPrimary = labelVariant === 'primary';\n const labelTextStyle = isPrimary\n ? isSm\n ? 'body/sm/semibold'\n : 'body/md/semibold'\n : isSm\n ? 'body/sm/regular'\n : 'body/md/regular';\n const labelEndsWithColon = label.endsWith(':') || label.endsWith('：');\n const colonSuffix = labelEndsWithColon ? '' : ':';\n\n if (state === 'skeleton') {\n return (\n <chakra.div ref={ref} display=\"flex\" alignItems=\"center\" gap=\"8\" {...rest}>\n {!!showWarning && <IconWarningYellow size=\"16\" />}\n <chakra.div display=\"flex\" alignItems=\"center\" gap=\"4\">\n <chakra.span textStyle={labelTextStyle} color={isPrimary ? 'text/primary' : 'text/secondary'}>\n {label}\n {colonSuffix}\n </chakra.span>\n <Skeleton height={isSm ? '16' : '20'} width=\"64\" />\n </chakra.div>\n </chakra.div>\n );\n }\n\n const wrapWithTooltip = (text: string, anchor: 'label' | 'value') =>\n tooltip && tooltipAnchor === anchor ? (\n <BitkitDefinitionTooltip learnMoreTarget={learnMoreTarget} learnMoreUrl={learnMoreUrl} text={tooltip}>\n {text}\n </BitkitDefinitionTooltip>\n ) : (\n text\n );\n\n return (\n <chakra.div ref={ref} display=\"flex\" alignItems=\"center\" gap=\"8\" {...rest}>\n {!!showWarning && <IconWarningYellow size=\"16\" />}\n <chakra.div display=\"flex\" alignItems=\"center\" gap=\"4\">\n <chakra.span textStyle={labelTextStyle} color={isPrimary ? 'text/primary' : 'text/secondary'}>\n {wrapWithTooltip(label, 'label')}\n {colonSuffix}\n </chakra.span>\n <chakra.span\n textStyle={isSm ? 'body/sm/regular' : 'body/md/regular'}\n color={!value ? 'text/tertiary' : 'text/body'}\n >\n {!value ? placeholder : wrapWithTooltip(value, 'value')}\n </chakra.span>\n </chakra.div>\n </chakra.div>\n );\n }\n\n // --- Default variant ---\n\n const labelContent = (\n <chakra.dt css={styles.label}>\n {label}\n {!!tooltip && (\n <BitkitTooltip learnMoreTarget={learnMoreTarget} learnMoreUrl={learnMoreUrl} text={tooltip}>\n <IconInfoCircle size=\"16\" color=\"icon/tertiary\" />\n </BitkitTooltip>\n )}\n </chakra.dt>\n );\n\n if (state === 'skeleton') {\n return (\n <chakra.dl css={styles.root} ref={ref} {...(rest as Record<string, unknown>)}>\n {labelContent}\n <Skeleton height={SKELETON_VALUE_HEIGHTS[size as keyof typeof SKELETON_VALUE_HEIGHTS]} width=\"128\" />\n <Skeleton height=\"20\" width=\"128\" />\n </chakra.dl>\n );\n }\n\n return (\n <chakra.dl css={styles.root} ref={ref} {...(rest as Record<string, unknown>)}>\n {labelContent}\n <chakra.dd css={styles.value}>\n {!value ? (\n <chakra.span color=\"text/tertiary\">{placeholder}</chakra.span>\n ) : (\n <>\n {value}\n {!!limitValue && <chakra.span css={styles.limit}>/ {limitValue}</chakra.span>}\n </>\n )}\n </chakra.dd>\n {!!subtext && <chakra.dd css={styles.helpText}>{subtext}</chakra.dd>}\n </chakra.dl>\n );\n});\n\nBitkitLabeledData.displayName = 'BitkitLabeledData';\n\nexport default BitkitLabeledData;\n"],"mappings":"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"}
|