@yamada-ui/breadcrumb 1.3.12-dev-20240923054911 → 1.3.12-dev-20240923064845
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/breadcrumb.js +10 -0
- package/dist/breadcrumb.js.map +1 -1
- package/dist/breadcrumb.mjs +1 -1
- package/dist/{chunk-YV2UQKWR.mjs → chunk-K3D3RBYU.mjs} +11 -1
- package/dist/chunk-K3D3RBYU.mjs.map +1 -0
- package/dist/index.js +10 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/package.json +5 -5
- package/dist/chunk-YV2UQKWR.mjs.map +0 -1
package/dist/breadcrumb.js
CHANGED
|
@@ -146,6 +146,8 @@ var Breadcrumb = (0, import_core.forwardRef)((props, ref) => {
|
|
|
146
146
|
}
|
|
147
147
|
) });
|
|
148
148
|
});
|
|
149
|
+
Breadcrumb.displayName = "Breadcrumb";
|
|
150
|
+
Breadcrumb.__ui__ = "Breadcrumb";
|
|
149
151
|
var BreadcrumbItem = (0, import_core.forwardRef)(
|
|
150
152
|
({
|
|
151
153
|
className,
|
|
@@ -192,6 +194,8 @@ var BreadcrumbItem = (0, import_core.forwardRef)(
|
|
|
192
194
|
);
|
|
193
195
|
}
|
|
194
196
|
);
|
|
197
|
+
BreadcrumbItem.displayName = "BreadcrumbItem";
|
|
198
|
+
BreadcrumbItem.__ui__ = "BreadcrumbItem";
|
|
195
199
|
var BreadcrumbLink = (0, import_core.forwardRef)(
|
|
196
200
|
({ className, children, isCurrentPage, href, ...rest }, ref) => {
|
|
197
201
|
const styles = useBreadcrumb();
|
|
@@ -210,6 +214,8 @@ var BreadcrumbLink = (0, import_core.forwardRef)(
|
|
|
210
214
|
);
|
|
211
215
|
}
|
|
212
216
|
);
|
|
217
|
+
BreadcrumbLink.displayName = "BreadcrumbLink";
|
|
218
|
+
BreadcrumbLink.__ui__ = "BreadcrumbLink";
|
|
213
219
|
var BreadcrumbSeparator = (0, import_core.forwardRef)(
|
|
214
220
|
({ children, gap: mx, ...rest }, ref) => {
|
|
215
221
|
const styles = useBreadcrumb();
|
|
@@ -229,6 +235,8 @@ var BreadcrumbSeparator = (0, import_core.forwardRef)(
|
|
|
229
235
|
);
|
|
230
236
|
}
|
|
231
237
|
);
|
|
238
|
+
BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
|
|
239
|
+
BreadcrumbSeparator.__ui__ = "BreadcrumbSeparator";
|
|
232
240
|
var BreadcrumbEllipsis = (0, import_core.forwardRef)(
|
|
233
241
|
({ children, className, ...rest }, ref) => {
|
|
234
242
|
const styles = useBreadcrumb();
|
|
@@ -258,6 +266,8 @@ var BreadcrumbEllipsis = (0, import_core.forwardRef)(
|
|
|
258
266
|
);
|
|
259
267
|
}
|
|
260
268
|
);
|
|
269
|
+
BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
|
|
270
|
+
BreadcrumbEllipsis.__ui__ = "BreadcrumbEllipsis";
|
|
261
271
|
// Annotate the CommonJS export names for ESM import in node:
|
|
262
272
|
0 && (module.exports = {
|
|
263
273
|
Breadcrumb,
|
package/dist/breadcrumb.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/breadcrumb.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n CSSUIProps,\n Token,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { Icon } from \"@yamada-ui/icon\"\nimport type { IconProps } from \"@yamada-ui/icon\"\nimport { useValue } from \"@yamada-ui/use-value\"\nimport {\n cx,\n createContext,\n getValidChildren,\n isNumber,\n runIfFunc,\n} from \"@yamada-ui/utils\"\nimport type { ReactNode } from \"react\"\nimport { Fragment, cloneElement, useCallback, useMemo } from \"react\"\n\nconst [BreadcrumbProvider, useBreadcrumb] = createContext<{\n [key: string]: CSSUIObject\n}>({\n name: \"BreadcrumbContext\",\n errorMessage: `useBreadcrumb returned is 'undefined'. Seems you forgot to wrap the components in \"<Breadcrumb />\" `,\n})\n\nexport interface BreadcrumbGenerateItem extends BreadcrumbLinkProps {\n name?: ReactNode\n containerProps?: Omit<BreadcrumbItemProps, \"isLastChild\">\n isEllipsisPage?: boolean\n}\n\ninterface BreadcrumbOptions {\n /**\n * The visual separator between each breadcrumb item.\n *\n * @default '/'\n */\n separator?: string | JSX.Element\n /**\n * The left and right margin applied to the separator.\n *\n * @default '2'\n */\n gap?: CSSUIProps[\"mx\"]\n /**\n * Props for ol element.\n */\n listProps?: HTMLUIProps<\"ol\">\n /**\n * If provided, generate breadcrumb items based on items.\n */\n items?: BreadcrumbGenerateItem[]\n /**\n * Number of elements visible on the start(left) edges.\n */\n startBoundaries?: Token<number>\n /**\n * Number of elements visible on the end(right) edges.\n */\n endBoundaries?: Token<number>\n /**\n * The icon to be used in the ellipsis.\n */\n ellipsis?:\n | ReactNode\n | ((props: { items: BreadcrumbGenerateItem[] }) => ReactNode)\n}\n\nexport interface BreadcrumbProps\n extends Omit<HTMLUIProps<\"nav\">, \"gap\">,\n ThemeProps<\"Breadcrumb\">,\n BreadcrumbOptions {}\n\n/**\n * `Breadcrumb` is a component that helps users understand the hierarchy of a website.\n *\n * @see Docs https://yamada-ui.com/components/navigation/breadcrumb\n */\nexport const Breadcrumb = forwardRef<BreadcrumbProps, \"nav\">((props, ref) => {\n const [styles, mergedProps] = useComponentMultiStyle(\"Breadcrumb\", props)\n\n const {\n className,\n children,\n separator = \"/\",\n gap = \"fallback(2, 0.5rem)\",\n listProps,\n items = [],\n startBoundaries: _startBoundaries,\n endBoundaries: _endBoundaries,\n ellipsis,\n ...rest\n } = omitThemeProps(mergedProps)\n let startBoundaries = useValue(_startBoundaries)\n let endBoundaries = useValue(_endBoundaries)\n\n if (startBoundaries === 0) startBoundaries = 1\n if (endBoundaries === 0) endBoundaries = 1\n\n if (startBoundaries) endBoundaries ??= 1\n if (endBoundaries) startBoundaries ??= 1\n\n const hasBoundaries = isNumber(startBoundaries) && isNumber(endBoundaries)\n const isExceed =\n hasBoundaries && startBoundaries! + endBoundaries! < items.length\n\n const css: CSSUIObject = {\n display: \"flex\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n const validChildren = getValidChildren(children)\n const hasChildren = validChildren.length\n\n const customEllipsis = useCallback(\n (providedItems?: BreadcrumbGenerateItem[]) => {\n if (!ellipsis) return null\n\n const resolvedItems =\n providedItems ??\n items.slice(startBoundaries!, items.length - endBoundaries!)\n\n return runIfFunc(ellipsis, { items: resolvedItems })\n },\n [ellipsis, endBoundaries, items, startBoundaries],\n )\n\n const cloneChildren = useMemo(() => {\n if (hasChildren) {\n return validChildren.map((child, index) =>\n cloneElement(child, {\n separator,\n gap,\n isLastChild: validChildren.length === index + 1,\n }),\n )\n } else {\n let hiddenEllipsis: BreadcrumbGenerateItem[] = []\n\n return items.map((item, index) => {\n const { containerProps, name, isCurrentPage, isEllipsisPage, ...rest } =\n item\n const isLastChild = items.length === index + 1\n const props: BreadcrumbItemProps = {\n separator,\n gap,\n isCurrentPage,\n ...containerProps,\n }\n\n if (!hasBoundaries && isEllipsisPage) {\n hiddenEllipsis.push(item)\n\n return isLastChild ? (\n <BreadcrumbItem key={index} {...props} isLastChild>\n {customEllipsis([item]) ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n ) : null\n }\n\n if (hasBoundaries && isExceed) {\n const lastIndex = items.length - index - 1\n\n if (startBoundaries! <= index && endBoundaries! <= lastIndex) {\n if (startBoundaries === index) {\n return (\n <BreadcrumbItem key={index} {...props}>\n {customEllipsis() ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n )\n } else {\n return null\n }\n }\n }\n\n if (hiddenEllipsis.length) {\n const resolvedEllipsis = customEllipsis(hiddenEllipsis) ?? (\n <BreadcrumbEllipsis />\n )\n\n hiddenEllipsis = []\n\n return (\n <Fragment key={index}>\n <BreadcrumbItem {...props}>{resolvedEllipsis}</BreadcrumbItem>\n\n <BreadcrumbItem {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n </Fragment>\n )\n } else {\n return (\n <BreadcrumbItem key={index} {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n )\n }\n })\n }\n }, [\n hasChildren,\n validChildren,\n separator,\n gap,\n items,\n hasBoundaries,\n isExceed,\n startBoundaries,\n endBoundaries,\n customEllipsis,\n ])\n\n return (\n <BreadcrumbProvider value={styles}>\n <ui.nav\n ref={ref}\n className={cx(\"ui-breadcrumb\", className)}\n __css={styles.container}\n aria-label=\"Breadcrumb\"\n {...rest}\n >\n <ui.ol className=\"ui-breadcrumb__list\" {...listProps} __css={css}>\n {cloneChildren}\n </ui.ol>\n </ui.nav>\n </BreadcrumbProvider>\n )\n})\n\ninterface BreadcrumbItemOptions\n extends Pick<BreadcrumbProps, \"separator\" | \"gap\"> {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n /**\n * If `true`, not show separator.\n *\n * @default false\n */\n isLastChild?: boolean\n}\n\nexport interface BreadcrumbItemProps\n extends Omit<HTMLUIProps<\"li\">, \"gap\">,\n BreadcrumbItemOptions {}\n\nexport const BreadcrumbItem = forwardRef<BreadcrumbItemProps, \"li\">(\n (\n {\n className,\n children,\n separator,\n isCurrentPage,\n isLastChild,\n gap,\n ...rest\n },\n ref,\n ) => {\n const styles = useBreadcrumb()\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type === BreadcrumbLink) {\n return cloneElement(child, {\n isCurrentPage,\n })\n }\n\n if (child.type === BreadcrumbSeparator) {\n return cloneElement(child, {\n gap,\n children: child.props.children || separator,\n })\n }\n\n return child\n })\n\n const css: CSSUIObject = {\n display: \"inline-flex\",\n alignItems: \"center\",\n ...styles.item,\n }\n\n return (\n <ui.li\n ref={ref}\n className={cx(\"ui-breadcrumb__item\", className)}\n __css={css}\n {...rest}\n >\n {cloneChildren}\n\n {!isLastChild ? (\n <BreadcrumbSeparator gap={gap}>{separator}</BreadcrumbSeparator>\n ) : null}\n </ui.li>\n )\n },\n)\n\ninterface BreadcrumbLinkOptions {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n}\n\nexport interface BreadcrumbLinkProps\n extends HTMLUIProps<\"a\">,\n BreadcrumbLinkOptions {}\n\nexport const BreadcrumbLink = forwardRef<BreadcrumbLinkProps, \"a\">(\n ({ className, children, isCurrentPage, href, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n return (\n <ui.a\n ref={ref}\n as={!isCurrentPage ? \"a\" : \"span\"}\n href={!isCurrentPage ? href : undefined}\n aria-current={isCurrentPage ? \"page\" : undefined}\n className={cx(\"ui-breadcrumb__link\", className)}\n __css={styles.link}\n {...rest}\n >\n {children}\n </ui.a>\n )\n },\n)\n\ninterface BreadcrumbSeparatorOptions {\n /**\n * The CSS `margin-inline-start`, and `margin-inline-end` property.\n */\n gap?: CSSUIObject[\"mx\"]\n}\n\nexport interface BreadcrumbSeparatorProps\n extends Omit<HTMLUIProps<\"span\">, \"gap\">,\n BreadcrumbSeparatorOptions {}\n\nexport const BreadcrumbSeparator = forwardRef<BreadcrumbSeparatorProps, \"span\">(\n ({ children, gap: mx, ...rest }, ref) => {\n const styles = useBreadcrumb()\n const css: CSSUIObject = {\n mx,\n ...styles.separator,\n }\n\n return (\n <ui.span\n ref={ref}\n className=\"ui-breadcrumb__item__separator\"\n __css={css}\n {...rest}\n >\n {children}\n </ui.span>\n )\n },\n)\n\ninterface BreadcrumbEllipsisOptions {}\n\nexport interface BreadcrumbEllipsisProps\n extends IconProps,\n BreadcrumbEllipsisOptions {}\n\nexport const BreadcrumbEllipsis = forwardRef<BreadcrumbEllipsisProps, \"span\">(\n ({ children, className, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n const css: CSSUIObject = {\n ...styles.ellipsis,\n }\n\n return (\n children ?? (\n <Icon\n ref={ref}\n aria-label=\"ellipsis\"\n className={cx(\"ui-breadcrumb__item__ellipsis\", className)}\n __css={css}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 36 24\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n {...rest}\n >\n <circle cx=\"10\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"20\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"30\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n </Icon>\n )\n )\n },\n)\n"],"mappings":"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","names":["rest","props"]}
|
|
1
|
+
{"version":3,"sources":["../src/breadcrumb.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n CSSUIProps,\n Token,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { Icon } from \"@yamada-ui/icon\"\nimport type { IconProps } from \"@yamada-ui/icon\"\nimport { useValue } from \"@yamada-ui/use-value\"\nimport {\n cx,\n createContext,\n getValidChildren,\n isNumber,\n runIfFunc,\n} from \"@yamada-ui/utils\"\nimport type { ReactNode } from \"react\"\nimport { Fragment, cloneElement, useCallback, useMemo } from \"react\"\n\nconst [BreadcrumbProvider, useBreadcrumb] = createContext<{\n [key: string]: CSSUIObject\n}>({\n name: \"BreadcrumbContext\",\n errorMessage: `useBreadcrumb returned is 'undefined'. Seems you forgot to wrap the components in \"<Breadcrumb />\" `,\n})\n\nexport interface BreadcrumbGenerateItem extends BreadcrumbLinkProps {\n name?: ReactNode\n containerProps?: Omit<BreadcrumbItemProps, \"isLastChild\">\n isEllipsisPage?: boolean\n}\n\ninterface BreadcrumbOptions {\n /**\n * The visual separator between each breadcrumb item.\n *\n * @default '/'\n */\n separator?: string | JSX.Element\n /**\n * The left and right margin applied to the separator.\n *\n * @default '2'\n */\n gap?: CSSUIProps[\"mx\"]\n /**\n * Props for ol element.\n */\n listProps?: HTMLUIProps<\"ol\">\n /**\n * If provided, generate breadcrumb items based on items.\n */\n items?: BreadcrumbGenerateItem[]\n /**\n * Number of elements visible on the start(left) edges.\n */\n startBoundaries?: Token<number>\n /**\n * Number of elements visible on the end(right) edges.\n */\n endBoundaries?: Token<number>\n /**\n * The icon to be used in the ellipsis.\n */\n ellipsis?:\n | ReactNode\n | ((props: { items: BreadcrumbGenerateItem[] }) => ReactNode)\n}\n\nexport interface BreadcrumbProps\n extends Omit<HTMLUIProps<\"nav\">, \"gap\">,\n ThemeProps<\"Breadcrumb\">,\n BreadcrumbOptions {}\n\n/**\n * `Breadcrumb` is a component that helps users understand the hierarchy of a website.\n *\n * @see Docs https://yamada-ui.com/components/navigation/breadcrumb\n */\nexport const Breadcrumb = forwardRef<BreadcrumbProps, \"nav\">((props, ref) => {\n const [styles, mergedProps] = useComponentMultiStyle(\"Breadcrumb\", props)\n\n const {\n className,\n children,\n separator = \"/\",\n gap = \"fallback(2, 0.5rem)\",\n listProps,\n items = [],\n startBoundaries: _startBoundaries,\n endBoundaries: _endBoundaries,\n ellipsis,\n ...rest\n } = omitThemeProps(mergedProps)\n let startBoundaries = useValue(_startBoundaries)\n let endBoundaries = useValue(_endBoundaries)\n\n if (startBoundaries === 0) startBoundaries = 1\n if (endBoundaries === 0) endBoundaries = 1\n\n if (startBoundaries) endBoundaries ??= 1\n if (endBoundaries) startBoundaries ??= 1\n\n const hasBoundaries = isNumber(startBoundaries) && isNumber(endBoundaries)\n const isExceed =\n hasBoundaries && startBoundaries! + endBoundaries! < items.length\n\n const css: CSSUIObject = {\n display: \"flex\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n const validChildren = getValidChildren(children)\n const hasChildren = validChildren.length\n\n const customEllipsis = useCallback(\n (providedItems?: BreadcrumbGenerateItem[]) => {\n if (!ellipsis) return null\n\n const resolvedItems =\n providedItems ??\n items.slice(startBoundaries!, items.length - endBoundaries!)\n\n return runIfFunc(ellipsis, { items: resolvedItems })\n },\n [ellipsis, endBoundaries, items, startBoundaries],\n )\n\n const cloneChildren = useMemo(() => {\n if (hasChildren) {\n return validChildren.map((child, index) =>\n cloneElement(child, {\n separator,\n gap,\n isLastChild: validChildren.length === index + 1,\n }),\n )\n } else {\n let hiddenEllipsis: BreadcrumbGenerateItem[] = []\n\n return items.map((item, index) => {\n const { containerProps, name, isCurrentPage, isEllipsisPage, ...rest } =\n item\n const isLastChild = items.length === index + 1\n const props: BreadcrumbItemProps = {\n separator,\n gap,\n isCurrentPage,\n ...containerProps,\n }\n\n if (!hasBoundaries && isEllipsisPage) {\n hiddenEllipsis.push(item)\n\n return isLastChild ? (\n <BreadcrumbItem key={index} {...props} isLastChild>\n {customEllipsis([item]) ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n ) : null\n }\n\n if (hasBoundaries && isExceed) {\n const lastIndex = items.length - index - 1\n\n if (startBoundaries! <= index && endBoundaries! <= lastIndex) {\n if (startBoundaries === index) {\n return (\n <BreadcrumbItem key={index} {...props}>\n {customEllipsis() ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n )\n } else {\n return null\n }\n }\n }\n\n if (hiddenEllipsis.length) {\n const resolvedEllipsis = customEllipsis(hiddenEllipsis) ?? (\n <BreadcrumbEllipsis />\n )\n\n hiddenEllipsis = []\n\n return (\n <Fragment key={index}>\n <BreadcrumbItem {...props}>{resolvedEllipsis}</BreadcrumbItem>\n\n <BreadcrumbItem {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n </Fragment>\n )\n } else {\n return (\n <BreadcrumbItem key={index} {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n )\n }\n })\n }\n }, [\n hasChildren,\n validChildren,\n separator,\n gap,\n items,\n hasBoundaries,\n isExceed,\n startBoundaries,\n endBoundaries,\n customEllipsis,\n ])\n\n return (\n <BreadcrumbProvider value={styles}>\n <ui.nav\n ref={ref}\n className={cx(\"ui-breadcrumb\", className)}\n __css={styles.container}\n aria-label=\"Breadcrumb\"\n {...rest}\n >\n <ui.ol className=\"ui-breadcrumb__list\" {...listProps} __css={css}>\n {cloneChildren}\n </ui.ol>\n </ui.nav>\n </BreadcrumbProvider>\n )\n})\n\nBreadcrumb.displayName = \"Breadcrumb\"\nBreadcrumb.__ui__ = \"Breadcrumb\"\n\ninterface BreadcrumbItemOptions\n extends Pick<BreadcrumbProps, \"separator\" | \"gap\"> {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n /**\n * If `true`, not show separator.\n *\n * @default false\n */\n isLastChild?: boolean\n}\n\nexport interface BreadcrumbItemProps\n extends Omit<HTMLUIProps<\"li\">, \"gap\">,\n BreadcrumbItemOptions {}\n\nexport const BreadcrumbItem = forwardRef<BreadcrumbItemProps, \"li\">(\n (\n {\n className,\n children,\n separator,\n isCurrentPage,\n isLastChild,\n gap,\n ...rest\n },\n ref,\n ) => {\n const styles = useBreadcrumb()\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type === BreadcrumbLink) {\n return cloneElement(child, {\n isCurrentPage,\n })\n }\n\n if (child.type === BreadcrumbSeparator) {\n return cloneElement(child, {\n gap,\n children: child.props.children || separator,\n })\n }\n\n return child\n })\n\n const css: CSSUIObject = {\n display: \"inline-flex\",\n alignItems: \"center\",\n ...styles.item,\n }\n\n return (\n <ui.li\n ref={ref}\n className={cx(\"ui-breadcrumb__item\", className)}\n __css={css}\n {...rest}\n >\n {cloneChildren}\n\n {!isLastChild ? (\n <BreadcrumbSeparator gap={gap}>{separator}</BreadcrumbSeparator>\n ) : null}\n </ui.li>\n )\n },\n)\n\nBreadcrumbItem.displayName = \"BreadcrumbItem\"\nBreadcrumbItem.__ui__ = \"BreadcrumbItem\"\n\ninterface BreadcrumbLinkOptions {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n}\n\nexport interface BreadcrumbLinkProps\n extends HTMLUIProps<\"a\">,\n BreadcrumbLinkOptions {}\n\nexport const BreadcrumbLink = forwardRef<BreadcrumbLinkProps, \"a\">(\n ({ className, children, isCurrentPage, href, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n return (\n <ui.a\n ref={ref}\n as={!isCurrentPage ? \"a\" : \"span\"}\n href={!isCurrentPage ? href : undefined}\n aria-current={isCurrentPage ? \"page\" : undefined}\n className={cx(\"ui-breadcrumb__link\", className)}\n __css={styles.link}\n {...rest}\n >\n {children}\n </ui.a>\n )\n },\n)\nBreadcrumbLink.displayName = \"BreadcrumbLink\"\nBreadcrumbLink.__ui__ = \"BreadcrumbLink\"\n\ninterface BreadcrumbSeparatorOptions {\n /**\n * The CSS `margin-inline-start`, and `margin-inline-end` property.\n */\n gap?: CSSUIObject[\"mx\"]\n}\n\nexport interface BreadcrumbSeparatorProps\n extends Omit<HTMLUIProps<\"span\">, \"gap\">,\n BreadcrumbSeparatorOptions {}\n\nexport const BreadcrumbSeparator = forwardRef<BreadcrumbSeparatorProps, \"span\">(\n ({ children, gap: mx, ...rest }, ref) => {\n const styles = useBreadcrumb()\n const css: CSSUIObject = {\n mx,\n ...styles.separator,\n }\n\n return (\n <ui.span\n ref={ref}\n className=\"ui-breadcrumb__item__separator\"\n __css={css}\n {...rest}\n >\n {children}\n </ui.span>\n )\n },\n)\n\nBreadcrumbSeparator.displayName = \"BreadcrumbSeparator\"\nBreadcrumbSeparator.__ui__ = \"BreadcrumbSeparator\"\n\ninterface BreadcrumbEllipsisOptions {}\n\nexport interface BreadcrumbEllipsisProps\n extends IconProps,\n BreadcrumbEllipsisOptions {}\n\nexport const BreadcrumbEllipsis = forwardRef<BreadcrumbEllipsisProps, \"span\">(\n ({ children, className, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n const css: CSSUIObject = {\n ...styles.ellipsis,\n }\n\n return (\n children ?? (\n <Icon\n ref={ref}\n aria-label=\"ellipsis\"\n className={cx(\"ui-breadcrumb__item__ellipsis\", className)}\n __css={css}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 36 24\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n {...rest}\n >\n <circle cx=\"10\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"20\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"30\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n </Icon>\n )\n )\n },\n)\n\nBreadcrumbEllipsis.displayName = \"BreadcrumbEllipsis\"\nBreadcrumbEllipsis.__ui__ = \"BreadcrumbEllipsis\"\n"],"mappings":"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","names":["rest","props"]}
|
package/dist/breadcrumb.mjs
CHANGED
|
@@ -130,6 +130,8 @@ var Breadcrumb = forwardRef((props, ref) => {
|
|
|
130
130
|
}
|
|
131
131
|
) });
|
|
132
132
|
});
|
|
133
|
+
Breadcrumb.displayName = "Breadcrumb";
|
|
134
|
+
Breadcrumb.__ui__ = "Breadcrumb";
|
|
133
135
|
var BreadcrumbItem = forwardRef(
|
|
134
136
|
({
|
|
135
137
|
className,
|
|
@@ -176,6 +178,8 @@ var BreadcrumbItem = forwardRef(
|
|
|
176
178
|
);
|
|
177
179
|
}
|
|
178
180
|
);
|
|
181
|
+
BreadcrumbItem.displayName = "BreadcrumbItem";
|
|
182
|
+
BreadcrumbItem.__ui__ = "BreadcrumbItem";
|
|
179
183
|
var BreadcrumbLink = forwardRef(
|
|
180
184
|
({ className, children, isCurrentPage, href, ...rest }, ref) => {
|
|
181
185
|
const styles = useBreadcrumb();
|
|
@@ -194,6 +198,8 @@ var BreadcrumbLink = forwardRef(
|
|
|
194
198
|
);
|
|
195
199
|
}
|
|
196
200
|
);
|
|
201
|
+
BreadcrumbLink.displayName = "BreadcrumbLink";
|
|
202
|
+
BreadcrumbLink.__ui__ = "BreadcrumbLink";
|
|
197
203
|
var BreadcrumbSeparator = forwardRef(
|
|
198
204
|
({ children, gap: mx, ...rest }, ref) => {
|
|
199
205
|
const styles = useBreadcrumb();
|
|
@@ -213,6 +219,8 @@ var BreadcrumbSeparator = forwardRef(
|
|
|
213
219
|
);
|
|
214
220
|
}
|
|
215
221
|
);
|
|
222
|
+
BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
|
|
223
|
+
BreadcrumbSeparator.__ui__ = "BreadcrumbSeparator";
|
|
216
224
|
var BreadcrumbEllipsis = forwardRef(
|
|
217
225
|
({ children, className, ...rest }, ref) => {
|
|
218
226
|
const styles = useBreadcrumb();
|
|
@@ -242,6 +250,8 @@ var BreadcrumbEllipsis = forwardRef(
|
|
|
242
250
|
);
|
|
243
251
|
}
|
|
244
252
|
);
|
|
253
|
+
BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
|
|
254
|
+
BreadcrumbEllipsis.__ui__ = "BreadcrumbEllipsis";
|
|
245
255
|
|
|
246
256
|
export {
|
|
247
257
|
Breadcrumb,
|
|
@@ -250,4 +260,4 @@ export {
|
|
|
250
260
|
BreadcrumbSeparator,
|
|
251
261
|
BreadcrumbEllipsis
|
|
252
262
|
};
|
|
253
|
-
//# sourceMappingURL=chunk-
|
|
263
|
+
//# sourceMappingURL=chunk-K3D3RBYU.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/breadcrumb.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n CSSUIProps,\n Token,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { Icon } from \"@yamada-ui/icon\"\nimport type { IconProps } from \"@yamada-ui/icon\"\nimport { useValue } from \"@yamada-ui/use-value\"\nimport {\n cx,\n createContext,\n getValidChildren,\n isNumber,\n runIfFunc,\n} from \"@yamada-ui/utils\"\nimport type { ReactNode } from \"react\"\nimport { Fragment, cloneElement, useCallback, useMemo } from \"react\"\n\nconst [BreadcrumbProvider, useBreadcrumb] = createContext<{\n [key: string]: CSSUIObject\n}>({\n name: \"BreadcrumbContext\",\n errorMessage: `useBreadcrumb returned is 'undefined'. Seems you forgot to wrap the components in \"<Breadcrumb />\" `,\n})\n\nexport interface BreadcrumbGenerateItem extends BreadcrumbLinkProps {\n name?: ReactNode\n containerProps?: Omit<BreadcrumbItemProps, \"isLastChild\">\n isEllipsisPage?: boolean\n}\n\ninterface BreadcrumbOptions {\n /**\n * The visual separator between each breadcrumb item.\n *\n * @default '/'\n */\n separator?: string | JSX.Element\n /**\n * The left and right margin applied to the separator.\n *\n * @default '2'\n */\n gap?: CSSUIProps[\"mx\"]\n /**\n * Props for ol element.\n */\n listProps?: HTMLUIProps<\"ol\">\n /**\n * If provided, generate breadcrumb items based on items.\n */\n items?: BreadcrumbGenerateItem[]\n /**\n * Number of elements visible on the start(left) edges.\n */\n startBoundaries?: Token<number>\n /**\n * Number of elements visible on the end(right) edges.\n */\n endBoundaries?: Token<number>\n /**\n * The icon to be used in the ellipsis.\n */\n ellipsis?:\n | ReactNode\n | ((props: { items: BreadcrumbGenerateItem[] }) => ReactNode)\n}\n\nexport interface BreadcrumbProps\n extends Omit<HTMLUIProps<\"nav\">, \"gap\">,\n ThemeProps<\"Breadcrumb\">,\n BreadcrumbOptions {}\n\n/**\n * `Breadcrumb` is a component that helps users understand the hierarchy of a website.\n *\n * @see Docs https://yamada-ui.com/components/navigation/breadcrumb\n */\nexport const Breadcrumb = forwardRef<BreadcrumbProps, \"nav\">((props, ref) => {\n const [styles, mergedProps] = useComponentMultiStyle(\"Breadcrumb\", props)\n\n const {\n className,\n children,\n separator = \"/\",\n gap = \"fallback(2, 0.5rem)\",\n listProps,\n items = [],\n startBoundaries: _startBoundaries,\n endBoundaries: _endBoundaries,\n ellipsis,\n ...rest\n } = omitThemeProps(mergedProps)\n let startBoundaries = useValue(_startBoundaries)\n let endBoundaries = useValue(_endBoundaries)\n\n if (startBoundaries === 0) startBoundaries = 1\n if (endBoundaries === 0) endBoundaries = 1\n\n if (startBoundaries) endBoundaries ??= 1\n if (endBoundaries) startBoundaries ??= 1\n\n const hasBoundaries = isNumber(startBoundaries) && isNumber(endBoundaries)\n const isExceed =\n hasBoundaries && startBoundaries! + endBoundaries! < items.length\n\n const css: CSSUIObject = {\n display: \"flex\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n const validChildren = getValidChildren(children)\n const hasChildren = validChildren.length\n\n const customEllipsis = useCallback(\n (providedItems?: BreadcrumbGenerateItem[]) => {\n if (!ellipsis) return null\n\n const resolvedItems =\n providedItems ??\n items.slice(startBoundaries!, items.length - endBoundaries!)\n\n return runIfFunc(ellipsis, { items: resolvedItems })\n },\n [ellipsis, endBoundaries, items, startBoundaries],\n )\n\n const cloneChildren = useMemo(() => {\n if (hasChildren) {\n return validChildren.map((child, index) =>\n cloneElement(child, {\n separator,\n gap,\n isLastChild: validChildren.length === index + 1,\n }),\n )\n } else {\n let hiddenEllipsis: BreadcrumbGenerateItem[] = []\n\n return items.map((item, index) => {\n const { containerProps, name, isCurrentPage, isEllipsisPage, ...rest } =\n item\n const isLastChild = items.length === index + 1\n const props: BreadcrumbItemProps = {\n separator,\n gap,\n isCurrentPage,\n ...containerProps,\n }\n\n if (!hasBoundaries && isEllipsisPage) {\n hiddenEllipsis.push(item)\n\n return isLastChild ? (\n <BreadcrumbItem key={index} {...props} isLastChild>\n {customEllipsis([item]) ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n ) : null\n }\n\n if (hasBoundaries && isExceed) {\n const lastIndex = items.length - index - 1\n\n if (startBoundaries! <= index && endBoundaries! <= lastIndex) {\n if (startBoundaries === index) {\n return (\n <BreadcrumbItem key={index} {...props}>\n {customEllipsis() ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n )\n } else {\n return null\n }\n }\n }\n\n if (hiddenEllipsis.length) {\n const resolvedEllipsis = customEllipsis(hiddenEllipsis) ?? (\n <BreadcrumbEllipsis />\n )\n\n hiddenEllipsis = []\n\n return (\n <Fragment key={index}>\n <BreadcrumbItem {...props}>{resolvedEllipsis}</BreadcrumbItem>\n\n <BreadcrumbItem {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n </Fragment>\n )\n } else {\n return (\n <BreadcrumbItem key={index} {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n )\n }\n })\n }\n }, [\n hasChildren,\n validChildren,\n separator,\n gap,\n items,\n hasBoundaries,\n isExceed,\n startBoundaries,\n endBoundaries,\n customEllipsis,\n ])\n\n return (\n <BreadcrumbProvider value={styles}>\n <ui.nav\n ref={ref}\n className={cx(\"ui-breadcrumb\", className)}\n __css={styles.container}\n aria-label=\"Breadcrumb\"\n {...rest}\n >\n <ui.ol className=\"ui-breadcrumb__list\" {...listProps} __css={css}>\n {cloneChildren}\n </ui.ol>\n </ui.nav>\n </BreadcrumbProvider>\n )\n})\n\nBreadcrumb.displayName = \"Breadcrumb\"\nBreadcrumb.__ui__ = \"Breadcrumb\"\n\ninterface BreadcrumbItemOptions\n extends Pick<BreadcrumbProps, \"separator\" | \"gap\"> {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n /**\n * If `true`, not show separator.\n *\n * @default false\n */\n isLastChild?: boolean\n}\n\nexport interface BreadcrumbItemProps\n extends Omit<HTMLUIProps<\"li\">, \"gap\">,\n BreadcrumbItemOptions {}\n\nexport const BreadcrumbItem = forwardRef<BreadcrumbItemProps, \"li\">(\n (\n {\n className,\n children,\n separator,\n isCurrentPage,\n isLastChild,\n gap,\n ...rest\n },\n ref,\n ) => {\n const styles = useBreadcrumb()\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type === BreadcrumbLink) {\n return cloneElement(child, {\n isCurrentPage,\n })\n }\n\n if (child.type === BreadcrumbSeparator) {\n return cloneElement(child, {\n gap,\n children: child.props.children || separator,\n })\n }\n\n return child\n })\n\n const css: CSSUIObject = {\n display: \"inline-flex\",\n alignItems: \"center\",\n ...styles.item,\n }\n\n return (\n <ui.li\n ref={ref}\n className={cx(\"ui-breadcrumb__item\", className)}\n __css={css}\n {...rest}\n >\n {cloneChildren}\n\n {!isLastChild ? (\n <BreadcrumbSeparator gap={gap}>{separator}</BreadcrumbSeparator>\n ) : null}\n </ui.li>\n )\n },\n)\n\nBreadcrumbItem.displayName = \"BreadcrumbItem\"\nBreadcrumbItem.__ui__ = \"BreadcrumbItem\"\n\ninterface BreadcrumbLinkOptions {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n}\n\nexport interface BreadcrumbLinkProps\n extends HTMLUIProps<\"a\">,\n BreadcrumbLinkOptions {}\n\nexport const BreadcrumbLink = forwardRef<BreadcrumbLinkProps, \"a\">(\n ({ className, children, isCurrentPage, href, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n return (\n <ui.a\n ref={ref}\n as={!isCurrentPage ? \"a\" : \"span\"}\n href={!isCurrentPage ? href : undefined}\n aria-current={isCurrentPage ? \"page\" : undefined}\n className={cx(\"ui-breadcrumb__link\", className)}\n __css={styles.link}\n {...rest}\n >\n {children}\n </ui.a>\n )\n },\n)\nBreadcrumbLink.displayName = \"BreadcrumbLink\"\nBreadcrumbLink.__ui__ = \"BreadcrumbLink\"\n\ninterface BreadcrumbSeparatorOptions {\n /**\n * The CSS `margin-inline-start`, and `margin-inline-end` property.\n */\n gap?: CSSUIObject[\"mx\"]\n}\n\nexport interface BreadcrumbSeparatorProps\n extends Omit<HTMLUIProps<\"span\">, \"gap\">,\n BreadcrumbSeparatorOptions {}\n\nexport const BreadcrumbSeparator = forwardRef<BreadcrumbSeparatorProps, \"span\">(\n ({ children, gap: mx, ...rest }, ref) => {\n const styles = useBreadcrumb()\n const css: CSSUIObject = {\n mx,\n ...styles.separator,\n }\n\n return (\n <ui.span\n ref={ref}\n className=\"ui-breadcrumb__item__separator\"\n __css={css}\n {...rest}\n >\n {children}\n </ui.span>\n )\n },\n)\n\nBreadcrumbSeparator.displayName = \"BreadcrumbSeparator\"\nBreadcrumbSeparator.__ui__ = \"BreadcrumbSeparator\"\n\ninterface BreadcrumbEllipsisOptions {}\n\nexport interface BreadcrumbEllipsisProps\n extends IconProps,\n BreadcrumbEllipsisOptions {}\n\nexport const BreadcrumbEllipsis = forwardRef<BreadcrumbEllipsisProps, \"span\">(\n ({ children, className, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n const css: CSSUIObject = {\n ...styles.ellipsis,\n }\n\n return (\n children ?? (\n <Icon\n ref={ref}\n aria-label=\"ellipsis\"\n className={cx(\"ui-breadcrumb__item__ellipsis\", className)}\n __css={css}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 36 24\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n {...rest}\n >\n <circle cx=\"10\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"20\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"30\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n </Icon>\n )\n )\n },\n)\n\nBreadcrumbEllipsis.displayName = \"BreadcrumbEllipsis\"\nBreadcrumbEllipsis.__ui__ = \"BreadcrumbEllipsis\"\n"],"mappings":"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","names":["rest","props"]}
|
package/dist/index.js
CHANGED
|
@@ -148,6 +148,8 @@ var Breadcrumb = (0, import_core.forwardRef)((props, ref) => {
|
|
|
148
148
|
}
|
|
149
149
|
) });
|
|
150
150
|
});
|
|
151
|
+
Breadcrumb.displayName = "Breadcrumb";
|
|
152
|
+
Breadcrumb.__ui__ = "Breadcrumb";
|
|
151
153
|
var BreadcrumbItem = (0, import_core.forwardRef)(
|
|
152
154
|
({
|
|
153
155
|
className,
|
|
@@ -194,6 +196,8 @@ var BreadcrumbItem = (0, import_core.forwardRef)(
|
|
|
194
196
|
);
|
|
195
197
|
}
|
|
196
198
|
);
|
|
199
|
+
BreadcrumbItem.displayName = "BreadcrumbItem";
|
|
200
|
+
BreadcrumbItem.__ui__ = "BreadcrumbItem";
|
|
197
201
|
var BreadcrumbLink = (0, import_core.forwardRef)(
|
|
198
202
|
({ className, children, isCurrentPage, href, ...rest }, ref) => {
|
|
199
203
|
const styles = useBreadcrumb();
|
|
@@ -212,6 +216,8 @@ var BreadcrumbLink = (0, import_core.forwardRef)(
|
|
|
212
216
|
);
|
|
213
217
|
}
|
|
214
218
|
);
|
|
219
|
+
BreadcrumbLink.displayName = "BreadcrumbLink";
|
|
220
|
+
BreadcrumbLink.__ui__ = "BreadcrumbLink";
|
|
215
221
|
var BreadcrumbSeparator = (0, import_core.forwardRef)(
|
|
216
222
|
({ children, gap: mx, ...rest }, ref) => {
|
|
217
223
|
const styles = useBreadcrumb();
|
|
@@ -231,6 +237,8 @@ var BreadcrumbSeparator = (0, import_core.forwardRef)(
|
|
|
231
237
|
);
|
|
232
238
|
}
|
|
233
239
|
);
|
|
240
|
+
BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
|
|
241
|
+
BreadcrumbSeparator.__ui__ = "BreadcrumbSeparator";
|
|
234
242
|
var BreadcrumbEllipsis = (0, import_core.forwardRef)(
|
|
235
243
|
({ children, className, ...rest }, ref) => {
|
|
236
244
|
const styles = useBreadcrumb();
|
|
@@ -260,6 +268,8 @@ var BreadcrumbEllipsis = (0, import_core.forwardRef)(
|
|
|
260
268
|
);
|
|
261
269
|
}
|
|
262
270
|
);
|
|
271
|
+
BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
|
|
272
|
+
BreadcrumbEllipsis.__ui__ = "BreadcrumbEllipsis";
|
|
263
273
|
// Annotate the CommonJS export names for ESM import in node:
|
|
264
274
|
0 && (module.exports = {
|
|
265
275
|
Breadcrumb,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/breadcrumb.tsx"],"sourcesContent":["export {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbSeparator,\n BreadcrumbEllipsis,\n} from \"./breadcrumb\"\nexport type {\n BreadcrumbProps,\n BreadcrumbItemProps,\n BreadcrumbLinkProps,\n BreadcrumbSeparatorProps,\n BreadcrumbEllipsisProps,\n BreadcrumbGenerateItem,\n} from \"./breadcrumb\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n CSSUIProps,\n Token,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { Icon } from \"@yamada-ui/icon\"\nimport type { IconProps } from \"@yamada-ui/icon\"\nimport { useValue } from \"@yamada-ui/use-value\"\nimport {\n cx,\n createContext,\n getValidChildren,\n isNumber,\n runIfFunc,\n} from \"@yamada-ui/utils\"\nimport type { ReactNode } from \"react\"\nimport { Fragment, cloneElement, useCallback, useMemo } from \"react\"\n\nconst [BreadcrumbProvider, useBreadcrumb] = createContext<{\n [key: string]: CSSUIObject\n}>({\n name: \"BreadcrumbContext\",\n errorMessage: `useBreadcrumb returned is 'undefined'. Seems you forgot to wrap the components in \"<Breadcrumb />\" `,\n})\n\nexport interface BreadcrumbGenerateItem extends BreadcrumbLinkProps {\n name?: ReactNode\n containerProps?: Omit<BreadcrumbItemProps, \"isLastChild\">\n isEllipsisPage?: boolean\n}\n\ninterface BreadcrumbOptions {\n /**\n * The visual separator between each breadcrumb item.\n *\n * @default '/'\n */\n separator?: string | JSX.Element\n /**\n * The left and right margin applied to the separator.\n *\n * @default '2'\n */\n gap?: CSSUIProps[\"mx\"]\n /**\n * Props for ol element.\n */\n listProps?: HTMLUIProps<\"ol\">\n /**\n * If provided, generate breadcrumb items based on items.\n */\n items?: BreadcrumbGenerateItem[]\n /**\n * Number of elements visible on the start(left) edges.\n */\n startBoundaries?: Token<number>\n /**\n * Number of elements visible on the end(right) edges.\n */\n endBoundaries?: Token<number>\n /**\n * The icon to be used in the ellipsis.\n */\n ellipsis?:\n | ReactNode\n | ((props: { items: BreadcrumbGenerateItem[] }) => ReactNode)\n}\n\nexport interface BreadcrumbProps\n extends Omit<HTMLUIProps<\"nav\">, \"gap\">,\n ThemeProps<\"Breadcrumb\">,\n BreadcrumbOptions {}\n\n/**\n * `Breadcrumb` is a component that helps users understand the hierarchy of a website.\n *\n * @see Docs https://yamada-ui.com/components/navigation/breadcrumb\n */\nexport const Breadcrumb = forwardRef<BreadcrumbProps, \"nav\">((props, ref) => {\n const [styles, mergedProps] = useComponentMultiStyle(\"Breadcrumb\", props)\n\n const {\n className,\n children,\n separator = \"/\",\n gap = \"fallback(2, 0.5rem)\",\n listProps,\n items = [],\n startBoundaries: _startBoundaries,\n endBoundaries: _endBoundaries,\n ellipsis,\n ...rest\n } = omitThemeProps(mergedProps)\n let startBoundaries = useValue(_startBoundaries)\n let endBoundaries = useValue(_endBoundaries)\n\n if (startBoundaries === 0) startBoundaries = 1\n if (endBoundaries === 0) endBoundaries = 1\n\n if (startBoundaries) endBoundaries ??= 1\n if (endBoundaries) startBoundaries ??= 1\n\n const hasBoundaries = isNumber(startBoundaries) && isNumber(endBoundaries)\n const isExceed =\n hasBoundaries && startBoundaries! + endBoundaries! < items.length\n\n const css: CSSUIObject = {\n display: \"flex\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n const validChildren = getValidChildren(children)\n const hasChildren = validChildren.length\n\n const customEllipsis = useCallback(\n (providedItems?: BreadcrumbGenerateItem[]) => {\n if (!ellipsis) return null\n\n const resolvedItems =\n providedItems ??\n items.slice(startBoundaries!, items.length - endBoundaries!)\n\n return runIfFunc(ellipsis, { items: resolvedItems })\n },\n [ellipsis, endBoundaries, items, startBoundaries],\n )\n\n const cloneChildren = useMemo(() => {\n if (hasChildren) {\n return validChildren.map((child, index) =>\n cloneElement(child, {\n separator,\n gap,\n isLastChild: validChildren.length === index + 1,\n }),\n )\n } else {\n let hiddenEllipsis: BreadcrumbGenerateItem[] = []\n\n return items.map((item, index) => {\n const { containerProps, name, isCurrentPage, isEllipsisPage, ...rest } =\n item\n const isLastChild = items.length === index + 1\n const props: BreadcrumbItemProps = {\n separator,\n gap,\n isCurrentPage,\n ...containerProps,\n }\n\n if (!hasBoundaries && isEllipsisPage) {\n hiddenEllipsis.push(item)\n\n return isLastChild ? (\n <BreadcrumbItem key={index} {...props} isLastChild>\n {customEllipsis([item]) ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n ) : null\n }\n\n if (hasBoundaries && isExceed) {\n const lastIndex = items.length - index - 1\n\n if (startBoundaries! <= index && endBoundaries! <= lastIndex) {\n if (startBoundaries === index) {\n return (\n <BreadcrumbItem key={index} {...props}>\n {customEllipsis() ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n )\n } else {\n return null\n }\n }\n }\n\n if (hiddenEllipsis.length) {\n const resolvedEllipsis = customEllipsis(hiddenEllipsis) ?? (\n <BreadcrumbEllipsis />\n )\n\n hiddenEllipsis = []\n\n return (\n <Fragment key={index}>\n <BreadcrumbItem {...props}>{resolvedEllipsis}</BreadcrumbItem>\n\n <BreadcrumbItem {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n </Fragment>\n )\n } else {\n return (\n <BreadcrumbItem key={index} {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n )\n }\n })\n }\n }, [\n hasChildren,\n validChildren,\n separator,\n gap,\n items,\n hasBoundaries,\n isExceed,\n startBoundaries,\n endBoundaries,\n customEllipsis,\n ])\n\n return (\n <BreadcrumbProvider value={styles}>\n <ui.nav\n ref={ref}\n className={cx(\"ui-breadcrumb\", className)}\n __css={styles.container}\n aria-label=\"Breadcrumb\"\n {...rest}\n >\n <ui.ol className=\"ui-breadcrumb__list\" {...listProps} __css={css}>\n {cloneChildren}\n </ui.ol>\n </ui.nav>\n </BreadcrumbProvider>\n )\n})\n\ninterface BreadcrumbItemOptions\n extends Pick<BreadcrumbProps, \"separator\" | \"gap\"> {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n /**\n * If `true`, not show separator.\n *\n * @default false\n */\n isLastChild?: boolean\n}\n\nexport interface BreadcrumbItemProps\n extends Omit<HTMLUIProps<\"li\">, \"gap\">,\n BreadcrumbItemOptions {}\n\nexport const BreadcrumbItem = forwardRef<BreadcrumbItemProps, \"li\">(\n (\n {\n className,\n children,\n separator,\n isCurrentPage,\n isLastChild,\n gap,\n ...rest\n },\n ref,\n ) => {\n const styles = useBreadcrumb()\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type === BreadcrumbLink) {\n return cloneElement(child, {\n isCurrentPage,\n })\n }\n\n if (child.type === BreadcrumbSeparator) {\n return cloneElement(child, {\n gap,\n children: child.props.children || separator,\n })\n }\n\n return child\n })\n\n const css: CSSUIObject = {\n display: \"inline-flex\",\n alignItems: \"center\",\n ...styles.item,\n }\n\n return (\n <ui.li\n ref={ref}\n className={cx(\"ui-breadcrumb__item\", className)}\n __css={css}\n {...rest}\n >\n {cloneChildren}\n\n {!isLastChild ? (\n <BreadcrumbSeparator gap={gap}>{separator}</BreadcrumbSeparator>\n ) : null}\n </ui.li>\n )\n },\n)\n\ninterface BreadcrumbLinkOptions {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n}\n\nexport interface BreadcrumbLinkProps\n extends HTMLUIProps<\"a\">,\n BreadcrumbLinkOptions {}\n\nexport const BreadcrumbLink = forwardRef<BreadcrumbLinkProps, \"a\">(\n ({ className, children, isCurrentPage, href, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n return (\n <ui.a\n ref={ref}\n as={!isCurrentPage ? \"a\" : \"span\"}\n href={!isCurrentPage ? href : undefined}\n aria-current={isCurrentPage ? \"page\" : undefined}\n className={cx(\"ui-breadcrumb__link\", className)}\n __css={styles.link}\n {...rest}\n >\n {children}\n </ui.a>\n )\n },\n)\n\ninterface BreadcrumbSeparatorOptions {\n /**\n * The CSS `margin-inline-start`, and `margin-inline-end` property.\n */\n gap?: CSSUIObject[\"mx\"]\n}\n\nexport interface BreadcrumbSeparatorProps\n extends Omit<HTMLUIProps<\"span\">, \"gap\">,\n BreadcrumbSeparatorOptions {}\n\nexport const BreadcrumbSeparator = forwardRef<BreadcrumbSeparatorProps, \"span\">(\n ({ children, gap: mx, ...rest }, ref) => {\n const styles = useBreadcrumb()\n const css: CSSUIObject = {\n mx,\n ...styles.separator,\n }\n\n return (\n <ui.span\n ref={ref}\n className=\"ui-breadcrumb__item__separator\"\n __css={css}\n {...rest}\n >\n {children}\n </ui.span>\n )\n },\n)\n\ninterface BreadcrumbEllipsisOptions {}\n\nexport interface BreadcrumbEllipsisProps\n extends IconProps,\n BreadcrumbEllipsisOptions {}\n\nexport const BreadcrumbEllipsis = forwardRef<BreadcrumbEllipsisProps, \"span\">(\n ({ children, className, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n const css: CSSUIObject = {\n ...styles.ellipsis,\n }\n\n return (\n children ?? (\n <Icon\n ref={ref}\n aria-label=\"ellipsis\"\n className={cx(\"ui-breadcrumb__item__ellipsis\", className)}\n __css={css}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 36 24\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n {...rest}\n >\n <circle cx=\"10\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"20\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"30\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n </Icon>\n )\n )\n },\n)\n"],"mappings":"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","names":["rest","props"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/breadcrumb.tsx"],"sourcesContent":["export {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbSeparator,\n BreadcrumbEllipsis,\n} from \"./breadcrumb\"\nexport type {\n BreadcrumbProps,\n BreadcrumbItemProps,\n BreadcrumbLinkProps,\n BreadcrumbSeparatorProps,\n BreadcrumbEllipsisProps,\n BreadcrumbGenerateItem,\n} from \"./breadcrumb\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n CSSUIProps,\n Token,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { Icon } from \"@yamada-ui/icon\"\nimport type { IconProps } from \"@yamada-ui/icon\"\nimport { useValue } from \"@yamada-ui/use-value\"\nimport {\n cx,\n createContext,\n getValidChildren,\n isNumber,\n runIfFunc,\n} from \"@yamada-ui/utils\"\nimport type { ReactNode } from \"react\"\nimport { Fragment, cloneElement, useCallback, useMemo } from \"react\"\n\nconst [BreadcrumbProvider, useBreadcrumb] = createContext<{\n [key: string]: CSSUIObject\n}>({\n name: \"BreadcrumbContext\",\n errorMessage: `useBreadcrumb returned is 'undefined'. Seems you forgot to wrap the components in \"<Breadcrumb />\" `,\n})\n\nexport interface BreadcrumbGenerateItem extends BreadcrumbLinkProps {\n name?: ReactNode\n containerProps?: Omit<BreadcrumbItemProps, \"isLastChild\">\n isEllipsisPage?: boolean\n}\n\ninterface BreadcrumbOptions {\n /**\n * The visual separator between each breadcrumb item.\n *\n * @default '/'\n */\n separator?: string | JSX.Element\n /**\n * The left and right margin applied to the separator.\n *\n * @default '2'\n */\n gap?: CSSUIProps[\"mx\"]\n /**\n * Props for ol element.\n */\n listProps?: HTMLUIProps<\"ol\">\n /**\n * If provided, generate breadcrumb items based on items.\n */\n items?: BreadcrumbGenerateItem[]\n /**\n * Number of elements visible on the start(left) edges.\n */\n startBoundaries?: Token<number>\n /**\n * Number of elements visible on the end(right) edges.\n */\n endBoundaries?: Token<number>\n /**\n * The icon to be used in the ellipsis.\n */\n ellipsis?:\n | ReactNode\n | ((props: { items: BreadcrumbGenerateItem[] }) => ReactNode)\n}\n\nexport interface BreadcrumbProps\n extends Omit<HTMLUIProps<\"nav\">, \"gap\">,\n ThemeProps<\"Breadcrumb\">,\n BreadcrumbOptions {}\n\n/**\n * `Breadcrumb` is a component that helps users understand the hierarchy of a website.\n *\n * @see Docs https://yamada-ui.com/components/navigation/breadcrumb\n */\nexport const Breadcrumb = forwardRef<BreadcrumbProps, \"nav\">((props, ref) => {\n const [styles, mergedProps] = useComponentMultiStyle(\"Breadcrumb\", props)\n\n const {\n className,\n children,\n separator = \"/\",\n gap = \"fallback(2, 0.5rem)\",\n listProps,\n items = [],\n startBoundaries: _startBoundaries,\n endBoundaries: _endBoundaries,\n ellipsis,\n ...rest\n } = omitThemeProps(mergedProps)\n let startBoundaries = useValue(_startBoundaries)\n let endBoundaries = useValue(_endBoundaries)\n\n if (startBoundaries === 0) startBoundaries = 1\n if (endBoundaries === 0) endBoundaries = 1\n\n if (startBoundaries) endBoundaries ??= 1\n if (endBoundaries) startBoundaries ??= 1\n\n const hasBoundaries = isNumber(startBoundaries) && isNumber(endBoundaries)\n const isExceed =\n hasBoundaries && startBoundaries! + endBoundaries! < items.length\n\n const css: CSSUIObject = {\n display: \"flex\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n const validChildren = getValidChildren(children)\n const hasChildren = validChildren.length\n\n const customEllipsis = useCallback(\n (providedItems?: BreadcrumbGenerateItem[]) => {\n if (!ellipsis) return null\n\n const resolvedItems =\n providedItems ??\n items.slice(startBoundaries!, items.length - endBoundaries!)\n\n return runIfFunc(ellipsis, { items: resolvedItems })\n },\n [ellipsis, endBoundaries, items, startBoundaries],\n )\n\n const cloneChildren = useMemo(() => {\n if (hasChildren) {\n return validChildren.map((child, index) =>\n cloneElement(child, {\n separator,\n gap,\n isLastChild: validChildren.length === index + 1,\n }),\n )\n } else {\n let hiddenEllipsis: BreadcrumbGenerateItem[] = []\n\n return items.map((item, index) => {\n const { containerProps, name, isCurrentPage, isEllipsisPage, ...rest } =\n item\n const isLastChild = items.length === index + 1\n const props: BreadcrumbItemProps = {\n separator,\n gap,\n isCurrentPage,\n ...containerProps,\n }\n\n if (!hasBoundaries && isEllipsisPage) {\n hiddenEllipsis.push(item)\n\n return isLastChild ? (\n <BreadcrumbItem key={index} {...props} isLastChild>\n {customEllipsis([item]) ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n ) : null\n }\n\n if (hasBoundaries && isExceed) {\n const lastIndex = items.length - index - 1\n\n if (startBoundaries! <= index && endBoundaries! <= lastIndex) {\n if (startBoundaries === index) {\n return (\n <BreadcrumbItem key={index} {...props}>\n {customEllipsis() ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n )\n } else {\n return null\n }\n }\n }\n\n if (hiddenEllipsis.length) {\n const resolvedEllipsis = customEllipsis(hiddenEllipsis) ?? (\n <BreadcrumbEllipsis />\n )\n\n hiddenEllipsis = []\n\n return (\n <Fragment key={index}>\n <BreadcrumbItem {...props}>{resolvedEllipsis}</BreadcrumbItem>\n\n <BreadcrumbItem {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n </Fragment>\n )\n } else {\n return (\n <BreadcrumbItem key={index} {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n )\n }\n })\n }\n }, [\n hasChildren,\n validChildren,\n separator,\n gap,\n items,\n hasBoundaries,\n isExceed,\n startBoundaries,\n endBoundaries,\n customEllipsis,\n ])\n\n return (\n <BreadcrumbProvider value={styles}>\n <ui.nav\n ref={ref}\n className={cx(\"ui-breadcrumb\", className)}\n __css={styles.container}\n aria-label=\"Breadcrumb\"\n {...rest}\n >\n <ui.ol className=\"ui-breadcrumb__list\" {...listProps} __css={css}>\n {cloneChildren}\n </ui.ol>\n </ui.nav>\n </BreadcrumbProvider>\n )\n})\n\nBreadcrumb.displayName = \"Breadcrumb\"\nBreadcrumb.__ui__ = \"Breadcrumb\"\n\ninterface BreadcrumbItemOptions\n extends Pick<BreadcrumbProps, \"separator\" | \"gap\"> {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n /**\n * If `true`, not show separator.\n *\n * @default false\n */\n isLastChild?: boolean\n}\n\nexport interface BreadcrumbItemProps\n extends Omit<HTMLUIProps<\"li\">, \"gap\">,\n BreadcrumbItemOptions {}\n\nexport const BreadcrumbItem = forwardRef<BreadcrumbItemProps, \"li\">(\n (\n {\n className,\n children,\n separator,\n isCurrentPage,\n isLastChild,\n gap,\n ...rest\n },\n ref,\n ) => {\n const styles = useBreadcrumb()\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type === BreadcrumbLink) {\n return cloneElement(child, {\n isCurrentPage,\n })\n }\n\n if (child.type === BreadcrumbSeparator) {\n return cloneElement(child, {\n gap,\n children: child.props.children || separator,\n })\n }\n\n return child\n })\n\n const css: CSSUIObject = {\n display: \"inline-flex\",\n alignItems: \"center\",\n ...styles.item,\n }\n\n return (\n <ui.li\n ref={ref}\n className={cx(\"ui-breadcrumb__item\", className)}\n __css={css}\n {...rest}\n >\n {cloneChildren}\n\n {!isLastChild ? (\n <BreadcrumbSeparator gap={gap}>{separator}</BreadcrumbSeparator>\n ) : null}\n </ui.li>\n )\n },\n)\n\nBreadcrumbItem.displayName = \"BreadcrumbItem\"\nBreadcrumbItem.__ui__ = \"BreadcrumbItem\"\n\ninterface BreadcrumbLinkOptions {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n}\n\nexport interface BreadcrumbLinkProps\n extends HTMLUIProps<\"a\">,\n BreadcrumbLinkOptions {}\n\nexport const BreadcrumbLink = forwardRef<BreadcrumbLinkProps, \"a\">(\n ({ className, children, isCurrentPage, href, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n return (\n <ui.a\n ref={ref}\n as={!isCurrentPage ? \"a\" : \"span\"}\n href={!isCurrentPage ? href : undefined}\n aria-current={isCurrentPage ? \"page\" : undefined}\n className={cx(\"ui-breadcrumb__link\", className)}\n __css={styles.link}\n {...rest}\n >\n {children}\n </ui.a>\n )\n },\n)\nBreadcrumbLink.displayName = \"BreadcrumbLink\"\nBreadcrumbLink.__ui__ = \"BreadcrumbLink\"\n\ninterface BreadcrumbSeparatorOptions {\n /**\n * The CSS `margin-inline-start`, and `margin-inline-end` property.\n */\n gap?: CSSUIObject[\"mx\"]\n}\n\nexport interface BreadcrumbSeparatorProps\n extends Omit<HTMLUIProps<\"span\">, \"gap\">,\n BreadcrumbSeparatorOptions {}\n\nexport const BreadcrumbSeparator = forwardRef<BreadcrumbSeparatorProps, \"span\">(\n ({ children, gap: mx, ...rest }, ref) => {\n const styles = useBreadcrumb()\n const css: CSSUIObject = {\n mx,\n ...styles.separator,\n }\n\n return (\n <ui.span\n ref={ref}\n className=\"ui-breadcrumb__item__separator\"\n __css={css}\n {...rest}\n >\n {children}\n </ui.span>\n )\n },\n)\n\nBreadcrumbSeparator.displayName = \"BreadcrumbSeparator\"\nBreadcrumbSeparator.__ui__ = \"BreadcrumbSeparator\"\n\ninterface BreadcrumbEllipsisOptions {}\n\nexport interface BreadcrumbEllipsisProps\n extends IconProps,\n BreadcrumbEllipsisOptions {}\n\nexport const BreadcrumbEllipsis = forwardRef<BreadcrumbEllipsisProps, \"span\">(\n ({ children, className, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n const css: CSSUIObject = {\n ...styles.ellipsis,\n }\n\n return (\n children ?? (\n <Icon\n ref={ref}\n aria-label=\"ellipsis\"\n className={cx(\"ui-breadcrumb__item__ellipsis\", className)}\n __css={css}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 36 24\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n {...rest}\n >\n <circle cx=\"10\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"20\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"30\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n </Icon>\n )\n )\n },\n)\n\nBreadcrumbEllipsis.displayName = \"BreadcrumbEllipsis\"\nBreadcrumbEllipsis.__ui__ = \"BreadcrumbEllipsis\"\n"],"mappings":"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","names":["rest","props"]}
|
package/dist/index.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yamada-ui/breadcrumb",
|
|
3
|
-
"version": "1.3.12-dev-
|
|
3
|
+
"version": "1.3.12-dev-20240923064845",
|
|
4
4
|
"description": "Yamada UI breadcrumb component",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"yamada",
|
|
@@ -36,10 +36,10 @@
|
|
|
36
36
|
"url": "https://github.com/yamada-ui/yamada-ui/issues"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@yamada-ui/core": "1.15.1-dev-
|
|
40
|
-
"@yamada-ui/icon": "1.1.7-dev-
|
|
41
|
-
"@yamada-ui/use-value": "1.1.26-dev-
|
|
42
|
-
"@yamada-ui/utils": "1.5.2-dev-
|
|
39
|
+
"@yamada-ui/core": "1.15.1-dev-20240923064845",
|
|
40
|
+
"@yamada-ui/icon": "1.1.7-dev-20240923064845",
|
|
41
|
+
"@yamada-ui/use-value": "1.1.26-dev-20240923064845",
|
|
42
|
+
"@yamada-ui/utils": "1.5.2-dev-20240923064845"
|
|
43
43
|
},
|
|
44
44
|
"devDependencies": {
|
|
45
45
|
"clean-package": "2.2.0",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/breadcrumb.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n CSSUIProps,\n Token,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { Icon } from \"@yamada-ui/icon\"\nimport type { IconProps } from \"@yamada-ui/icon\"\nimport { useValue } from \"@yamada-ui/use-value\"\nimport {\n cx,\n createContext,\n getValidChildren,\n isNumber,\n runIfFunc,\n} from \"@yamada-ui/utils\"\nimport type { ReactNode } from \"react\"\nimport { Fragment, cloneElement, useCallback, useMemo } from \"react\"\n\nconst [BreadcrumbProvider, useBreadcrumb] = createContext<{\n [key: string]: CSSUIObject\n}>({\n name: \"BreadcrumbContext\",\n errorMessage: `useBreadcrumb returned is 'undefined'. Seems you forgot to wrap the components in \"<Breadcrumb />\" `,\n})\n\nexport interface BreadcrumbGenerateItem extends BreadcrumbLinkProps {\n name?: ReactNode\n containerProps?: Omit<BreadcrumbItemProps, \"isLastChild\">\n isEllipsisPage?: boolean\n}\n\ninterface BreadcrumbOptions {\n /**\n * The visual separator between each breadcrumb item.\n *\n * @default '/'\n */\n separator?: string | JSX.Element\n /**\n * The left and right margin applied to the separator.\n *\n * @default '2'\n */\n gap?: CSSUIProps[\"mx\"]\n /**\n * Props for ol element.\n */\n listProps?: HTMLUIProps<\"ol\">\n /**\n * If provided, generate breadcrumb items based on items.\n */\n items?: BreadcrumbGenerateItem[]\n /**\n * Number of elements visible on the start(left) edges.\n */\n startBoundaries?: Token<number>\n /**\n * Number of elements visible on the end(right) edges.\n */\n endBoundaries?: Token<number>\n /**\n * The icon to be used in the ellipsis.\n */\n ellipsis?:\n | ReactNode\n | ((props: { items: BreadcrumbGenerateItem[] }) => ReactNode)\n}\n\nexport interface BreadcrumbProps\n extends Omit<HTMLUIProps<\"nav\">, \"gap\">,\n ThemeProps<\"Breadcrumb\">,\n BreadcrumbOptions {}\n\n/**\n * `Breadcrumb` is a component that helps users understand the hierarchy of a website.\n *\n * @see Docs https://yamada-ui.com/components/navigation/breadcrumb\n */\nexport const Breadcrumb = forwardRef<BreadcrumbProps, \"nav\">((props, ref) => {\n const [styles, mergedProps] = useComponentMultiStyle(\"Breadcrumb\", props)\n\n const {\n className,\n children,\n separator = \"/\",\n gap = \"fallback(2, 0.5rem)\",\n listProps,\n items = [],\n startBoundaries: _startBoundaries,\n endBoundaries: _endBoundaries,\n ellipsis,\n ...rest\n } = omitThemeProps(mergedProps)\n let startBoundaries = useValue(_startBoundaries)\n let endBoundaries = useValue(_endBoundaries)\n\n if (startBoundaries === 0) startBoundaries = 1\n if (endBoundaries === 0) endBoundaries = 1\n\n if (startBoundaries) endBoundaries ??= 1\n if (endBoundaries) startBoundaries ??= 1\n\n const hasBoundaries = isNumber(startBoundaries) && isNumber(endBoundaries)\n const isExceed =\n hasBoundaries && startBoundaries! + endBoundaries! < items.length\n\n const css: CSSUIObject = {\n display: \"flex\",\n alignItems: \"center\",\n ...styles.container,\n }\n\n const validChildren = getValidChildren(children)\n const hasChildren = validChildren.length\n\n const customEllipsis = useCallback(\n (providedItems?: BreadcrumbGenerateItem[]) => {\n if (!ellipsis) return null\n\n const resolvedItems =\n providedItems ??\n items.slice(startBoundaries!, items.length - endBoundaries!)\n\n return runIfFunc(ellipsis, { items: resolvedItems })\n },\n [ellipsis, endBoundaries, items, startBoundaries],\n )\n\n const cloneChildren = useMemo(() => {\n if (hasChildren) {\n return validChildren.map((child, index) =>\n cloneElement(child, {\n separator,\n gap,\n isLastChild: validChildren.length === index + 1,\n }),\n )\n } else {\n let hiddenEllipsis: BreadcrumbGenerateItem[] = []\n\n return items.map((item, index) => {\n const { containerProps, name, isCurrentPage, isEllipsisPage, ...rest } =\n item\n const isLastChild = items.length === index + 1\n const props: BreadcrumbItemProps = {\n separator,\n gap,\n isCurrentPage,\n ...containerProps,\n }\n\n if (!hasBoundaries && isEllipsisPage) {\n hiddenEllipsis.push(item)\n\n return isLastChild ? (\n <BreadcrumbItem key={index} {...props} isLastChild>\n {customEllipsis([item]) ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n ) : null\n }\n\n if (hasBoundaries && isExceed) {\n const lastIndex = items.length - index - 1\n\n if (startBoundaries! <= index && endBoundaries! <= lastIndex) {\n if (startBoundaries === index) {\n return (\n <BreadcrumbItem key={index} {...props}>\n {customEllipsis() ?? <BreadcrumbEllipsis />}\n </BreadcrumbItem>\n )\n } else {\n return null\n }\n }\n }\n\n if (hiddenEllipsis.length) {\n const resolvedEllipsis = customEllipsis(hiddenEllipsis) ?? (\n <BreadcrumbEllipsis />\n )\n\n hiddenEllipsis = []\n\n return (\n <Fragment key={index}>\n <BreadcrumbItem {...props}>{resolvedEllipsis}</BreadcrumbItem>\n\n <BreadcrumbItem {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n </Fragment>\n )\n } else {\n return (\n <BreadcrumbItem key={index} {...props} isLastChild={isLastChild}>\n <BreadcrumbLink {...rest}>{name}</BreadcrumbLink>\n </BreadcrumbItem>\n )\n }\n })\n }\n }, [\n hasChildren,\n validChildren,\n separator,\n gap,\n items,\n hasBoundaries,\n isExceed,\n startBoundaries,\n endBoundaries,\n customEllipsis,\n ])\n\n return (\n <BreadcrumbProvider value={styles}>\n <ui.nav\n ref={ref}\n className={cx(\"ui-breadcrumb\", className)}\n __css={styles.container}\n aria-label=\"Breadcrumb\"\n {...rest}\n >\n <ui.ol className=\"ui-breadcrumb__list\" {...listProps} __css={css}>\n {cloneChildren}\n </ui.ol>\n </ui.nav>\n </BreadcrumbProvider>\n )\n})\n\ninterface BreadcrumbItemOptions\n extends Pick<BreadcrumbProps, \"separator\" | \"gap\"> {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n /**\n * If `true`, not show separator.\n *\n * @default false\n */\n isLastChild?: boolean\n}\n\nexport interface BreadcrumbItemProps\n extends Omit<HTMLUIProps<\"li\">, \"gap\">,\n BreadcrumbItemOptions {}\n\nexport const BreadcrumbItem = forwardRef<BreadcrumbItemProps, \"li\">(\n (\n {\n className,\n children,\n separator,\n isCurrentPage,\n isLastChild,\n gap,\n ...rest\n },\n ref,\n ) => {\n const styles = useBreadcrumb()\n\n const validChildren = getValidChildren(children)\n\n const cloneChildren = validChildren.map((child) => {\n if (child.type === BreadcrumbLink) {\n return cloneElement(child, {\n isCurrentPage,\n })\n }\n\n if (child.type === BreadcrumbSeparator) {\n return cloneElement(child, {\n gap,\n children: child.props.children || separator,\n })\n }\n\n return child\n })\n\n const css: CSSUIObject = {\n display: \"inline-flex\",\n alignItems: \"center\",\n ...styles.item,\n }\n\n return (\n <ui.li\n ref={ref}\n className={cx(\"ui-breadcrumb__item\", className)}\n __css={css}\n {...rest}\n >\n {cloneChildren}\n\n {!isLastChild ? (\n <BreadcrumbSeparator gap={gap}>{separator}</BreadcrumbSeparator>\n ) : null}\n </ui.li>\n )\n },\n)\n\ninterface BreadcrumbLinkOptions {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n}\n\nexport interface BreadcrumbLinkProps\n extends HTMLUIProps<\"a\">,\n BreadcrumbLinkOptions {}\n\nexport const BreadcrumbLink = forwardRef<BreadcrumbLinkProps, \"a\">(\n ({ className, children, isCurrentPage, href, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n return (\n <ui.a\n ref={ref}\n as={!isCurrentPage ? \"a\" : \"span\"}\n href={!isCurrentPage ? href : undefined}\n aria-current={isCurrentPage ? \"page\" : undefined}\n className={cx(\"ui-breadcrumb__link\", className)}\n __css={styles.link}\n {...rest}\n >\n {children}\n </ui.a>\n )\n },\n)\n\ninterface BreadcrumbSeparatorOptions {\n /**\n * The CSS `margin-inline-start`, and `margin-inline-end` property.\n */\n gap?: CSSUIObject[\"mx\"]\n}\n\nexport interface BreadcrumbSeparatorProps\n extends Omit<HTMLUIProps<\"span\">, \"gap\">,\n BreadcrumbSeparatorOptions {}\n\nexport const BreadcrumbSeparator = forwardRef<BreadcrumbSeparatorProps, \"span\">(\n ({ children, gap: mx, ...rest }, ref) => {\n const styles = useBreadcrumb()\n const css: CSSUIObject = {\n mx,\n ...styles.separator,\n }\n\n return (\n <ui.span\n ref={ref}\n className=\"ui-breadcrumb__item__separator\"\n __css={css}\n {...rest}\n >\n {children}\n </ui.span>\n )\n },\n)\n\ninterface BreadcrumbEllipsisOptions {}\n\nexport interface BreadcrumbEllipsisProps\n extends IconProps,\n BreadcrumbEllipsisOptions {}\n\nexport const BreadcrumbEllipsis = forwardRef<BreadcrumbEllipsisProps, \"span\">(\n ({ children, className, ...rest }, ref) => {\n const styles = useBreadcrumb()\n\n const css: CSSUIObject = {\n ...styles.ellipsis,\n }\n\n return (\n children ?? (\n <Icon\n ref={ref}\n aria-label=\"ellipsis\"\n className={cx(\"ui-breadcrumb__item__ellipsis\", className)}\n __css={css}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 36 24\"\n stroke=\"currentColor\"\n strokeWidth=\"1.5\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n {...rest}\n >\n <circle cx=\"10\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"20\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n <circle cx=\"30\" cy=\"12\" r=\"2\" fill=\"currentColor\" />\n </Icon>\n )\n )\n },\n)\n"],"mappings":"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","names":["rest","props"]}
|