@ladder-ui/breadcrumb 0.10.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Ivan Avila
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/breadcrumb.css

@@ -0,0 +1 @@
+@layer components{.lui-breadcrumb{display:block;font-family:var(--lui-font-family);font-size:var(--lui-breadcrumb-font-size)}.lui-breadcrumb__list{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0}.lui-breadcrumb__item,.lui-breadcrumb__list{align-items:center;gap:var(--lui-breadcrumb-gap)}.lui-breadcrumb__item{display:inline-flex}.lui-breadcrumb__link{color:var(--lui-breadcrumb-text);cursor:pointer;text-decoration:none;transition:var(--lui-breadcrumb-transition)}.lui-breadcrumb__link:hover{color:var(--lui-breadcrumb-text-hover);text-decoration:underline;text-underline-offset:3px}.lui-breadcrumb__link:focus-visible{border-radius:var(--lui-radius-sm,2px);box-shadow:var(--lui-breadcrumb-focus-ring);outline:none}.lui-breadcrumb__page{color:var(--lui-breadcrumb-text-active);cursor:default;font-weight:500}.lui-breadcrumb__separator{align-items:center;color:var(--lui-breadcrumb-separator-color);display:flex;flex-shrink:0;user-select:none}.lui-breadcrumb__separator[aria-hidden=true]{pointer-events:none}.lui-breadcrumb__separator svg{block-size:var(--lui-breadcrumb-ellipsis-size);inline-size:var(--lui-breadcrumb-ellipsis-size)}.lui-breadcrumb__ellipsis{align-items:center;color:var(--lui-breadcrumb-text);cursor:default;display:inline-flex;gap:.25rem;justify-content:center}.lui-breadcrumb__ellipsis svg{block-size:var(--lui-breadcrumb-ellipsis-size);inline-size:var(--lui-breadcrumb-ellipsis-size)}.lui-breadcrumb .sr-only{clip:rect(0,0,0,0);block-size:1px;border-width:0;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap}.lui-breadcrumb__dropdown{align-items:center;display:inline-flex;position:relative}.lui-breadcrumb__dropdown-trigger{align-items:center;appearance:none;background:none;border:none;color:var(--lui-breadcrumb-dropdown-trigger-text);cursor:pointer;display:inline-flex;font-family:inherit;font-size:inherit;gap:.25rem;line-height:inherit;margin:0;padding:0;text-decoration:none;transition:var(--lui-breadcrumb-transition)}.lui-breadcrumb__dropdown-trigger:hover{color:var(--lui-breadcrumb-text-hover);text-decoration:underline;text-underline-offset:3px}.lui-breadcrumb__dropdown-trigger:focus-visible{border-radius:var(--lui-radius-sm,2px);box-shadow:var(--lui-breadcrumb-focus-ring);outline:none}.lui-breadcrumb__dropdown-icon{flex-shrink:0;opacity:.55;transition:opacity var(--lui-transition,.15s ease)}@media (prefers-reduced-motion:reduce){.lui-breadcrumb__dropdown-icon{transition:none}}.lui-breadcrumb__dropdown-trigger:hover .lui-breadcrumb__dropdown-icon,.lui-breadcrumb__dropdown-trigger[aria-expanded=true] .lui-breadcrumb__dropdown-icon{opacity:1}}

package/dist/breadcrumb.d.ts

@@ -0,0 +1,57 @@
+import type { Ref } from "react";
+import React from "react";
+export interface BreadcrumbProps extends React.HTMLAttributes<HTMLElement> {
+    ref?: Ref<HTMLElement>;
+}
+export declare function Breadcrumb({ ref, className, children, "aria-label": ariaLabel, ...props }: BreadcrumbProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Breadcrumb {
+    var displayName: string;
+}
+export interface BreadcrumbListProps extends React.OlHTMLAttributes<HTMLOListElement> {
+    ref?: Ref<HTMLOListElement>;
+}
+export declare function BreadcrumbList({ ref, className, children, ...props }: BreadcrumbListProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace BreadcrumbList {
+    var displayName: string;
+}
+export interface BreadcrumbItemProps extends React.LiHTMLAttributes<HTMLLIElement> {
+    ref?: Ref<HTMLLIElement>;
+}
+export declare function BreadcrumbItem({ ref, className, children, ...props }: BreadcrumbItemProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace BreadcrumbItem {
+    var displayName: string;
+}
+export interface BreadcrumbLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
+    ref?: Ref<HTMLAnchorElement>;
+    /**
+     * When true, renders only the child element and merges BreadcrumbLink
+     * class/style onto it — useful for framework-specific routers
+     * (e.g. Next.js <Link>, React Router <Link>).
+     */
+    asChild?: boolean;
+}
+export declare function BreadcrumbLink({ ref, className, children, href, asChild, target, rel, ...props }: BreadcrumbLinkProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace BreadcrumbLink {
+    var displayName: string;
+}
+export interface BreadcrumbPageProps extends React.HTMLAttributes<HTMLSpanElement> {
+    ref?: Ref<HTMLSpanElement>;
+}
+export declare function BreadcrumbPage({ ref, className, children, ...props }: BreadcrumbPageProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace BreadcrumbPage {
+    var displayName: string;
+}
+export interface BreadcrumbSeparatorProps extends React.LiHTMLAttributes<HTMLLIElement> {
+    ref?: Ref<HTMLLIElement>;
+}
+export declare function BreadcrumbSeparator({ ref, className, children, ...props }: BreadcrumbSeparatorProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace BreadcrumbSeparator {
+    var displayName: string;
+}
+export interface BreadcrumbEllipsisProps extends React.HTMLAttributes<HTMLSpanElement> {
+    ref?: Ref<HTMLSpanElement>;
+}
+export declare function BreadcrumbEllipsis({ ref, className, ...props }: BreadcrumbEllipsisProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace BreadcrumbEllipsis {
+    var displayName: string;
+}

package/dist/breadcrumb.vars.css

@@ -0,0 +1 @@
+:root{--lui-breadcrumb-text:var(--lui-text-secondary);--lui-breadcrumb-text-active:var(--lui-text-primary);--lui-breadcrumb-text-hover:var(--lui-text-primary);--lui-breadcrumb-separator-color:var(--lui-text-disabled);--lui-breadcrumb-font-size:var(--lui-text-sm,0.875rem);--lui-breadcrumb-ellipsis-size:1rem;--lui-breadcrumb-gap-base:0.375rem;--lui-breadcrumb-gap:calc(var(--lui-breadcrumb-gap-base)*var(--lui-density-factor, 1));--lui-breadcrumb-focus-ring:0 0 0 2px var(--lui-bg-surface),0 0 0 4px var(--lui-border-focus);--lui-breadcrumb-transition:color var(--lui-transition,150ms ease);--lui-breadcrumb-dropdown-trigger-text:var(--lui-breadcrumb-text)}

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export { Breadcrumb, type BreadcrumbProps, BreadcrumbList, type BreadcrumbListProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbPage, type BreadcrumbPageProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, } from "./breadcrumb";
+export { Breadcrumb as default } from "./breadcrumb";

package/dist/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("react/jsx-runtime"),e=require("@ladder-ui/core/concatClassNames"),a=require("react");function s({ref:a,className:s,children:l,"aria-label":i="breadcrumb",...t}){return r.jsx("nav",{ref:a,"aria-label":i,"data-slot":"breadcrumb",className:e("lui-breadcrumb",s),...t,children:l})}function l({ref:a,className:s,children:l,...i}){return r.jsx("ol",{ref:a,"data-slot":"breadcrumb-list",className:e("lui-breadcrumb__list",s),...i,children:l})}function i({ref:a,className:s,children:l,...i}){return r.jsx("li",{ref:a,"data-slot":"breadcrumb-item",className:e("lui-breadcrumb__item",s),...i,children:l})}function t({ref:s,className:l,children:i,href:t,asChild:c=!1,target:n,rel:d,...o}){const u=e("lui-breadcrumb__link",l);t&&!(r=>/^(https?:\/\/|\/|#)/.test(r))(t)&&(process.env.NODE_ENV,t=void 0);const m="_blank"===n?d??"noopener noreferrer":d;if(c){const r=a.Children.only(i);return a.cloneElement(r,{...o,ref:s,"data-slot":"breadcrumb-link",className:e(u,String(r.props.className??"")),href:t,target:n,rel:m})}return r.jsx("a",{ref:s,"data-slot":"breadcrumb-link",className:u,href:t,target:n,rel:m,...o,children:i})}function c({ref:a,className:s,children:l,...i}){return r.jsx("span",{ref:a,"data-slot":"breadcrumb-page","aria-current":"page","aria-disabled":"true",role:"link",className:e("lui-breadcrumb__page",s),...i,children:l})}function n({ref:a,className:s,children:l,...i}){return r.jsx("li",{ref:a,"data-slot":"breadcrumb-separator","aria-hidden":"true",className:e("lui-breadcrumb__separator",s),...i,children:l??r.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:r.jsx("polyline",{points:"9 18 15 12 9 6"})})})}function d({ref:a,className:s,...l}){return r.jsxs("span",{ref:a,"data-slot":"breadcrumb-ellipsis","aria-hidden":"true",className:e("lui-breadcrumb__ellipsis",s),...l,children:[r.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:[r.jsx("circle",{cx:"12",cy:"12",r:"1"}),r.jsx("circle",{cx:"19",cy:"12",r:"1"}),r.jsx("circle",{cx:"5",cy:"12",r:"1"})]}),r.jsx("span",{className:"sr-only",children:"More"})]})}s.displayName="Breadcrumb",l.displayName="BreadcrumbList",i.displayName="BreadcrumbItem",t.displayName="BreadcrumbLink",c.displayName="BreadcrumbPage",n.displayName="BreadcrumbSeparator",d.displayName="BreadcrumbEllipsis",exports.Breadcrumb=s,exports.BreadcrumbEllipsis=d,exports.BreadcrumbItem=i,exports.BreadcrumbLink=t,exports.BreadcrumbList=l,exports.BreadcrumbPage=c,exports.BreadcrumbSeparator=n,exports.default=s;

package/dist/index.mjs

@@ -0,0 +1 @@
+import{jsx as r,jsxs as e}from"react/jsx-runtime";import a from"@ladder-ui/core/concatClassNames";import l from"react";function i({ref:e,className:l,children:i,"aria-label":s="breadcrumb",...t}){return r("nav",{ref:e,"aria-label":s,"data-slot":"breadcrumb",className:a("lui-breadcrumb",l),...t,children:i})}function s({ref:e,className:l,children:i,...s}){return r("ol",{ref:e,"data-slot":"breadcrumb-list",className:a("lui-breadcrumb__list",l),...s,children:i})}function t({ref:e,className:l,children:i,...s}){return r("li",{ref:e,"data-slot":"breadcrumb-item",className:a("lui-breadcrumb__item",l),...s,children:i})}function c({ref:e,className:i,children:s,href:t,asChild:c=!1,target:n,rel:d,...o}){const m=a("lui-breadcrumb__link",i);t&&!(r=>/^(https?:\/\/|\/|#)/.test(r))(t)&&(process.env.NODE_ENV,t=void 0);const u="_blank"===n?d??"noopener noreferrer":d;if(c){const r=l.Children.only(s);return l.cloneElement(r,{...o,ref:e,"data-slot":"breadcrumb-link",className:a(m,String(r.props.className??"")),href:t,target:n,rel:u})}return r("a",{ref:e,"data-slot":"breadcrumb-link",className:m,href:t,target:n,rel:u,...o,children:s})}function n({ref:e,className:l,children:i,...s}){return r("span",{ref:e,"data-slot":"breadcrumb-page","aria-current":"page","aria-disabled":"true",role:"link",className:a("lui-breadcrumb__page",l),...s,children:i})}function d({ref:e,className:l,children:i,...s}){return r("li",{ref:e,"data-slot":"breadcrumb-separator","aria-hidden":"true",className:a("lui-breadcrumb__separator",l),...s,children:i??r("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:r("polyline",{points:"9 18 15 12 9 6"})})})}function o({ref:l,className:i,...s}){return e("span",{ref:l,"data-slot":"breadcrumb-ellipsis","aria-hidden":"true",className:a("lui-breadcrumb__ellipsis",i),...s,children:[e("svg",{xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:[r("circle",{cx:"12",cy:"12",r:"1"}),r("circle",{cx:"19",cy:"12",r:"1"}),r("circle",{cx:"5",cy:"12",r:"1"})]}),r("span",{className:"sr-only",children:"More"})]})}i.displayName="Breadcrumb",s.displayName="BreadcrumbList",t.displayName="BreadcrumbItem",c.displayName="BreadcrumbLink",n.displayName="BreadcrumbPage",d.displayName="BreadcrumbSeparator",o.displayName="BreadcrumbEllipsis";export{i as Breadcrumb,o as BreadcrumbEllipsis,t as BreadcrumbItem,c as BreadcrumbLink,s as BreadcrumbList,n as BreadcrumbPage,d as BreadcrumbSeparator,i as default};

package/package.json

@@ -0,0 +1,70 @@
+{
+  "name": "@ladder-ui/breadcrumb",
+  "version": "0.10.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "require": "./dist/index.js",
+      "import": "./dist/index.mjs",
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.mjs"
+    },
+    "./*.css": "./dist/*.css",
+    "./styles/*.css": "./dist/*.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "keywords": [
+    "nodejs",
+    "react",
+    "ui",
+    "components",
+    "library",
+    "breadcrumb",
+    "navigation",
+    "wayfinding"
+  ],
+  "author": "Ivan Avila <ivelaval@gmail.com> - https://www.vennet.dev",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ivelaval/ladder-ui.git",
+    "directory": "packages/breadcrumb"
+  },
+  "bugs": {
+    "url": "https://github.com/ivelaval/ladder-ui/issues"
+  },
+  "homepage": "https://github.com/ivelaval/ladder-ui#readme",
+  "publishConfig": {
+    "access": "public"
+  },
+  "devDependencies": {
+    "@rollup/plugin-typescript": "^11.1.6",
+    "@types/react": "^19.0.0",
+    "rollup": "^4.59.0",
+    "rollup-plugin-postcss": "^4.0.2",
+    "sass": "^1.90.0",
+    "tslib": "^2.6.2",
+    "typescript": "^5.3.3",
+    "@ladder-ui/core": "0.10.0"
+  },
+  "peerDependencies": {
+    "@ladder-ui/core": ">=0.0.0",
+    "react": ">=18.0.0"
+  },
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "scripts": {
+    "build": "pnpm clean && rollup -c",
+    "dev": "rollup -c -w",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "type-check": "tsc --noEmit",
+    "clean": "rm -rf dist"
+  }
+}