@frontify/fondue-components 0.1.0 → 1.0.1
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/fondue-components.js +10 -0
- package/dist/fondue-components.js.map +1 -0
- package/dist/fondue-components10.js +38 -0
- package/dist/fondue-components10.js.map +1 -0
- package/dist/fondue-components11.js +10 -0
- package/dist/fondue-components11.js.map +1 -0
- package/dist/fondue-components12.js +5 -0
- package/dist/fondue-components12.js.map +1 -0
- package/dist/fondue-components13.js +33 -0
- package/dist/fondue-components13.js.map +1 -0
- package/dist/fondue-components14.js +602 -0
- package/dist/fondue-components14.js.map +1 -0
- package/dist/fondue-components15.js +2363 -0
- package/dist/fondue-components15.js.map +1 -0
- package/dist/fondue-components16.js +146 -0
- package/dist/fondue-components16.js.map +1 -0
- package/dist/fondue-components17.js +5 -0
- package/dist/fondue-components17.js.map +1 -0
- package/dist/fondue-components18.js +5 -0
- package/dist/fondue-components18.js.map +1 -0
- package/dist/fondue-components19.js +32 -0
- package/dist/fondue-components19.js.map +1 -0
- package/dist/fondue-components2.js +2 -0
- package/dist/fondue-components2.js.map +1 -0
- package/dist/fondue-components3.js +49 -0
- package/dist/fondue-components3.js.map +1 -0
- package/dist/fondue-components4.js +56 -0
- package/dist/fondue-components4.js.map +1 -0
- package/dist/fondue-components5.js +38 -0
- package/dist/fondue-components5.js.map +1 -0
- package/dist/fondue-components6.js +9 -0
- package/dist/fondue-components6.js.map +1 -0
- package/dist/fondue-components7.js +129 -0
- package/dist/fondue-components7.js.map +1 -0
- package/dist/fondue-components8.js +108 -0
- package/dist/fondue-components8.js.map +1 -0
- package/dist/fondue-components9.js +105 -0
- package/dist/fondue-components9.js.map +1 -0
- package/dist/index.d.ts +122 -0
- package/dist/style.css +1 -0
- package/package.json +7 -4
- package/.eslintignore +0 -4
- package/.eslintrc.cjs +0 -33
- package/.prettierignore +0 -1
- package/.prettierrc +0 -17
- package/.storybook/DocumentationTemplate.mdx +0 -25
- package/.storybook/main.ts +0 -29
- package/.storybook/preview.ts +0 -54
- package/CHANGELOG.md +0 -7
- package/playwright/index.html +0 -12
- package/playwright/index.ts +0 -3
- package/playwright.config.ts +0 -29
- package/postcss.config.cjs +0 -8
- package/scripts/createNewComponent.ts +0 -42
- package/scripts/templates/__tests__/component.ct.tsx +0 -25
- package/scripts/templates/__tests__/component.spec.tsx +0 -24
- package/scripts/templates/component.stories.ts +0 -35
- package/scripts/templates/component.ts +0 -25
- package/scripts/templates/index.ts +0 -15
- package/scripts/templates/styles/componentStyles.tsx +0 -16
- package/scripts/transforms.ts +0 -13
- package/scripts/types.ts +0 -7
- package/src/components/Button/Button.stories.tsx +0 -57
- package/src/components/Button/Button.tsx +0 -111
- package/src/components/Button/styles/buttonStyles.ts +0 -175
- package/src/components/Button/styles/iconStyles.ts +0 -152
- package/src/components/Button/styles/textStyles.ts +0 -149
- package/src/components/Button/tests/Button.ct.tsx +0 -61
- package/src/components/Button/tests/Button.spec.tsx +0 -34
- package/src/components/Divider/Divider.stories.ts +0 -47
- package/src/components/Divider/Divider.tsx +0 -69
- package/src/components/Divider/__tests__/Divider.spec.tsx +0 -88
- package/src/components/LoadingBar/LoadingBar.stories.tsx +0 -32
- package/src/components/LoadingBar/LoadingBar.tsx +0 -68
- package/src/components/LoadingBar/styles/loadingBarStyles.ts +0 -38
- package/src/components/LoadingBar/tests/LoadingBar.ct.tsx +0 -39
- package/src/index.ts +0 -7
- package/src/setupTests.ts +0 -19
- package/src/styles.css +0 -33
- package/src/utilities/focusStyle.ts +0 -12
- package/src/utilities/styleUtilities.ts +0 -19
- package/src/utilities/tests/styleUtilities.spec.ts +0 -114
- package/tailwind.config.ts +0 -148
- package/tsconfig.json +0 -26
- package/tsconfig.node.json +0 -21
- package/vite.config.ts +0 -67
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fondue-components3.js","sources":["../src/components/Button/Button.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { cloneElement, forwardRef, type ForwardedRef, type MouseEvent, type ReactElement, type ReactNode } from 'react';\n\nimport { buttonIconSizeMap, buttonStyles } from './styles/buttonStyles';\nimport { iconStyles } from './styles/iconStyles';\nimport { textStyles } from './styles/textStyles';\n\ntype ButtonRounding = 'medium' | 'full';\n\ntype ButtonStyle = 'default' | 'positive' | 'negative' | 'danger' | 'loud';\n\ntype ButtonSize = 'small' | 'medium' | 'large';\n\ntype ButtonType = 'button' | 'submit' | 'reset';\n\ntype ButtonEmphasis = 'default' | 'weak' | 'strong';\n\nexport type ButtonProps = {\n /**\n * @default null\n */\n type?: ButtonType;\n /**\n * @default null\n */\n title?: string;\n /**\n * @default 'default'\n */\n style?: ButtonStyle;\n /**\n * @default 'strong'\n */\n emphasis?: ButtonEmphasis;\n /**\n * @default false\n */\n hideLabel?: boolean;\n /**\n * @default 'medium'\n */\n size?: ButtonSize;\n /**\n * @default 'medium'\n */\n rounding?: ButtonRounding;\n /**\n * @default false\n */\n disabled?: boolean;\n /**\n * @default true\n */\n hugWidth?: boolean;\n icon?: ReactElement;\n children?: ReactNode;\n onClick?: (event?: MouseEvent<HTMLButtonElement>) => void;\n 'aria-label'?: string;\n 'aria-describedby'?: string;\n 'data-test-id'?: string;\n};\n\nexport const Button = forwardRef<HTMLButtonElement | null, ButtonProps>(\n (\n {\n icon,\n children,\n hideLabel,\n style,\n size = 'medium',\n 'data-test-id': dataTestId = 'fondue-button',\n ...props\n }: ButtonProps,\n ref: ForwardedRef<HTMLButtonElement | null>,\n ) => {\n return (\n <button\n ref={ref}\n data-test-id={dataTestId}\n className={buttonStyles({\n iconOnly: (icon && !children) || hideLabel,\n size,\n style,\n ...props,\n })}\n {...props}\n >\n {icon && (\n <span\n data-test-id={`${dataTestId}-icon`}\n className={iconStyles({\n iconSpacing: children && !hideLabel ? size : 'none',\n style,\n ...props,\n })}\n >\n {cloneElement(icon, { size: buttonIconSizeMap[size] })}\n </span>\n )}\n {children && (\n <span className={textStyles({ hideLabel, style, ...props })} data-test-id={`${dataTestId}-text`}>\n {children}\n </span>\n )}\n </button>\n );\n },\n);\n\nButton.displayName = 'Button';\n"],"names":["Button","forwardRef","icon","children","hideLabel","style","size","dataTestId","props","ref","jsxs","buttonStyles","jsx","iconStyles","buttonIconSizeMap","textStyles"],"mappings":";;;;;AA+DO,MAAMA,IAASC;AAAA,EAClB,CACI;AAAA,IACI,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,gBAAgBC,IAAa;AAAA,IAC7B,GAAGC;AAAA,KAEPC,MAGIC,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,KAAAD;AAAA,MACA,gBAAcF;AAAA,MACd,WAAWI,EAAa;AAAA,QACpB,UAAWT,KAAQ,CAACC,KAAaC;AAAA,QACjC,MAAAE;AAAA,QACA,OAAAD;AAAA,QACA,GAAGG;AAAA,MAAA,CACN;AAAA,MACA,GAAGA;AAAA,MAEH,UAAA;AAAA,QACGN,KAAAU,gBAAAA,EAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,gBAAc,GAAGL,CAAU;AAAA,YAC3B,WAAWM,EAAW;AAAA,cAClB,aAAaV,KAAY,CAACC,IAAYE,IAAO;AAAA,cAC7C,OAAAD;AAAA,cACA,GAAGG;AAAA,YAAA,CACN;AAAA,YAEA,YAAaN,GAAM,EAAE,MAAMY,EAAkBR,CAAI,GAAG;AAAA,UAAA;AAAA,QACzD;AAAA,QAEHH,KACIS,gBAAAA,EAAA,IAAA,QAAA,EAAK,WAAWG,EAAW,EAAE,WAAAX,GAAW,OAAAC,GAAO,GAAGG,EAAO,CAAA,GAAG,gBAAc,GAAGD,CAAU,SACnF,UAAAJ,GACL;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAKpB;AAEAH,EAAO,cAAc;"}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
import { j as t } from "./fondue-components6.js";
|
|
2
|
+
const l = {
|
|
3
|
+
noline: "tw-border-none",
|
|
4
|
+
dashed: "tw-border-dashed",
|
|
5
|
+
solid: "tw-border-solid",
|
|
6
|
+
dotted: "tw-border-dotted"
|
|
7
|
+
}, d = {
|
|
8
|
+
small: 36,
|
|
9
|
+
medium: 60,
|
|
10
|
+
large: 96
|
|
11
|
+
}, o = "fondue-divider", w = ({
|
|
12
|
+
vertical: a = !1,
|
|
13
|
+
style: r = "solid",
|
|
14
|
+
height: e = "small",
|
|
15
|
+
"data-test-id": s = o,
|
|
16
|
+
color: i = "#CCC"
|
|
17
|
+
}) => a ? /* @__PURE__ */ t.jsx(
|
|
18
|
+
"div",
|
|
19
|
+
{
|
|
20
|
+
"aria-hidden": "true",
|
|
21
|
+
className: "tw-flex tw-self-stretch tw-mt-0 tw-mb-0 tw-items-center tw-justify-center",
|
|
22
|
+
"data-test-id": s,
|
|
23
|
+
style: {
|
|
24
|
+
marginLeft: d[e] / 2,
|
|
25
|
+
marginRight: d[e] / 2
|
|
26
|
+
},
|
|
27
|
+
children: /* @__PURE__ */ t.jsx(
|
|
28
|
+
"div",
|
|
29
|
+
{
|
|
30
|
+
className: `tw-w-px tw-h-full tw-border-r tw-m-0 ${l[r]}`,
|
|
31
|
+
style: { borderRightColor: i },
|
|
32
|
+
"data-test-id": "fondue-divider-line"
|
|
33
|
+
}
|
|
34
|
+
)
|
|
35
|
+
}
|
|
36
|
+
) : /* @__PURE__ */ t.jsx(
|
|
37
|
+
"div",
|
|
38
|
+
{
|
|
39
|
+
"aria-hidden": "true",
|
|
40
|
+
className: "tw-flex tw-items-center tw-w-full",
|
|
41
|
+
style: { height: d[e] },
|
|
42
|
+
"data-test-id": s,
|
|
43
|
+
children: /* @__PURE__ */ t.jsx(
|
|
44
|
+
"hr",
|
|
45
|
+
{
|
|
46
|
+
className: `tw-border-t tw-m-0 tw-w-full ${l[r]}`,
|
|
47
|
+
style: { borderTopColor: i },
|
|
48
|
+
"data-test-id": "fondue-divider-line"
|
|
49
|
+
}
|
|
50
|
+
)
|
|
51
|
+
}
|
|
52
|
+
);
|
|
53
|
+
export {
|
|
54
|
+
w as Divider
|
|
55
|
+
};
|
|
56
|
+
//# sourceMappingURL=fondue-components4.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fondue-components4.js","sources":["../src/components/Divider/Divider.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ReactElement } from 'react';\n\nexport type DividerStyle = 'noline' | 'dashed' | 'solid' | 'dotted';\n\nexport type DividerHeight = 'small' | 'medium' | 'large';\n\nexport type DividerProps = {\n style?: DividerStyle;\n height?: DividerHeight;\n color?: string;\n vertical?: boolean;\n 'data-test-id'?: string;\n};\n\nconst styleMap = {\n noline: 'tw-border-none',\n dashed: 'tw-border-dashed',\n solid: 'tw-border-solid',\n dotted: 'tw-border-dotted',\n};\n\nconst heightMap = {\n small: 36,\n medium: 60,\n large: 96,\n};\n\nconst DIVIDER_TEST_ID = 'fondue-divider';\n\nexport const Divider = ({\n vertical = false,\n style = 'solid',\n height = 'small',\n 'data-test-id': dataTestId = DIVIDER_TEST_ID,\n color = '#CCC',\n}: DividerProps): ReactElement => {\n return vertical ? (\n <div\n aria-hidden=\"true\"\n className=\"tw-flex tw-self-stretch tw-mt-0 tw-mb-0 tw-items-center tw-justify-center\"\n data-test-id={dataTestId}\n style={{\n marginLeft: heightMap[height] / 2,\n marginRight: heightMap[height] / 2,\n }}\n >\n <div\n className={`tw-w-px tw-h-full tw-border-r tw-m-0 ${styleMap[style]}`}\n style={{ borderRightColor: color }}\n data-test-id=\"fondue-divider-line\"\n />\n </div>\n ) : (\n <div\n aria-hidden=\"true\"\n className=\"tw-flex tw-items-center tw-w-full\"\n style={{ height: heightMap[height] }}\n data-test-id={dataTestId}\n >\n <hr\n className={`tw-border-t tw-m-0 tw-w-full ${styleMap[style]}`}\n style={{ borderTopColor: color }}\n data-test-id=\"fondue-divider-line\"\n />\n </div>\n );\n};\n"],"names":["styleMap","heightMap","DIVIDER_TEST_ID","Divider","vertical","style","height","dataTestId","color","jsx"],"mappings":";AAgBA,MAAMA,IAAW;AAAA,EACb,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,QAAQ;AACZ,GAEMC,IAAY;AAAA,EACd,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACX,GAEMC,IAAkB,kBAEXC,IAAU,CAAC;AAAA,EACpB,UAAAC,IAAW;AAAA,EACX,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,gBAAgBC,IAAaL;AAAA,EAC7B,OAAAM,IAAQ;AACZ,MACWJ,IACHK,gBAAAA,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,eAAY;AAAA,IACZ,WAAU;AAAA,IACV,gBAAcF;AAAA,IACd,OAAO;AAAA,MACH,YAAYN,EAAUK,CAAM,IAAI;AAAA,MAChC,aAAaL,EAAUK,CAAM,IAAI;AAAA,IACrC;AAAA,IAEA,UAAAG,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,wCAAwCT,EAASK,CAAK,CAAC;AAAA,QAClE,OAAO,EAAE,kBAAkBG,EAAM;AAAA,QACjC,gBAAa;AAAA,MAAA;AAAA,IACjB;AAAA,EAAA;AAAA,IAGJC,gBAAAA,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,eAAY;AAAA,IACZ,WAAU;AAAA,IACV,OAAO,EAAE,QAAQR,EAAUK,CAAM,EAAE;AAAA,IACnC,gBAAcC;AAAA,IAEd,UAAAE,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,gCAAgCT,EAASK,CAAK,CAAC;AAAA,QAC1D,OAAO,EAAE,gBAAgBG,EAAM;AAAA,QAC/B,gBAAa;AAAA,MAAA;AAAA,IACjB;AAAA,EAAA;AAAA;"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { j as i } from "./fondue-components6.js";
|
|
2
|
+
import * as o from "@radix-ui/react-progress";
|
|
3
|
+
import { forwardRef as l } from "react";
|
|
4
|
+
import { loadingBarContainerStyles as f, loadingBarStyles as g } from "./fondue-components10.js";
|
|
5
|
+
const p = l(
|
|
6
|
+
({
|
|
7
|
+
value: a,
|
|
8
|
+
max: r = 100,
|
|
9
|
+
rounded: e = !0,
|
|
10
|
+
style: t = "default",
|
|
11
|
+
size: d = "medium",
|
|
12
|
+
"data-test-id": s = "fondue-loading-bar",
|
|
13
|
+
...n
|
|
14
|
+
}, m) => /* @__PURE__ */ i.jsx(
|
|
15
|
+
o.Root,
|
|
16
|
+
{
|
|
17
|
+
ref: m,
|
|
18
|
+
"data-test-id": s,
|
|
19
|
+
className: f({ rounded: e, size: d, style: t }),
|
|
20
|
+
"aria-busy": a !== r,
|
|
21
|
+
value: a,
|
|
22
|
+
max: r,
|
|
23
|
+
style: a ? { "--loading-bar-value": `${a}%` } : {},
|
|
24
|
+
...n,
|
|
25
|
+
children: /* @__PURE__ */ i.jsx(
|
|
26
|
+
o.Indicator,
|
|
27
|
+
{
|
|
28
|
+
className: g({ style: t, indeterminateState: a === null })
|
|
29
|
+
}
|
|
30
|
+
)
|
|
31
|
+
}
|
|
32
|
+
)
|
|
33
|
+
);
|
|
34
|
+
p.displayName = "LoadingBar";
|
|
35
|
+
export {
|
|
36
|
+
p as LoadingBar
|
|
37
|
+
};
|
|
38
|
+
//# sourceMappingURL=fondue-components5.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fondue-components5.js","sources":["../src/components/LoadingBar/LoadingBar.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport * as ProgressRadixPrimitive from '@radix-ui/react-progress';\nimport { type CSSProperties, forwardRef, type ElementRef } from 'react';\n\nimport { loadingBarContainerStyles, loadingBarStyles } from './styles/loadingBarStyles';\n\nexport type LoadingBarProps = {\n /**\n * The current value of the loading bar. If `null`, the loading bar will be in an indeterminate state.\n * @default null\n */\n value: number | null;\n /**\n * @default 100\n */\n max?: number;\n /**\n * @default 'fondue-loading-bar'\n */\n 'data-test-id'?: string;\n /**\n * @default true\n */\n rounded?: boolean;\n /**\n * @default 'default'\n */\n style?: 'default' | 'positive' | 'negative';\n /**\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large' | 'x-large';\n getValueLabel?: (value: number, max: number) => string;\n} & ({ 'aria-label': string } | { 'aria-labelledby': string });\n\nexport const LoadingBar = forwardRef<ElementRef<typeof ProgressRadixPrimitive.Root>, LoadingBarProps>(\n (\n {\n value,\n max = 100,\n rounded = true,\n style = 'default',\n size = 'medium',\n 'data-test-id': dataTestId = 'fondue-loading-bar',\n ...props\n },\n ref,\n ) => {\n return (\n <ProgressRadixPrimitive.Root\n ref={ref}\n data-test-id={dataTestId}\n className={loadingBarContainerStyles({ rounded, size, style })}\n aria-busy={value !== max}\n value={value}\n max={max}\n style={value ? ({ '--loading-bar-value': `${value}%` } as CSSProperties) : {}}\n {...props}\n >\n <ProgressRadixPrimitive.Indicator\n className={loadingBarStyles({ style, indeterminateState: value === null })}\n />\n </ProgressRadixPrimitive.Root>\n );\n },\n);\nLoadingBar.displayName = 'LoadingBar';\n"],"names":["LoadingBar","forwardRef","value","max","rounded","style","size","dataTestId","props","ref","jsx","ProgressRadixPrimitive","loadingBarContainerStyles","loadingBarStyles"],"mappings":";;;;AAoCO,MAAMA,IAAaC;AAAA,EACtB,CACI;AAAA,IACI,OAAAC;AAAA,IACA,KAAAC,IAAM;AAAA,IACN,SAAAC,IAAU;AAAA,IACV,OAAAC,IAAQ;AAAA,IACR,MAAAC,IAAO;AAAA,IACP,gBAAgBC,IAAa;AAAA,IAC7B,GAAGC;AAAA,KAEPC,MAGIC,gBAAAA,EAAA;AAAA,IAACC,EAAuB;AAAA,IAAvB;AAAA,MACG,KAAAF;AAAA,MACA,gBAAcF;AAAA,MACd,WAAWK,EAA0B,EAAE,SAAAR,GAAS,MAAAE,GAAM,OAAAD,GAAO;AAAA,MAC7D,aAAWH,MAAUC;AAAA,MACrB,OAAAD;AAAA,MACA,KAAAC;AAAA,MACA,OAAOD,IAAS,EAAE,uBAAuB,GAAGA,CAAK,IAAA,IAA0B,CAAC;AAAA,MAC3E,GAAGM;AAAA,MAEJ,UAAAE,gBAAAA,EAAA;AAAA,QAACC,EAAuB;AAAA,QAAvB;AAAA,UACG,WAAWE,EAAiB,EAAE,OAAAR,GAAO,oBAAoBH,MAAU,MAAM;AAAA,QAAA;AAAA,MAC7E;AAAA,IAAA;AAAA,EAAA;AAIhB;AACAF,EAAW,cAAc;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { __module as e } from "./fondue-components12.js";
|
|
2
|
+
import { __require as r } from "./fondue-components13.js";
|
|
3
|
+
import { __require as o } from "./fondue-components14.js";
|
|
4
|
+
process.env.NODE_ENV === "production" ? e.exports = r() : e.exports = o();
|
|
5
|
+
var m = e.exports;
|
|
6
|
+
export {
|
|
7
|
+
m as j
|
|
8
|
+
};
|
|
9
|
+
//# sourceMappingURL=fondue-components6.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fondue-components6.js","sources":["../../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js"],"sourcesContent":["'use strict';\n\nif (process.env.NODE_ENV === 'production') {\n module.exports = require('./cjs/react-jsx-runtime.production.min.js');\n} else {\n module.exports = require('./cjs/react-jsx-runtime.development.js');\n}\n"],"names":["jsxRuntimeModule","require$$0","require$$1"],"mappings":";;;AAEI,QAAQ,IAAI,aAAa,eAC3BA,EAAA,UAAiBC,MAEjBD,EAAA,UAAiBE;;","x_google_ignoreList":[0]}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import { sv as t } from "./fondue-components11.js";
|
|
2
|
+
const o = {
|
|
3
|
+
small: 16,
|
|
4
|
+
medium: 20,
|
|
5
|
+
large: 24
|
|
6
|
+
}, r = t({
|
|
7
|
+
base: "tw-group tw-border tw-box-box tw-relative tw-flex tw-items-center tw-justify-center tw-cursor-pointer tw-outline-none tw-font-body tw-font-medium",
|
|
8
|
+
variants: {
|
|
9
|
+
disabled: {
|
|
10
|
+
true: "tw-not-allowed tw-pointer-events-none tw-border-transparent tw-text-box-disabled-inverse tw-bg-box-disabled"
|
|
11
|
+
},
|
|
12
|
+
rounding: {
|
|
13
|
+
medium: "tw-rounded",
|
|
14
|
+
full: "tw-rounded-full"
|
|
15
|
+
},
|
|
16
|
+
size: {
|
|
17
|
+
small: "tw-px-2 tw-h-6 tw-text-body-small",
|
|
18
|
+
medium: "tw-px-4 tw-h-9 tw-text-body-medium",
|
|
19
|
+
large: "tw-px-6 tw-h-12 tw-text-body-large"
|
|
20
|
+
},
|
|
21
|
+
iconOnly: {
|
|
22
|
+
true: "tw-aspect-square tw-px-0"
|
|
23
|
+
},
|
|
24
|
+
hugWidth: {
|
|
25
|
+
false: "tw-w-full"
|
|
26
|
+
},
|
|
27
|
+
emphasis: {
|
|
28
|
+
default: "",
|
|
29
|
+
weak: "",
|
|
30
|
+
strong: ""
|
|
31
|
+
},
|
|
32
|
+
style: {
|
|
33
|
+
default: "",
|
|
34
|
+
positive: "",
|
|
35
|
+
negative: "",
|
|
36
|
+
danger: "",
|
|
37
|
+
loud: ""
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
compoundVariants: [
|
|
41
|
+
{
|
|
42
|
+
style: "default",
|
|
43
|
+
emphasis: "default",
|
|
44
|
+
class: "tw-bg-button-background tw-border-button-border hover:tw-bg-button-background-hover active:tw-bg-button-background-pressed"
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
style: "default",
|
|
48
|
+
emphasis: "weak",
|
|
49
|
+
class: "tw-border-transparent hover:tw-bg-button-background-hover hover:tw-border-button-border active:tw-bg-button-background-pressed"
|
|
50
|
+
},
|
|
51
|
+
{
|
|
52
|
+
style: "default",
|
|
53
|
+
emphasis: "strong",
|
|
54
|
+
class: "tw-bg-button-strong-background tw-border-button-strong-border hover:tw-bg-button-strong-background-hover active:tw-bg-button-strong-background-pressed"
|
|
55
|
+
},
|
|
56
|
+
{
|
|
57
|
+
style: "positive",
|
|
58
|
+
emphasis: "default",
|
|
59
|
+
class: "tw-bg-button-positive-background tw-border-button-positive-border hover:tw-bg-button-positive-background-hover active:tw-bg-button-positive-background-pressed"
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
style: "positive",
|
|
63
|
+
emphasis: "weak",
|
|
64
|
+
class: "tw-border-transparent hover:tw-bg-button-positive-background-hover hover:tw-border-button-positive-border active:tw-bg-button-positive-background-pressed"
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
style: "positive",
|
|
68
|
+
emphasis: "strong",
|
|
69
|
+
class: "tw-bg-button-strong-positive-background tw-border-button-strong-positive-border hover:tw-bg-button-strong-positive-background-hover active:tw-bg-button-strong-positive-background-pressed"
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
style: "negative",
|
|
73
|
+
emphasis: "default",
|
|
74
|
+
class: "tw-bg-button-negative-background tw-border-button-negative-border hover:tw-bg-button-negative-background-hover active:tw-bg-button-negative-background-pressed"
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
style: "negative",
|
|
78
|
+
emphasis: "weak",
|
|
79
|
+
class: "tw-border-transparent hover:tw-bg-button-negative-background-hover hover:tw-border-button-negative-border active:tw-bg-button-negative-background-pressed"
|
|
80
|
+
},
|
|
81
|
+
{
|
|
82
|
+
style: "negative",
|
|
83
|
+
emphasis: "strong",
|
|
84
|
+
class: "tw-bg-button-strong-negative-background tw-border-button-strong-negative-border hover:tw-bg-button-strong-negative-background-hover active:tw-bg-button-strong-negative-background-pressed"
|
|
85
|
+
},
|
|
86
|
+
{
|
|
87
|
+
style: "danger",
|
|
88
|
+
emphasis: "default",
|
|
89
|
+
class: "tw-bg-button-background tw-border-button-border hover:tw-bg-button-background-hover active:tw-bg-button-background-pressed"
|
|
90
|
+
},
|
|
91
|
+
{
|
|
92
|
+
style: "danger",
|
|
93
|
+
emphasis: "weak",
|
|
94
|
+
class: "tw-border-transparent hover:tw-bg-button-background-hover active:tw-bg-button-background-pressed"
|
|
95
|
+
},
|
|
96
|
+
{
|
|
97
|
+
style: "danger",
|
|
98
|
+
emphasis: "strong",
|
|
99
|
+
class: "tw-bg-button-danger-background tw-border-button-danger-border hover:tw-bg-button-danger-background-hover active:tw-bg-button-danger-background-pressed"
|
|
100
|
+
},
|
|
101
|
+
{
|
|
102
|
+
style: "loud",
|
|
103
|
+
emphasis: "default",
|
|
104
|
+
class: "tw-bg-box-selected tw-border-button-border hover:tw-bg-box-selected-hover active:tw-bg-box-selected-pressed "
|
|
105
|
+
},
|
|
106
|
+
{
|
|
107
|
+
style: "loud",
|
|
108
|
+
emphasis: "weak",
|
|
109
|
+
class: "tw-border-transparent hover:tw-bg-box-selected-hover active:tw-bg-box-selected-pressed"
|
|
110
|
+
},
|
|
111
|
+
{
|
|
112
|
+
style: "loud",
|
|
113
|
+
emphasis: "strong",
|
|
114
|
+
class: "tw-bg-box-selected-strong tw-border-box-selected-strong hover:tw-bg-box-selected-strong-hover active:tw-bg-box-selected-strong-pressed "
|
|
115
|
+
}
|
|
116
|
+
],
|
|
117
|
+
defaultVariants: {
|
|
118
|
+
style: "default",
|
|
119
|
+
emphasis: "strong",
|
|
120
|
+
size: "medium",
|
|
121
|
+
rounding: "medium",
|
|
122
|
+
hugWidth: !0
|
|
123
|
+
}
|
|
124
|
+
});
|
|
125
|
+
export {
|
|
126
|
+
o as buttonIconSizeMap,
|
|
127
|
+
r as buttonStyles
|
|
128
|
+
};
|
|
129
|
+
//# sourceMappingURL=fondue-components7.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fondue-components7.js","sources":["../src/components/Button/styles/buttonStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type FondueIconProps } from '@frontify/fondue-icons';\n\nimport { sv } from '#/utilities/styleUtilities';\n\nimport { type ButtonProps } from '../Button';\n\nexport const buttonIconSizeMap: { [buttonSize in Exclude<ButtonProps['size'], undefined>]: FondueIconProps['size'] } = {\n small: 16,\n medium: 20,\n large: 24,\n};\n\nexport const buttonStyles = sv({\n base: 'tw-group tw-border tw-box-box tw-relative tw-flex tw-items-center tw-justify-center tw-cursor-pointer tw-outline-none tw-font-body tw-font-medium',\n variants: {\n disabled: {\n true: 'tw-not-allowed tw-pointer-events-none tw-border-transparent tw-text-box-disabled-inverse tw-bg-box-disabled',\n },\n rounding: {\n medium: 'tw-rounded',\n full: 'tw-rounded-full',\n },\n size: {\n small: 'tw-px-2 tw-h-6 tw-text-body-small',\n medium: 'tw-px-4 tw-h-9 tw-text-body-medium',\n large: 'tw-px-6 tw-h-12 tw-text-body-large',\n },\n iconOnly: {\n true: 'tw-aspect-square tw-px-0',\n },\n hugWidth: {\n false: 'tw-w-full',\n },\n emphasis: {\n default: '',\n weak: '',\n strong: '',\n },\n style: {\n default: '',\n positive: '',\n negative: '',\n danger: '',\n loud: '',\n },\n },\n compoundVariants: [\n {\n style: 'default',\n emphasis: 'default',\n class:\n 'tw-bg-button-background tw-border-button-border ' +\n 'hover:tw-bg-button-background-hover ' +\n 'active:tw-bg-button-background-pressed',\n },\n {\n style: 'default',\n emphasis: 'weak',\n class:\n 'tw-border-transparent ' +\n 'hover:tw-bg-button-background-hover hover:tw-border-button-border ' +\n 'active:tw-bg-button-background-pressed',\n },\n {\n style: 'default',\n emphasis: 'strong',\n class:\n 'tw-bg-button-strong-background tw-border-button-strong-border ' +\n 'hover:tw-bg-button-strong-background-hover ' +\n 'active:tw-bg-button-strong-background-pressed',\n },\n {\n style: 'positive',\n emphasis: 'default',\n class:\n 'tw-bg-button-positive-background tw-border-button-positive-border ' +\n 'hover:tw-bg-button-positive-background-hover ' +\n 'active:tw-bg-button-positive-background-pressed',\n },\n {\n style: 'positive',\n emphasis: 'weak',\n class:\n 'tw-border-transparent ' +\n 'hover:tw-bg-button-positive-background-hover hover:tw-border-button-positive-border ' +\n 'active:tw-bg-button-positive-background-pressed',\n },\n {\n style: 'positive',\n emphasis: 'strong',\n class:\n 'tw-bg-button-strong-positive-background tw-border-button-strong-positive-border ' +\n 'hover:tw-bg-button-strong-positive-background-hover ' +\n 'active:tw-bg-button-strong-positive-background-pressed',\n },\n {\n style: 'negative',\n emphasis: 'default',\n class:\n 'tw-bg-button-negative-background tw-border-button-negative-border ' +\n 'hover:tw-bg-button-negative-background-hover ' +\n 'active:tw-bg-button-negative-background-pressed',\n },\n {\n style: 'negative',\n emphasis: 'weak',\n class:\n 'tw-border-transparent ' +\n 'hover:tw-bg-button-negative-background-hover hover:tw-border-button-negative-border ' +\n 'active:tw-bg-button-negative-background-pressed',\n },\n {\n style: 'negative',\n emphasis: 'strong',\n class:\n 'tw-bg-button-strong-negative-background tw-border-button-strong-negative-border ' +\n 'hover:tw-bg-button-strong-negative-background-hover ' +\n 'active:tw-bg-button-strong-negative-background-pressed',\n },\n {\n style: 'danger',\n emphasis: 'default',\n class:\n 'tw-bg-button-background tw-border-button-border ' +\n 'hover:tw-bg-button-background-hover ' +\n 'active:tw-bg-button-background-pressed',\n },\n {\n style: 'danger',\n emphasis: 'weak',\n class:\n 'tw-border-transparent ' +\n 'hover:tw-bg-button-background-hover ' +\n 'active:tw-bg-button-background-pressed',\n },\n {\n style: 'danger',\n emphasis: 'strong',\n class:\n 'tw-bg-button-danger-background tw-border-button-danger-border ' +\n 'hover:tw-bg-button-danger-background-hover ' +\n 'active:tw-bg-button-danger-background-pressed',\n },\n {\n style: 'loud',\n emphasis: 'default',\n class:\n 'tw-bg-box-selected tw-border-button-border ' +\n 'hover:tw-bg-box-selected-hover ' +\n 'active:tw-bg-box-selected-pressed ',\n },\n {\n style: 'loud',\n emphasis: 'weak',\n class: 'tw-border-transparent hover:tw-bg-box-selected-hover active:tw-bg-box-selected-pressed',\n },\n {\n style: 'loud',\n emphasis: 'strong',\n class:\n 'tw-bg-box-selected-strong tw-border-box-selected-strong ' +\n 'hover:tw-bg-box-selected-strong-hover ' +\n 'active:tw-bg-box-selected-strong-pressed ',\n },\n ],\n defaultVariants: {\n style: 'default',\n emphasis: 'strong',\n size: 'medium',\n rounding: 'medium',\n hugWidth: true,\n },\n});\n"],"names":["buttonIconSizeMap","buttonStyles","sv"],"mappings":";AAQO,MAAMA,IAA0G;AAAA,EACnH,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACX,GAEaC,IAAeC,EAAG;AAAA,EAC3B,MAAM;AAAA,EACN,UAAU;AAAA,IACN,UAAU;AAAA,MACN,MAAM;AAAA,IACV;AAAA,IACA,UAAU;AAAA,MACN,QAAQ;AAAA,MACR,MAAM;AAAA,IACV;AAAA,IACA,MAAM;AAAA,MACF,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,IACX;AAAA,IACA,UAAU;AAAA,MACN,MAAM;AAAA,IACV;AAAA,IACA,UAAU;AAAA,MACN,OAAO;AAAA,IACX;AAAA,IACA,UAAU;AAAA,MACN,SAAS;AAAA,MACT,MAAM;AAAA,MACN,QAAQ;AAAA,IACZ;AAAA,IACA,OAAO;AAAA,MACH,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,MAAM;AAAA,IACV;AAAA,EACJ;AAAA,EACA,kBAAkB;AAAA,IACd;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OAAO;AAAA,IACX;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,EACJ;AAAA,EACA,iBAAiB;AAAA,IACb,OAAO;AAAA,IACP,UAAU;AAAA,IACV,MAAM;AAAA,IACN,UAAU;AAAA,IACV,UAAU;AAAA,EACd;AACJ,CAAC;"}
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import { sv as t } from "./fondue-components11.js";
|
|
2
|
+
const o = t({
|
|
3
|
+
variants: {
|
|
4
|
+
iconSpacing: {
|
|
5
|
+
none: "",
|
|
6
|
+
small: "tw--ml-0.5 tw-mr-1",
|
|
7
|
+
medium: "tw--ml-1 tw-mr-1.5",
|
|
8
|
+
large: "tw--ml-1 tw-mr-2"
|
|
9
|
+
},
|
|
10
|
+
emphasis: {
|
|
11
|
+
default: "",
|
|
12
|
+
weak: "",
|
|
13
|
+
strong: ""
|
|
14
|
+
},
|
|
15
|
+
style: {
|
|
16
|
+
default: "",
|
|
17
|
+
positive: "",
|
|
18
|
+
negative: "",
|
|
19
|
+
danger: "",
|
|
20
|
+
loud: ""
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
compoundVariants: [
|
|
24
|
+
{
|
|
25
|
+
style: "default",
|
|
26
|
+
emphasis: "default",
|
|
27
|
+
class: "tw-text-button-icon group-hover:tw-text-button-icon-hover group-active:tw-text-button-icon-pressed tw-leading-none"
|
|
28
|
+
},
|
|
29
|
+
{
|
|
30
|
+
style: "default",
|
|
31
|
+
emphasis: "weak",
|
|
32
|
+
class: "tw-text-button-icon group-hover:tw-text-button-icon-hover group-active:tw-text-button-icon-pressed tw-leading-none"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
style: "default",
|
|
36
|
+
emphasis: "strong",
|
|
37
|
+
class: "tw-text-button-strong-icon group-hover:tw-text-button-strong-icon-hover group-active:tw-text-button-strong-icon-pressed tw-leading-none"
|
|
38
|
+
},
|
|
39
|
+
{
|
|
40
|
+
style: "positive",
|
|
41
|
+
emphasis: "default",
|
|
42
|
+
class: "tw-text-button-positive-icon group-hover:tw-text-button-positive-icon-hover group-active:tw-text-button-positive-icon-pressed tw-leading-none"
|
|
43
|
+
},
|
|
44
|
+
{
|
|
45
|
+
style: "positive",
|
|
46
|
+
emphasis: "weak",
|
|
47
|
+
class: "tw-text-button-strong-positive-icon group-hover:tw-text-button-strong-positive-icon-hovergroup-active:tw-text-button-strong-positive-icon-pressed tw-leading-none"
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
style: "positive",
|
|
51
|
+
emphasis: "strong",
|
|
52
|
+
class: "tw-text-button-strong-positive-icon group-hover:tw-text-button-strong-positive-icon-hover group-active:tw-text-button-strong-positive-icon-pressed tw-leading-none"
|
|
53
|
+
},
|
|
54
|
+
{
|
|
55
|
+
style: "negative",
|
|
56
|
+
emphasis: "default",
|
|
57
|
+
class: "tw-text-button-negative-icon group-hover:tw-text-button-negative-icon-hovergroup-active:tw-text-button-negative-icon-pressed tw-leading-none"
|
|
58
|
+
},
|
|
59
|
+
{
|
|
60
|
+
style: "negative",
|
|
61
|
+
emphasis: "weak",
|
|
62
|
+
class: "tw-text-button-negative-icon group-hover:tw-text-button-negative-icon-hovergroup-active:tw-text-button-negative-icon-pressed tw-leading-none"
|
|
63
|
+
},
|
|
64
|
+
{
|
|
65
|
+
style: "negative",
|
|
66
|
+
emphasis: "strong",
|
|
67
|
+
class: "tw-text-button-strong-negative-icon group-hover:tw-text-button-strong-negative-icon-hovergroup-active:tw-text-button-strong-negative-icon-pressed tw-leading-none"
|
|
68
|
+
},
|
|
69
|
+
{
|
|
70
|
+
style: "danger",
|
|
71
|
+
emphasis: "default",
|
|
72
|
+
class: "tw-text-button-negative-icon group-hover:tw-text-button-negative-icon-hovergroup-active:tw-text-button-negative-icon-pressed tw-leading-none"
|
|
73
|
+
},
|
|
74
|
+
{
|
|
75
|
+
style: "danger",
|
|
76
|
+
emphasis: "weak",
|
|
77
|
+
class: "tw-text-button-negative-icon group-hover:tw-text-button-negative-icon-hovergroup-active:tw-text-button-negative-icon-pressed tw-leading-none"
|
|
78
|
+
},
|
|
79
|
+
{
|
|
80
|
+
style: "danger",
|
|
81
|
+
emphasis: "strong",
|
|
82
|
+
class: "tw-text-button-danger-icon group-hover:tw-text-button-danger-icon-hovergroup-active:tw-text-button-danger-icon-pressed tw-leading-none"
|
|
83
|
+
},
|
|
84
|
+
{
|
|
85
|
+
style: "loud",
|
|
86
|
+
emphasis: "default",
|
|
87
|
+
class: "tw-text-box-selected-inverse group-hover:tw-text-box-selected-inverse-hovergroup-active:tw-text-box-selected-inverse-pressed tw-leading-none"
|
|
88
|
+
},
|
|
89
|
+
{
|
|
90
|
+
style: "loud",
|
|
91
|
+
emphasis: "weak",
|
|
92
|
+
class: "tw-text-box-selected-inverse group-hover:tw-text-box-selected-inverse-hovergroup-active:tw-text-box-selected-inverse-pressed tw-leading-none"
|
|
93
|
+
},
|
|
94
|
+
{
|
|
95
|
+
style: "loud",
|
|
96
|
+
emphasis: "strong",
|
|
97
|
+
class: "tw-text-box-selected-strong-inverse group-hover:tw-text-box-selected-strong-inversegroup-active:tw-text-box-selected-strong-inverse tw-leading-none"
|
|
98
|
+
}
|
|
99
|
+
],
|
|
100
|
+
defaultVariants: {
|
|
101
|
+
emphasis: "strong",
|
|
102
|
+
style: "default"
|
|
103
|
+
}
|
|
104
|
+
});
|
|
105
|
+
export {
|
|
106
|
+
o as iconStyles
|
|
107
|
+
};
|
|
108
|
+
//# sourceMappingURL=fondue-components8.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fondue-components8.js","sources":["../src/components/Button/styles/iconStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { sv } from '#/utilities/styleUtilities';\n\nexport const iconStyles = sv({\n variants: {\n iconSpacing: {\n none: '',\n small: 'tw--ml-0.5 tw-mr-1',\n medium: 'tw--ml-1 tw-mr-1.5',\n large: 'tw--ml-1 tw-mr-2',\n },\n emphasis: {\n default: '',\n weak: '',\n strong: '',\n },\n style: {\n default: '',\n positive: '',\n negative: '',\n danger: '',\n loud: '',\n },\n },\n compoundVariants: [\n {\n style: 'default',\n emphasis: 'default',\n class:\n 'tw-text-button-icon ' +\n 'group-hover:tw-text-button-icon-hover ' +\n 'group-active:tw-text-button-icon-pressed tw-leading-none',\n },\n {\n style: 'default',\n emphasis: 'weak',\n class:\n 'tw-text-button-icon ' +\n 'group-hover:tw-text-button-icon-hover ' +\n 'group-active:tw-text-button-icon-pressed tw-leading-none',\n },\n {\n style: 'default',\n emphasis: 'strong',\n class:\n 'tw-text-button-strong-icon ' +\n 'group-hover:tw-text-button-strong-icon-hover ' +\n 'group-active:tw-text-button-strong-icon-pressed tw-leading-none',\n },\n {\n style: 'positive',\n emphasis: 'default',\n class:\n 'tw-text-button-positive-icon ' +\n 'group-hover:tw-text-button-positive-icon-hover ' +\n 'group-active:tw-text-button-positive-icon-pressed tw-leading-none',\n },\n {\n style: 'positive',\n emphasis: 'weak',\n class:\n 'tw-text-button-strong-positive-icon ' +\n 'group-hover:tw-text-button-strong-positive-icon-hover' +\n 'group-active:tw-text-button-strong-positive-icon-pressed tw-leading-none',\n },\n {\n style: 'positive',\n emphasis: 'strong',\n class:\n 'tw-text-button-strong-positive-icon ' +\n 'group-hover:tw-text-button-strong-positive-icon-hover ' +\n 'group-active:tw-text-button-strong-positive-icon-pressed tw-leading-none',\n },\n {\n style: 'negative',\n emphasis: 'default',\n class:\n 'tw-text-button-negative-icon ' +\n 'group-hover:tw-text-button-negative-icon-hover' +\n 'group-active:tw-text-button-negative-icon-pressed tw-leading-none',\n },\n {\n style: 'negative',\n emphasis: 'weak',\n class:\n 'tw-text-button-negative-icon ' +\n 'group-hover:tw-text-button-negative-icon-hover' +\n 'group-active:tw-text-button-negative-icon-pressed tw-leading-none',\n },\n {\n style: 'negative',\n emphasis: 'strong',\n class:\n 'tw-text-button-strong-negative-icon ' +\n 'group-hover:tw-text-button-strong-negative-icon-hover' +\n 'group-active:tw-text-button-strong-negative-icon-pressed tw-leading-none',\n },\n {\n style: 'danger',\n emphasis: 'default',\n class:\n 'tw-text-button-negative-icon ' +\n 'group-hover:tw-text-button-negative-icon-hover' +\n 'group-active:tw-text-button-negative-icon-pressed tw-leading-none',\n },\n {\n style: 'danger',\n emphasis: 'weak',\n class:\n 'tw-text-button-negative-icon ' +\n 'group-hover:tw-text-button-negative-icon-hover' +\n 'group-active:tw-text-button-negative-icon-pressed tw-leading-none',\n },\n {\n style: 'danger',\n emphasis: 'strong',\n class:\n 'tw-text-button-danger-icon ' +\n 'group-hover:tw-text-button-danger-icon-hover' +\n 'group-active:tw-text-button-danger-icon-pressed tw-leading-none',\n },\n {\n style: 'loud',\n emphasis: 'default',\n class:\n 'tw-text-box-selected-inverse ' +\n 'group-hover:tw-text-box-selected-inverse-hover' +\n 'group-active:tw-text-box-selected-inverse-pressed tw-leading-none',\n },\n {\n style: 'loud',\n emphasis: 'weak',\n class:\n 'tw-text-box-selected-inverse ' +\n 'group-hover:tw-text-box-selected-inverse-hover' +\n 'group-active:tw-text-box-selected-inverse-pressed tw-leading-none',\n },\n {\n style: 'loud',\n emphasis: 'strong',\n class:\n 'tw-text-box-selected-strong-inverse ' +\n 'group-hover:tw-text-box-selected-strong-inverse' +\n 'group-active:tw-text-box-selected-strong-inverse tw-leading-none',\n },\n ],\n defaultVariants: {\n emphasis: 'strong',\n style: 'default',\n },\n});\n"],"names":["iconStyles","sv"],"mappings":";AAIO,MAAMA,IAAaC,EAAG;AAAA,EACzB,UAAU;AAAA,IACN,aAAa;AAAA,MACT,MAAM;AAAA,MACN,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,IACX;AAAA,IACA,UAAU;AAAA,MACN,SAAS;AAAA,MACT,MAAM;AAAA,MACN,QAAQ;AAAA,IACZ;AAAA,IACA,OAAO;AAAA,MACH,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,MAAM;AAAA,IACV;AAAA,EACJ;AAAA,EACA,kBAAkB;AAAA,IACd;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,EACJ;AAAA,EACA,iBAAiB;AAAA,IACb,UAAU;AAAA,IACV,OAAO;AAAA,EACX;AACJ,CAAC;"}
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import { sv as t } from "./fondue-components11.js";
|
|
2
|
+
const s = t({
|
|
3
|
+
variants: {
|
|
4
|
+
hideLabel: {
|
|
5
|
+
true: "tw-sr-only"
|
|
6
|
+
},
|
|
7
|
+
emphasis: {
|
|
8
|
+
default: "",
|
|
9
|
+
weak: "",
|
|
10
|
+
strong: ""
|
|
11
|
+
},
|
|
12
|
+
style: {
|
|
13
|
+
default: "",
|
|
14
|
+
positive: "",
|
|
15
|
+
negative: "",
|
|
16
|
+
danger: "",
|
|
17
|
+
loud: ""
|
|
18
|
+
}
|
|
19
|
+
},
|
|
20
|
+
compoundVariants: [
|
|
21
|
+
{
|
|
22
|
+
style: "default",
|
|
23
|
+
emphasis: "default",
|
|
24
|
+
class: "tw-text-button-text group-hover:tw-text-button-text-hover group-active:tw-text-button-text-pressed"
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
style: "default",
|
|
28
|
+
emphasis: "weak",
|
|
29
|
+
class: "tw-text-button-text group-hover:tw-text-button-text-hover group-active:tw-text-button-text-pressed"
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
style: "default",
|
|
33
|
+
emphasis: "strong",
|
|
34
|
+
class: "tw-text-button-strong-icon group-hover:tw-text-button-strong-icon-hover group-active:tw-text-button-strong-text-pressed"
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
style: "positive",
|
|
38
|
+
emphasis: "default",
|
|
39
|
+
class: "tw-text-button-positive-text group-hover:tw-text-button-positive-text-hover group-active:tw-text-button-positive-text-pressed"
|
|
40
|
+
},
|
|
41
|
+
{
|
|
42
|
+
style: "positive",
|
|
43
|
+
emphasis: "weak",
|
|
44
|
+
class: "tw-text-button-positive-text group-hover:tw-text-button-positive-text-hover group-active:tw-text-button-positive-text-pressed"
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
style: "positive",
|
|
48
|
+
emphasis: "strong",
|
|
49
|
+
class: "tw-text-button-strong-positive-text group-hover:tw-text-button-strong-positive-text-hover group-active:tw-text-button-strong-positive-text-pressed"
|
|
50
|
+
},
|
|
51
|
+
{
|
|
52
|
+
style: "negative",
|
|
53
|
+
emphasis: "default",
|
|
54
|
+
class: "tw-text-button-negative-text group-hover:tw-text-button-negative-text-hovergroup-active:tw-text-button-negative-text-pressed"
|
|
55
|
+
},
|
|
56
|
+
{
|
|
57
|
+
style: "negative",
|
|
58
|
+
emphasis: "weak",
|
|
59
|
+
class: "tw-text-button-negative-text group-hover:tw-text-button-negative-text-hovergroup-active:tw-text-button-negative-text-pressed"
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
style: "negative",
|
|
63
|
+
emphasis: "strong",
|
|
64
|
+
class: "tw-text-button-strong-negative-text group-hover:tw-text-button-strong-negative-text-hovergroup-active:tw-text-button-strong-negative-text-pressed"
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
style: "danger",
|
|
68
|
+
emphasis: "default",
|
|
69
|
+
class: "tw-text-button-negative-icon group-hover:tw-text-button-negative-icon-hovergroup-active:tw-text-button-negative-icon-pressed"
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
style: "danger",
|
|
73
|
+
emphasis: "weak",
|
|
74
|
+
class: "tw-text-button-negative-icon group-hover:tw-text-button-negative-icon-hovergroup-active:tw-text-button-negative-icon-pressed"
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
style: "danger",
|
|
78
|
+
emphasis: "strong",
|
|
79
|
+
class: "tw-text-button-danger-text group-hover:tw-text-button-danger-text-hovergroup-active:tw-text-button-danger-text-pressed"
|
|
80
|
+
},
|
|
81
|
+
{
|
|
82
|
+
style: "loud",
|
|
83
|
+
emphasis: "default",
|
|
84
|
+
class: "tw-text-box-selected-inverse group-hover:tw-text-box-selected-inverse-hovergroup-active:tw-text-box-selected-inverse-pressed"
|
|
85
|
+
},
|
|
86
|
+
{
|
|
87
|
+
style: "loud",
|
|
88
|
+
emphasis: "weak",
|
|
89
|
+
class: "tw-text-box-selected-inverse group-hover:tw-text-box-selected-inverse-hovergroup-active:tw-text-box-selected-inverse-pressed"
|
|
90
|
+
},
|
|
91
|
+
{
|
|
92
|
+
style: "loud",
|
|
93
|
+
emphasis: "strong",
|
|
94
|
+
class: "tw-text-box-selected-strong-inverse group-hover:tw-text-box-selected-strong-inversegroup-active:tw-text-box-selected-strong-inverse"
|
|
95
|
+
}
|
|
96
|
+
],
|
|
97
|
+
defaultVariants: {
|
|
98
|
+
emphasis: "strong",
|
|
99
|
+
style: "default"
|
|
100
|
+
}
|
|
101
|
+
});
|
|
102
|
+
export {
|
|
103
|
+
s as textStyles
|
|
104
|
+
};
|
|
105
|
+
//# sourceMappingURL=fondue-components9.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fondue-components9.js","sources":["../src/components/Button/styles/textStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { sv } from '#/utilities/styleUtilities';\n\nexport const textStyles = sv({\n variants: {\n hideLabel: {\n true: 'tw-sr-only',\n },\n emphasis: {\n default: '',\n weak: '',\n strong: '',\n },\n style: {\n default: '',\n positive: '',\n negative: '',\n danger: '',\n loud: '',\n },\n },\n compoundVariants: [\n {\n style: 'default',\n emphasis: 'default',\n class:\n 'tw-text-button-text ' +\n 'group-hover:tw-text-button-text-hover ' +\n 'group-active:tw-text-button-text-pressed',\n },\n {\n style: 'default',\n emphasis: 'weak',\n class:\n 'tw-text-button-text ' +\n 'group-hover:tw-text-button-text-hover ' +\n 'group-active:tw-text-button-text-pressed',\n },\n {\n style: 'default',\n emphasis: 'strong',\n class:\n 'tw-text-button-strong-icon ' +\n 'group-hover:tw-text-button-strong-icon-hover ' +\n 'group-active:tw-text-button-strong-text-pressed',\n },\n {\n style: 'positive',\n emphasis: 'default',\n class:\n 'tw-text-button-positive-text ' +\n 'group-hover:tw-text-button-positive-text-hover ' +\n 'group-active:tw-text-button-positive-text-pressed',\n },\n {\n style: 'positive',\n emphasis: 'weak',\n class:\n 'tw-text-button-positive-text ' +\n 'group-hover:tw-text-button-positive-text-hover ' +\n 'group-active:tw-text-button-positive-text-pressed',\n },\n {\n style: 'positive',\n emphasis: 'strong',\n class:\n 'tw-text-button-strong-positive-text ' +\n 'group-hover:tw-text-button-strong-positive-text-hover ' +\n 'group-active:tw-text-button-strong-positive-text-pressed',\n },\n {\n style: 'negative',\n emphasis: 'default',\n class:\n 'tw-text-button-negative-text ' +\n 'group-hover:tw-text-button-negative-text-hover' +\n 'group-active:tw-text-button-negative-text-pressed',\n },\n {\n style: 'negative',\n emphasis: 'weak',\n class:\n 'tw-text-button-negative-text ' +\n 'group-hover:tw-text-button-negative-text-hover' +\n 'group-active:tw-text-button-negative-text-pressed',\n },\n {\n style: 'negative',\n emphasis: 'strong',\n class:\n 'tw-text-button-strong-negative-text ' +\n 'group-hover:tw-text-button-strong-negative-text-hover' +\n 'group-active:tw-text-button-strong-negative-text-pressed',\n },\n {\n style: 'danger',\n emphasis: 'default',\n class:\n 'tw-text-button-negative-icon ' +\n 'group-hover:tw-text-button-negative-icon-hover' +\n 'group-active:tw-text-button-negative-icon-pressed',\n },\n {\n style: 'danger',\n emphasis: 'weak',\n class:\n 'tw-text-button-negative-icon ' +\n 'group-hover:tw-text-button-negative-icon-hover' +\n 'group-active:tw-text-button-negative-icon-pressed',\n },\n {\n style: 'danger',\n emphasis: 'strong',\n class:\n 'tw-text-button-danger-text ' +\n 'group-hover:tw-text-button-danger-text-hover' +\n 'group-active:tw-text-button-danger-text-pressed',\n },\n {\n style: 'loud',\n emphasis: 'default',\n class:\n 'tw-text-box-selected-inverse ' +\n 'group-hover:tw-text-box-selected-inverse-hover' +\n 'group-active:tw-text-box-selected-inverse-pressed',\n },\n {\n style: 'loud',\n emphasis: 'weak',\n class:\n 'tw-text-box-selected-inverse ' +\n 'group-hover:tw-text-box-selected-inverse-hover' +\n 'group-active:tw-text-box-selected-inverse-pressed',\n },\n {\n style: 'loud',\n emphasis: 'strong',\n class:\n 'tw-text-box-selected-strong-inverse ' +\n 'group-hover:tw-text-box-selected-strong-inverse' +\n 'group-active:tw-text-box-selected-strong-inverse',\n },\n ],\n defaultVariants: {\n emphasis: 'strong',\n style: 'default',\n },\n});\n"],"names":["textStyles","sv"],"mappings":";AAIO,MAAMA,IAAaC,EAAG;AAAA,EACzB,UAAU;AAAA,IACN,WAAW;AAAA,MACP,MAAM;AAAA,IACV;AAAA,IACA,UAAU;AAAA,MACN,SAAS;AAAA,MACT,MAAM;AAAA,MACN,QAAQ;AAAA,IACZ;AAAA,IACA,OAAO;AAAA,MACH,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,MAAM;AAAA,IACV;AAAA,EACJ;AAAA,EACA,kBAAkB;AAAA,IACd;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,IACA;AAAA,MACI,OAAO;AAAA,MACP,UAAU;AAAA,MACV,OACI;AAAA,IAGR;AAAA,EACJ;AAAA,EACA,iBAAiB;AAAA,IACb,UAAU;AAAA,IACV,OAAO;AAAA,EACX;AACJ,CAAC;"}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
|
|
3
|
+
import { ForwardRefExoticComponent } from 'react';
|
|
4
|
+
import { MouseEvent as MouseEvent_2 } from 'react';
|
|
5
|
+
import { ReactElement } from 'react';
|
|
6
|
+
import { ReactNode } from 'react';
|
|
7
|
+
import { RefAttributes } from 'react';
|
|
8
|
+
|
|
9
|
+
export declare const Button: ForwardRefExoticComponent<ButtonProps & RefAttributes<HTMLButtonElement | null>>;
|
|
10
|
+
|
|
11
|
+
declare type ButtonEmphasis = 'default' | 'weak' | 'strong';
|
|
12
|
+
|
|
13
|
+
declare type ButtonProps = {
|
|
14
|
+
/**
|
|
15
|
+
* @default null
|
|
16
|
+
*/
|
|
17
|
+
type?: ButtonType;
|
|
18
|
+
/**
|
|
19
|
+
* @default null
|
|
20
|
+
*/
|
|
21
|
+
title?: string;
|
|
22
|
+
/**
|
|
23
|
+
* @default 'default'
|
|
24
|
+
*/
|
|
25
|
+
style?: ButtonStyle;
|
|
26
|
+
/**
|
|
27
|
+
* @default 'strong'
|
|
28
|
+
*/
|
|
29
|
+
emphasis?: ButtonEmphasis;
|
|
30
|
+
/**
|
|
31
|
+
* @default false
|
|
32
|
+
*/
|
|
33
|
+
hideLabel?: boolean;
|
|
34
|
+
/**
|
|
35
|
+
* @default 'medium'
|
|
36
|
+
*/
|
|
37
|
+
size?: ButtonSize;
|
|
38
|
+
/**
|
|
39
|
+
* @default 'medium'
|
|
40
|
+
*/
|
|
41
|
+
rounding?: ButtonRounding;
|
|
42
|
+
/**
|
|
43
|
+
* @default false
|
|
44
|
+
*/
|
|
45
|
+
disabled?: boolean;
|
|
46
|
+
/**
|
|
47
|
+
* @default true
|
|
48
|
+
*/
|
|
49
|
+
hugWidth?: boolean;
|
|
50
|
+
icon?: ReactElement;
|
|
51
|
+
children?: ReactNode;
|
|
52
|
+
onClick?: (event?: MouseEvent_2<HTMLButtonElement>) => void;
|
|
53
|
+
'aria-label'?: string;
|
|
54
|
+
'aria-describedby'?: string;
|
|
55
|
+
'data-test-id'?: string;
|
|
56
|
+
};
|
|
57
|
+
|
|
58
|
+
declare type ButtonRounding = 'medium' | 'full';
|
|
59
|
+
|
|
60
|
+
declare type ButtonSize = 'small' | 'medium' | 'large';
|
|
61
|
+
|
|
62
|
+
declare type ButtonStyle = 'default' | 'positive' | 'negative' | 'danger' | 'loud';
|
|
63
|
+
|
|
64
|
+
declare type ButtonType = 'button' | 'submit' | 'reset';
|
|
65
|
+
|
|
66
|
+
export declare const Divider: ({ vertical, style, height, "data-test-id": dataTestId, color, }: DividerProps) => ReactElement;
|
|
67
|
+
|
|
68
|
+
declare type DividerHeight = 'small' | 'medium' | 'large';
|
|
69
|
+
|
|
70
|
+
declare type DividerProps = {
|
|
71
|
+
style?: DividerStyle;
|
|
72
|
+
height?: DividerHeight;
|
|
73
|
+
color?: string;
|
|
74
|
+
vertical?: boolean;
|
|
75
|
+
'data-test-id'?: string;
|
|
76
|
+
};
|
|
77
|
+
|
|
78
|
+
declare type DividerStyle = 'noline' | 'dashed' | 'solid' | 'dotted';
|
|
79
|
+
|
|
80
|
+
export declare const LoadingBar: ForwardRefExoticComponent<LoadingBarProps & RefAttributes<HTMLDivElement>>;
|
|
81
|
+
|
|
82
|
+
declare type LoadingBarProps = {
|
|
83
|
+
/**
|
|
84
|
+
* The current value of the loading bar. If `null`, the loading bar will be in an indeterminate state.
|
|
85
|
+
* @default null
|
|
86
|
+
*/
|
|
87
|
+
value: number | null;
|
|
88
|
+
/**
|
|
89
|
+
* @default 100
|
|
90
|
+
*/
|
|
91
|
+
max?: number;
|
|
92
|
+
/**
|
|
93
|
+
* @default 'fondue-loading-bar'
|
|
94
|
+
*/
|
|
95
|
+
'data-test-id'?: string;
|
|
96
|
+
/**
|
|
97
|
+
* @default true
|
|
98
|
+
*/
|
|
99
|
+
rounded?: boolean;
|
|
100
|
+
/**
|
|
101
|
+
* @default 'default'
|
|
102
|
+
*/
|
|
103
|
+
style?: 'default' | 'positive' | 'negative';
|
|
104
|
+
/**
|
|
105
|
+
* @default 'medium'
|
|
106
|
+
*/
|
|
107
|
+
size?: 'small' | 'medium' | 'large' | 'x-large';
|
|
108
|
+
getValueLabel?: (value: number, max: number) => string;
|
|
109
|
+
} & ({
|
|
110
|
+
'aria-label': string;
|
|
111
|
+
} | {
|
|
112
|
+
'aria-labelledby': string;
|
|
113
|
+
});
|
|
114
|
+
|
|
115
|
+
export { }
|
|
116
|
+
|
|
117
|
+
|
|
118
|
+
declare module 'vitest' {
|
|
119
|
+
interface Assertion<T = any> extends jest.Matchers<void, T>, TestingLibraryMatchers<T, void> {
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
|