@frontify/fondue 12.0.0-beta.381 → 12.0.0-beta.382
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/Breadcrumbs/BreadcrumbItem.es.js +13 -13
- package/dist/components/Breadcrumbs/BreadcrumbItem.es.js.map +1 -1
- package/dist/components/Breadcrumbs/CurrentBreadcrumbItem.es.js +5 -5
- package/dist/components/Breadcrumbs/CurrentBreadcrumbItem.es.js.map +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsxs as n, jsx as
|
|
1
|
+
import { jsxs as n, jsx as t } from "react/jsx-runtime";
|
|
2
2
|
import { useRef as f } from "react";
|
|
3
3
|
import { useBreadcrumbItem as h } from "@react-aria/breadcrumbs";
|
|
4
4
|
import { useFocusRing as g } from "@react-aria/focus";
|
|
@@ -6,7 +6,7 @@ import { mergeProps as b } from "@react-aria/utils";
|
|
|
6
6
|
import { getItemElementType as y } from "../../utilities/elements.es.js";
|
|
7
7
|
import { FOCUS_STYLE_NO_OFFSET as F } from "../../utilities/focusStyle.es.js";
|
|
8
8
|
import { merge as N } from "../../utilities/merge.es.js";
|
|
9
|
-
const T = () => /* @__PURE__ */
|
|
9
|
+
const T = () => /* @__PURE__ */ t(
|
|
10
10
|
"svg",
|
|
11
11
|
{
|
|
12
12
|
"aria-hidden": "true",
|
|
@@ -16,7 +16,7 @@ const T = () => /* @__PURE__ */ e(
|
|
|
16
16
|
fill: "none",
|
|
17
17
|
className: "tw-stroke-current tw-text-black-20",
|
|
18
18
|
xmlns: "http://www.w3.org/2000/svg",
|
|
19
|
-
children: /* @__PURE__ */
|
|
19
|
+
children: /* @__PURE__ */ t("line", { x1: "3.52447", y1: "16.0623", x2: "8.46874", y2: "0.845385" })
|
|
20
20
|
}
|
|
21
21
|
), P = ({
|
|
22
22
|
decorator: i,
|
|
@@ -24,31 +24,31 @@ const T = () => /* @__PURE__ */ e(
|
|
|
24
24
|
link: s,
|
|
25
25
|
onClick: o,
|
|
26
26
|
showSeparator: a,
|
|
27
|
-
children:
|
|
28
|
-
"data-test-id":
|
|
27
|
+
children: c,
|
|
28
|
+
"data-test-id": p = "breadcrumb"
|
|
29
29
|
}) => {
|
|
30
|
-
const m = f(null),
|
|
30
|
+
const m = f(null), e = y(s, o), { itemProps: l } = h(
|
|
31
31
|
{
|
|
32
32
|
isCurrent: !1,
|
|
33
33
|
children: r,
|
|
34
|
-
elementType:
|
|
34
|
+
elementType: e
|
|
35
35
|
},
|
|
36
36
|
m
|
|
37
|
-
), { isFocusVisible:
|
|
38
|
-
"tw-flex tw-gap-x-1 tw-items-center tw-leading-4 tw-h-6 tw-
|
|
39
|
-
|
|
37
|
+
), { isFocusVisible: w, focusProps: d } = g(), u = b(l, d, { a: { href: s }, button: { onClick: o, type: "button" }, span: {} }[e]), x = N([
|
|
38
|
+
"tw-flex tw-gap-x-1 tw-items-center tw-leading-4 tw-h-6 tw-whitespace-pre-wrap tw-rounded",
|
|
39
|
+
w && F
|
|
40
40
|
]);
|
|
41
41
|
return /* @__PURE__ */ n(
|
|
42
42
|
"li",
|
|
43
43
|
{
|
|
44
44
|
className: "tw-flex tw-items-center tw-text-text-weak hover:tw-text-text tw-text-xs tw-transition-colors",
|
|
45
|
-
"data-test-id": `${
|
|
45
|
+
"data-test-id": `${p}-item`,
|
|
46
46
|
children: [
|
|
47
|
-
|
|
47
|
+
c ?? /* @__PURE__ */ n(e, { ref: m, ...u, className: x, children: [
|
|
48
48
|
i,
|
|
49
49
|
r
|
|
50
50
|
] }),
|
|
51
|
-
a && /* @__PURE__ */
|
|
51
|
+
a && /* @__PURE__ */ t(T, {})
|
|
52
52
|
]
|
|
53
53
|
}
|
|
54
54
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BreadcrumbItem.es.js","sources":["../../../src/components/Breadcrumbs/BreadcrumbItem.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ReactElement, useRef } from 'react';\nimport { useBreadcrumbItem } from '@react-aria/breadcrumbs';\nimport { useFocusRing } from '@react-aria/focus';\nimport { mergeProps } from '@react-aria/utils';\n\nimport { getItemElementType } from '@utilities/elements';\nimport { FOCUS_STYLE_NO_OFFSET } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\n\nimport { Breadcrumb } from './Breadcrumbs';\n\nconst Separator = () => (\n <svg\n aria-hidden=\"true\"\n width=\"13\"\n height=\"17\"\n viewBox=\"0 0 13 17\"\n fill=\"none\"\n className=\"tw-stroke-current tw-text-black-20\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <line x1=\"3.52447\" y1=\"16.0623\" x2=\"8.46874\" y2=\"0.845385\" />\n </svg>\n);\n\ntype BreadcrumbItemProps = Pick<Breadcrumb, 'label' | 'link' | 'onClick' | 'decorator'> & {\n showSeparator: boolean;\n children?: ReactElement;\n 'data-test-id'?: string;\n};\n\nexport const BreadcrumbItem = ({\n decorator,\n label,\n link,\n onClick,\n showSeparator,\n children,\n 'data-test-id': dataTestId = 'breadcrumb',\n}: BreadcrumbItemProps): ReactElement => {\n const ref = useRef(null);\n\n const Element = getItemElementType(link, onClick);\n\n const { itemProps } = useBreadcrumbItem(\n {\n isCurrent: false,\n children: label,\n elementType: Element,\n },\n ref,\n );\n\n const { isFocusVisible, focusProps } = useFocusRing();\n\n const elementTypeProps = { a: { href: link }, button: { onClick, type: 'button' as const }, span: {} };\n const props = mergeProps(itemProps, focusProps, elementTypeProps[Element]);\n\n const classNames = merge([\n 'tw-flex tw-gap-x-1 tw-items-center tw-leading-4 tw-h-6 tw-
|
|
1
|
+
{"version":3,"file":"BreadcrumbItem.es.js","sources":["../../../src/components/Breadcrumbs/BreadcrumbItem.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ReactElement, useRef } from 'react';\nimport { useBreadcrumbItem } from '@react-aria/breadcrumbs';\nimport { useFocusRing } from '@react-aria/focus';\nimport { mergeProps } from '@react-aria/utils';\n\nimport { getItemElementType } from '@utilities/elements';\nimport { FOCUS_STYLE_NO_OFFSET } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\n\nimport { Breadcrumb } from './Breadcrumbs';\n\nconst Separator = () => (\n <svg\n aria-hidden=\"true\"\n width=\"13\"\n height=\"17\"\n viewBox=\"0 0 13 17\"\n fill=\"none\"\n className=\"tw-stroke-current tw-text-black-20\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <line x1=\"3.52447\" y1=\"16.0623\" x2=\"8.46874\" y2=\"0.845385\" />\n </svg>\n);\n\ntype BreadcrumbItemProps = Pick<Breadcrumb, 'label' | 'link' | 'onClick' | 'decorator'> & {\n showSeparator: boolean;\n children?: ReactElement;\n 'data-test-id'?: string;\n};\n\nexport const BreadcrumbItem = ({\n decorator,\n label,\n link,\n onClick,\n showSeparator,\n children,\n 'data-test-id': dataTestId = 'breadcrumb',\n}: BreadcrumbItemProps): ReactElement => {\n const ref = useRef(null);\n\n const Element = getItemElementType(link, onClick);\n\n const { itemProps } = useBreadcrumbItem(\n {\n isCurrent: false,\n children: label,\n elementType: Element,\n },\n ref,\n );\n\n const { isFocusVisible, focusProps } = useFocusRing();\n\n const elementTypeProps = { a: { href: link }, button: { onClick, type: 'button' as const }, span: {} };\n const props = mergeProps(itemProps, focusProps, elementTypeProps[Element]);\n\n const classNames = merge([\n 'tw-flex tw-gap-x-1 tw-items-center tw-leading-4 tw-h-6 tw-whitespace-pre-wrap tw-rounded',\n isFocusVisible && FOCUS_STYLE_NO_OFFSET,\n ]);\n\n return (\n <li\n className=\"tw-flex tw-items-center tw-text-text-weak hover:tw-text-text tw-text-xs tw-transition-colors\"\n data-test-id={`${dataTestId}-item`}\n >\n {children ?? (\n <Element ref={ref} {...props} className={classNames}>\n {decorator}\n {label}\n </Element>\n )}\n {showSeparator && <Separator />}\n </li>\n );\n};\nBreadcrumbItem.displayName = 'FondueBreadcrumbItem';\n"],"names":["Separator","jsx","BreadcrumbItem","decorator","label","link","onClick","showSeparator","children","dataTestId","ref","useRef","Element","getItemElementType","itemProps","useBreadcrumbItem","isFocusVisible","focusProps","useFocusRing","props","mergeProps","classNames","merge","FOCUS_STYLE_NO_OFFSET","jsxs"],"mappings":";;;;;;;;AAaA,MAAMA,IAAY,MACd,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,eAAY;AAAA,IACZ,OAAM;AAAA,IACN,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,MAAK;AAAA,IACL,WAAU;AAAA,IACV,OAAM;AAAA,IAEN,UAAA,gBAAAA,EAAC,UAAK,IAAG,WAAU,IAAG,WAAU,IAAG,WAAU,IAAG,WAAW,CAAA;AAAA,EAAA;AAC/D,GASSC,IAAiB,CAAC;AAAA,EAC3B,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,eAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAgBC,IAAa;AACjC,MAAyC;AAC/B,QAAAC,IAAMC,EAAO,IAAI,GAEjBC,IAAUC,EAAmBR,GAAMC,CAAO,GAE1C,EAAE,WAAAQ,MAAcC;AAAA,IAClB;AAAA,MACI,WAAW;AAAA,MACX,UAAUX;AAAA,MACV,aAAaQ;AAAA,IACjB;AAAA,IACAF;AAAA,EAAA,GAGE,EAAE,gBAAAM,GAAgB,YAAAC,EAAW,IAAIC,EAAa,GAG9CC,IAAQC,EAAWN,GAAWG,GADX,EAAE,GAAG,EAAE,MAAMZ,EAAK,GAAG,QAAQ,EAAE,SAAAC,GAAS,MAAM,SAAqB,GAAA,MAAM,CAAG,EAAA,EACpCM,CAAO,CAAC,GAEnES,IAAaC,EAAM;AAAA,IACrB;AAAA,IACAN,KAAkBO;AAAA,EAAA,CACrB;AAGG,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAU;AAAA,MACV,gBAAc,GAAGf,CAAU;AAAA,MAE1B,UAAA;AAAA,QAAAD,uBACII,GAAQ,EAAA,KAAAF,GAAW,GAAGS,GAAO,WAAWE,GACpC,UAAA;AAAA,UAAAlB;AAAA,UACAC;AAAA,QAAA,GACL;AAAA,QAEHG,uBAAkBP,GAAU,EAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGzC;AACAE,EAAe,cAAc;"}
|
|
@@ -15,17 +15,17 @@ const O = ({
|
|
|
15
15
|
link: m,
|
|
16
16
|
onClick: o,
|
|
17
17
|
activeInline: s,
|
|
18
|
-
"data-test-id":
|
|
18
|
+
"data-test-id": u = "breadcrumb"
|
|
19
19
|
}) => {
|
|
20
|
-
const n = F(null), e = C(m, o), { itemProps:
|
|
20
|
+
const n = F(null), e = C(m, o), { itemProps: l } = N(
|
|
21
21
|
{
|
|
22
22
|
isCurrent: !0,
|
|
23
23
|
children: r,
|
|
24
24
|
elementType: e
|
|
25
25
|
},
|
|
26
26
|
n
|
|
27
|
-
),
|
|
28
|
-
"tw-flex tw-gap-x-1 tw-items-center tw-leading-4 tw-h-6 tw-
|
|
27
|
+
), w = { a: { href: m }, button: { onClick: o, type: "button" }, span: {} }, { isFocusVisible: d, focusProps: f } = T(), x = B(l, f, w[e]), b = p([
|
|
28
|
+
"tw-flex tw-gap-x-1 tw-items-center tw-leading-4 tw-h-6 tw-whitespace-pre-wrap tw-font-medium tw-rounded",
|
|
29
29
|
c && "tw-font-bold",
|
|
30
30
|
s && "tw-text-xs",
|
|
31
31
|
d && P
|
|
@@ -37,7 +37,7 @@ const O = ({
|
|
|
37
37
|
"tw-align-middle tw-gap-x-1 tw-text-m tw-text-text tw-items-center",
|
|
38
38
|
s ? "tw-flex tw-items-center" : "tw-w-full tw-inline-flex"
|
|
39
39
|
]),
|
|
40
|
-
"data-test-id": `${
|
|
40
|
+
"data-test-id": `${u}-item`,
|
|
41
41
|
children: [
|
|
42
42
|
/* @__PURE__ */ i(e, { ref: n, ...x, className: b, children: [
|
|
43
43
|
a,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CurrentBreadcrumbItem.es.js","sources":["../../../src/components/Breadcrumbs/CurrentBreadcrumbItem.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ReactElement, useRef } from 'react';\nimport { useBreadcrumbItem } from '@react-aria/breadcrumbs';\nimport { useFocusRing } from '@react-aria/focus';\nimport { mergeProps } from '@react-aria/utils';\n\nimport { Badge } from '@components/Badge';\nimport { FOCUS_STYLE_NO_OFFSET } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { getItemElementType } from '@utilities/elements';\n\nimport { Breadcrumb } from './Breadcrumbs';\n\ntype CurrentBreadcrumbItemProps = Breadcrumb;\n\nexport const CurrentBreadcrumbItem = ({\n label,\n badges,\n bold,\n decorator,\n link,\n onClick,\n activeInline,\n 'data-test-id': dataTestId = 'breadcrumb',\n}: CurrentBreadcrumbItemProps): ReactElement => {\n const ref = useRef(null);\n const Element = getItemElementType(link, onClick);\n const { itemProps } = useBreadcrumbItem(\n {\n isCurrent: true,\n children: label,\n elementType: Element,\n },\n ref,\n );\n\n const elementTypeProps = { a: { href: link }, button: { onClick, type: 'button' as const }, span: {} };\n\n const { isFocusVisible, focusProps } = useFocusRing();\n const props = mergeProps(itemProps, focusProps, elementTypeProps[Element]);\n\n const classNames = merge([\n 'tw-flex tw-gap-x-1 tw-items-center tw-leading-4 tw-h-6 tw-
|
|
1
|
+
{"version":3,"file":"CurrentBreadcrumbItem.es.js","sources":["../../../src/components/Breadcrumbs/CurrentBreadcrumbItem.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ReactElement, useRef } from 'react';\nimport { useBreadcrumbItem } from '@react-aria/breadcrumbs';\nimport { useFocusRing } from '@react-aria/focus';\nimport { mergeProps } from '@react-aria/utils';\n\nimport { Badge } from '@components/Badge';\nimport { FOCUS_STYLE_NO_OFFSET } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { getItemElementType } from '@utilities/elements';\n\nimport { Breadcrumb } from './Breadcrumbs';\n\ntype CurrentBreadcrumbItemProps = Breadcrumb;\n\nexport const CurrentBreadcrumbItem = ({\n label,\n badges,\n bold,\n decorator,\n link,\n onClick,\n activeInline,\n 'data-test-id': dataTestId = 'breadcrumb',\n}: CurrentBreadcrumbItemProps): ReactElement => {\n const ref = useRef(null);\n const Element = getItemElementType(link, onClick);\n const { itemProps } = useBreadcrumbItem(\n {\n isCurrent: true,\n children: label,\n elementType: Element,\n },\n ref,\n );\n\n const elementTypeProps = { a: { href: link }, button: { onClick, type: 'button' as const }, span: {} };\n\n const { isFocusVisible, focusProps } = useFocusRing();\n const props = mergeProps(itemProps, focusProps, elementTypeProps[Element]);\n\n const classNames = merge([\n 'tw-flex tw-gap-x-1 tw-items-center tw-leading-4 tw-h-6 tw-whitespace-pre-wrap tw-font-medium tw-rounded',\n bold && 'tw-font-bold',\n activeInline && 'tw-text-xs',\n isFocusVisible && FOCUS_STYLE_NO_OFFSET,\n ]);\n\n return (\n <li\n className={merge([\n 'tw-align-middle tw-gap-x-1 tw-text-m tw-text-text tw-items-center',\n activeInline ? 'tw-flex tw-items-center' : 'tw-w-full tw-inline-flex',\n ])}\n data-test-id={`${dataTestId}-item`}\n >\n <Element ref={ref} {...props} className={classNames}>\n {decorator}\n {label}\n </Element>\n {badges?.map(({ children: badge, ...props }, index) => (\n <Badge {...props} key={`breadcrumb-badge-${index}`}>\n {badge}\n </Badge>\n ))}\n </li>\n );\n};\nCurrentBreadcrumbItem.displayName = 'FondueCurrentBreadcrumbItem';\n"],"names":["CurrentBreadcrumbItem","label","badges","bold","decorator","link","onClick","activeInline","dataTestId","ref","useRef","Element","getItemElementType","itemProps","useBreadcrumbItem","elementTypeProps","isFocusVisible","focusProps","useFocusRing","props","mergeProps","classNames","merge","FOCUS_STYLE_NO_OFFSET","jsxs","badge","index","createElement","Badge"],"mappings":";;;;;;;;;AAgBO,MAAMA,IAAwB,CAAC;AAAA,EAClC,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,gBAAgBC,IAAa;AACjC,MAAgD;AACtC,QAAAC,IAAMC,EAAO,IAAI,GACjBC,IAAUC,EAAmBP,GAAMC,CAAO,GAC1C,EAAE,WAAAO,MAAcC;AAAA,IAClB;AAAA,MACI,WAAW;AAAA,MACX,UAAUb;AAAA,MACV,aAAaU;AAAA,IACjB;AAAA,IACAF;AAAA,EAAA,GAGEM,IAAmB,EAAE,GAAG,EAAE,MAAMV,EAAK,GAAG,QAAQ,EAAE,SAAAC,GAAS,MAAM,SAAqB,GAAA,MAAM,CAAG,EAAA,GAE/F,EAAE,gBAAAU,GAAgB,YAAAC,EAAW,IAAIC,EAAa,GAC9CC,IAAQC,EAAWP,GAAWI,GAAYF,EAAiBJ,CAAO,CAAC,GAEnEU,IAAaC,EAAM;AAAA,IACrB;AAAA,IACAnB,KAAQ;AAAA,IACRI,KAAgB;AAAA,IAChBS,KAAkBO;AAAA,EAAA,CACrB;AAGG,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWF,EAAM;AAAA,QACb;AAAA,QACAf,IAAe,4BAA4B;AAAA,MAAA,CAC9C;AAAA,MACD,gBAAc,GAAGC,CAAU;AAAA,MAE3B,UAAA;AAAA,QAAA,gBAAAgB,EAACb,GAAQ,EAAA,KAAAF,GAAW,GAAGU,GAAO,WAAWE,GACpC,UAAA;AAAA,UAAAjB;AAAA,UACAH;AAAA,QAAA,GACL;AAAA,QACCC,KAAA,gBAAAA,EAAQ,IAAI,CAAC,EAAE,UAAUuB,GAAO,GAAGN,EAAM,GAAGO,MACxC,gBAAAC,EAAAC,GAAA,EAAO,GAAGT,GAAO,KAAK,oBAAoBO,CAAK,GAAA,GAC3CD,CACL;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAGb;AACAzB,EAAsB,cAAc;"}
|