@yamada-ui/breadcrumb 0.3.24 → 0.3.26
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 +1 -0
- package/dist/breadcrumb.js.map +1 -0
- package/dist/breadcrumb.mjs +2 -1
- package/dist/breadcrumb.mjs.map +1 -0
- package/dist/{chunk-WFL7NZBC.mjs → chunk-LGNDF4BB.mjs} +1 -0
- package/dist/chunk-LGNDF4BB.mjs.map +1 -0
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +2 -1
- package/dist/index.mjs.map +1 -0
- package/package.json +5 -4
package/dist/breadcrumb.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/breadcrumb.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n CSSUIProps,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport { cx, createContext, getValidChildren } from \"@yamada-ui/utils\"\nimport { cloneElement } from \"react\"\n\nconst [BreadcrumbProvider, useBreadcrumb] = createContext<\n Record<string, CSSUIObject>\n>({\n name: `BreadcrumbContext`,\n errorMessage: `useBreadcrumb returned is 'undefined'. Seems you forgot to wrap the components in \"<Breadcrumb />\" `,\n})\n\ntype 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 'sm'\n */\n gap?: CSSUIProps[\"mx\"]\n /**\n * Props for ol element.\n */\n listProps?: HTMLUIProps<\"ol\">\n}\n\nexport type BreadcrumbProps = Omit<HTMLUIProps<\"nav\">, \"gap\"> &\n ThemeProps<\"Breadcrumb\"> &\n BreadcrumbOptions\n\nexport const Breadcrumb = forwardRef<BreadcrumbProps, \"nav\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Breadcrumb\", props)\n\n const {\n className,\n children,\n separator = \"/\",\n gap = \"sm\",\n listProps,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\n display: \"flex\",\n alignItems: \"center\",\n ...styles.list,\n }\n\n const validChildren = getValidChildren(children)\n const count = validChildren.length\n\n const cloneChildren = validChildren.map((child, index) =>\n cloneElement(child, {\n separator,\n gap,\n isLastChild: count === index + 1,\n }),\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 {...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\ntype BreadcrumbItemOptions = 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 type BreadcrumbItemProps = HTMLUIProps<\"li\"> & BreadcrumbItemOptions\n\nexport const BreadcrumbItem = forwardRef<BreadcrumbItemOptions, \"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\ntype BreadcrumbLinkOptions = {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n}\n\nexport type BreadcrumbLinkProps = HTMLUIProps<\"a\"> & 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\ntype BreadcrumbSeparatorOptions = {\n /**\n * The CSS `margin-inline-start`, and `margin-inline-end` property.\n */\n gap?: CSSUIObject[\"mx\"]\n}\n\nexport type BreadcrumbSeparatorProps = HTMLUIProps<\"span\"> &\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"],"mappings":"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","names":[]}
|
package/dist/breadcrumb.mjs
CHANGED
|
@@ -4,10 +4,11 @@ import {
|
|
|
4
4
|
BreadcrumbItem,
|
|
5
5
|
BreadcrumbLink,
|
|
6
6
|
BreadcrumbSeparator
|
|
7
|
-
} from "./chunk-
|
|
7
|
+
} from "./chunk-LGNDF4BB.mjs";
|
|
8
8
|
export {
|
|
9
9
|
Breadcrumb,
|
|
10
10
|
BreadcrumbItem,
|
|
11
11
|
BreadcrumbLink,
|
|
12
12
|
BreadcrumbSeparator
|
|
13
13
|
};
|
|
14
|
+
//# sourceMappingURL=breadcrumb.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/breadcrumb.tsx"],"sourcesContent":["import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n CSSUIProps,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport { cx, createContext, getValidChildren } from \"@yamada-ui/utils\"\nimport { cloneElement } from \"react\"\n\nconst [BreadcrumbProvider, useBreadcrumb] = createContext<\n Record<string, CSSUIObject>\n>({\n name: `BreadcrumbContext`,\n errorMessage: `useBreadcrumb returned is 'undefined'. Seems you forgot to wrap the components in \"<Breadcrumb />\" `,\n})\n\ntype 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 'sm'\n */\n gap?: CSSUIProps[\"mx\"]\n /**\n * Props for ol element.\n */\n listProps?: HTMLUIProps<\"ol\">\n}\n\nexport type BreadcrumbProps = Omit<HTMLUIProps<\"nav\">, \"gap\"> &\n ThemeProps<\"Breadcrumb\"> &\n BreadcrumbOptions\n\nexport const Breadcrumb = forwardRef<BreadcrumbProps, \"nav\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Breadcrumb\", props)\n\n const {\n className,\n children,\n separator = \"/\",\n gap = \"sm\",\n listProps,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\n display: \"flex\",\n alignItems: \"center\",\n ...styles.list,\n }\n\n const validChildren = getValidChildren(children)\n const count = validChildren.length\n\n const cloneChildren = validChildren.map((child, index) =>\n cloneElement(child, {\n separator,\n gap,\n isLastChild: count === index + 1,\n }),\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 {...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\ntype BreadcrumbItemOptions = 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 type BreadcrumbItemProps = HTMLUIProps<\"li\"> & BreadcrumbItemOptions\n\nexport const BreadcrumbItem = forwardRef<BreadcrumbItemOptions, \"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\ntype BreadcrumbLinkOptions = {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n}\n\nexport type BreadcrumbLinkProps = HTMLUIProps<\"a\"> & 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\ntype BreadcrumbSeparatorOptions = {\n /**\n * The CSS `margin-inline-start`, and `margin-inline-end` property.\n */\n gap?: CSSUIObject[\"mx\"]\n}\n\nexport type BreadcrumbSeparatorProps = HTMLUIProps<\"span\"> &\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"],"mappings":"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","names":[]}
|
package/dist/index.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/breadcrumb.tsx"],"sourcesContent":["export {\n Breadcrumb,\n BreadcrumbItem,\n BreadcrumbLink,\n BreadcrumbSeparator,\n} from \"./breadcrumb\"\nexport type {\n BreadcrumbProps,\n BreadcrumbItemProps,\n BreadcrumbLinkProps,\n BreadcrumbSeparatorProps,\n} from \"./breadcrumb\"\n","import type {\n HTMLUIProps,\n ThemeProps,\n CSSUIObject,\n CSSUIProps,\n} from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n omitThemeProps,\n useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport { cx, createContext, getValidChildren } from \"@yamada-ui/utils\"\nimport { cloneElement } from \"react\"\n\nconst [BreadcrumbProvider, useBreadcrumb] = createContext<\n Record<string, CSSUIObject>\n>({\n name: `BreadcrumbContext`,\n errorMessage: `useBreadcrumb returned is 'undefined'. Seems you forgot to wrap the components in \"<Breadcrumb />\" `,\n})\n\ntype 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 'sm'\n */\n gap?: CSSUIProps[\"mx\"]\n /**\n * Props for ol element.\n */\n listProps?: HTMLUIProps<\"ol\">\n}\n\nexport type BreadcrumbProps = Omit<HTMLUIProps<\"nav\">, \"gap\"> &\n ThemeProps<\"Breadcrumb\"> &\n BreadcrumbOptions\n\nexport const Breadcrumb = forwardRef<BreadcrumbProps, \"nav\">((props, ref) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Breadcrumb\", props)\n\n const {\n className,\n children,\n separator = \"/\",\n gap = \"sm\",\n listProps,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const css: CSSUIObject = {\n display: \"flex\",\n alignItems: \"center\",\n ...styles.list,\n }\n\n const validChildren = getValidChildren(children)\n const count = validChildren.length\n\n const cloneChildren = validChildren.map((child, index) =>\n cloneElement(child, {\n separator,\n gap,\n isLastChild: count === index + 1,\n }),\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 {...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\ntype BreadcrumbItemOptions = 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 type BreadcrumbItemProps = HTMLUIProps<\"li\"> & BreadcrumbItemOptions\n\nexport const BreadcrumbItem = forwardRef<BreadcrumbItemOptions, \"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\ntype BreadcrumbLinkOptions = {\n /**\n * If `true`, change to span element.\n *\n * @default false\n */\n isCurrentPage?: boolean\n}\n\nexport type BreadcrumbLinkProps = HTMLUIProps<\"a\"> & 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\ntype BreadcrumbSeparatorOptions = {\n /**\n * The CSS `margin-inline-start`, and `margin-inline-end` property.\n */\n gap?: CSSUIObject[\"mx\"]\n}\n\nexport type BreadcrumbSeparatorProps = HTMLUIProps<\"span\"> &\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"],"mappings":"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","names":[]}
|
package/dist/index.mjs
CHANGED
|
@@ -4,10 +4,11 @@ import {
|
|
|
4
4
|
BreadcrumbItem,
|
|
5
5
|
BreadcrumbLink,
|
|
6
6
|
BreadcrumbSeparator
|
|
7
|
-
} from "./chunk-
|
|
7
|
+
} from "./chunk-LGNDF4BB.mjs";
|
|
8
8
|
export {
|
|
9
9
|
Breadcrumb,
|
|
10
10
|
BreadcrumbItem,
|
|
11
11
|
BreadcrumbLink,
|
|
12
12
|
BreadcrumbSeparator
|
|
13
13
|
};
|
|
14
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yamada-ui/breadcrumb",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.26",
|
|
4
4
|
"description": "Yamada UI breadcrumb component",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"yamada",
|
|
@@ -35,8 +35,8 @@
|
|
|
35
35
|
"url": "https://github.com/hirotomoyamada/yamada-ui/issues"
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@yamada-ui/core": "0.14.
|
|
39
|
-
"@yamada-ui/utils": "0.
|
|
38
|
+
"@yamada-ui/core": "0.14.2",
|
|
39
|
+
"@yamada-ui/utils": "0.5.0"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
42
|
"react": "^18.0.0",
|
|
@@ -55,7 +55,8 @@
|
|
|
55
55
|
],
|
|
56
56
|
"banner": {
|
|
57
57
|
"js": "\"use client\""
|
|
58
|
-
}
|
|
58
|
+
},
|
|
59
|
+
"sourcemap": true
|
|
59
60
|
},
|
|
60
61
|
"module": "dist/index.mjs",
|
|
61
62
|
"types": "dist/index.d.ts",
|