@fpkit/acss 2.1.0 → 3.0.0

package/libs/chunk-5PJYLVFY.cjs

@@ -1,17 +0,0 @@
-'use strict';
-
-var chunkENTCUJ3A_cjs = require('./chunk-ENTCUJ3A.cjs');
-var o = require('react');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var o__default = /*#__PURE__*/_interopDefault(o);
-
-var i=o__default.default.forwardRef(({href:e,target:n,rel:r,children:t,styles:k,prefetch:s=!1,btnStyle:m,onClick:L,onPointerDown:d,...c},l)=>{let u=o__default.default.useMemo(()=>{if(n==="_blank"){let f=new Set(["noopener","noreferrer"]);return s&&f.add("prefetch"),r&&r.split(/\s+/).forEach(p=>{p&&f.add(p);}),Array.from(f).join(" ")}return r},[n,r,s]);return o__default.default.createElement(chunkENTCUJ3A_cjs.a,{as:"a",ref:l,href:e,target:n,rel:u,styles:k,"data-btn":m,onClick:L,onPointerDown:d,...c},t)}),y=o__default.default.forwardRef(({href:e,icon:n,...r},t)=>o__default.default.createElement(i,{ref:t,href:e,...r},n)),h=o__default.default.forwardRef(({href:e,children:n,...r},t)=>o__default.default.createElement(i,{ref:t,href:e,...r},n));y.displayName="IconLink";h.displayName="LinkButton";i.displayName="Link";var x=i;
-
-exports.a = i;
-exports.b = y;
-exports.c = h;
-exports.d = x;
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-5PJYLVFY.cjs.map

package/libs/chunk-5PJYLVFY.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/link/link.tsx"],"names":["React","Link","href","target","rel","children","styles","prefetch","btnStyle","onClick","onPointerDown","props","ref","computedRel","securityTokens","token","ui_default","IconLink","icon","LinkButton","link_default"],"mappings":"oCAAA,OAAOA,MAAW,QA+FX,IAAMC,EAAOD,EAAM,WACxB,CACE,CACE,KAAAE,EACA,OAAAC,EACA,IAAAC,EACA,SAAAC,EACA,OAAAC,EACA,SAAAC,EAAW,GACX,SAAAC,EACA,QAAAC,EACA,cAAAC,EACA,GAAGC,CACL,EACAC,IACG,CAWH,IAAMC,EAAcb,EAAM,QAAQ,IAAM,CACtC,GAAIG,IAAW,SAAU,CAEvB,IAAMW,EAAiB,IAAI,IAAI,CAAC,WAAY,YAAY,CAAC,EAGzD,OAAIP,GACFO,EAAe,IAAI,UAAU,EAI3BV,GACFA,EAAI,MAAM,KAAK,EAAE,QAASW,GAAU,CAC9BA,GAAOD,EAAe,IAAIC,CAAK,CACrC,CAAC,EAGI,MAAM,KAAKD,CAAc,EAAE,KAAK,GAAG,CAC5C,CAGA,OAAOV,CACT,EAAG,CAACD,EAAQC,EAAKG,CAAQ,CAAC,EAE1B,OACEP,EAAA,cAACgB,EAAA,CACC,GAAG,IACH,IAAKJ,EACL,KAAMV,EACN,OAAQC,EACR,IAAKU,EACL,OAAQP,EACR,WAAUE,EACV,QAASC,EACT,cAAeC,EACd,GAAGC,GAEHN,CACH,CAEJ,CACF,EAEaY,EAAWjB,EAAM,WAC5B,CAAC,CAAE,KAAAE,EAAM,KAAAgB,EAAM,GAAGP,CAAM,EAAGC,IAEvBZ,EAAA,cAACC,EAAA,CAAK,IAAKW,EAAK,KAAMV,EAAO,GAAGS,GAC7BO,CACH,CAGN,EAEaC,EAAanB,EAAM,WAC9B,CAAC,CAAE,KAAAE,EAAM,SAAAG,EAAU,GAAGM,CAAM,EAAGC,IAE3BZ,EAAA,cAACC,EAAA,CAAK,IAAKW,EAAK,KAAMV,EAAO,GAAGS,GAC7BN,CACH,CAGN,EAEAY,EAAS,YAAc,WACvBE,EAAW,YAAc,aACzBlB,EAAK,YAAc,OAEnB,IAAOmB,EAAQnB","sourcesContent":["import React from \"react\";\nimport UI from \"../ui\";\nimport type { LinkProps } from \"./link.types\";\n\n/**\n * Link - A semantic, accessible anchor component with enhanced security and styling.\n *\n * The Link component renders accessible `<a>` elements with automatic security\n * attributes for external links, customizable styling variants, and full WCAG 2.1\n * AA compliance. It supports traditional text links, button-styled links, and\n * programmatic focus management via ref forwarding.\n *\n * ## Features\n *\n * - 🔒 **Automatic Security**: External links get `rel=\"noopener noreferrer\"`\n * - ♿ **WCAG 2.1 AA Compliant**: Accessible focus indicators and semantic HTML\n * - 🎨 **Flexible Styling**: Text links, button links, and pill variants\n * - ⚡ **Performance**: Optional prefetch hints for faster navigation\n * - 🎯 **Ref Forwarding**: Direct DOM access for focus management and scroll\n * - 🧪 **Type-Safe**: Full TypeScript support with comprehensive prop types\n *\n * ## Accessibility\n *\n * - ✅ Semantic `<a>` element for proper keyboard navigation\n * - ✅ Focus indicators meet WCAG 2.4.7 (3:1 contrast ratio)\n * - ✅ Screen readers announce link purpose and destination\n * - ✅ External links include security attributes automatically\n * - ✅ Supports `aria-label` for icon-only or ambiguous links\n * - ✅ Ref forwarding enables skip-link patterns\n *\n * @example\n * // Basic internal link\n * <Link href=\"/about\">About Us</Link>\n *\n * @example\n * // External link with automatic security\n * <Link href=\"https://example.com\" target=\"_blank\">\n *   Visit Example\n * </Link>\n *\n * @example\n * // Button-styled call-to-action link\n * <Link href=\"/signup\">\n *   <b>Get Started</b>\n * </Link>\n *\n * @example\n * // Icon-only link with accessible label\n * <Link href=\"/settings\" aria-label=\"Open settings\">\n *   <SettingsIcon aria-hidden=\"true\" />\n * </Link>\n *\n * @example\n * // Analytics tracking with onClick (includes keyboard users)\n * <Link\n *   href=\"/products\"\n *   onClick={(e) => trackEvent('link_click', { href: '/products' })}\n * >\n *   Browse Products\n * </Link>\n *\n * @example\n * // Skip link with ref forwarding for focus management\n * const mainRef = useRef<HTMLAnchorElement>(null);\n *\n * <Link ref={mainRef} href=\"#main-content\">\n *   Skip to main content\n * </Link>\n *\n * @example\n * // Custom styled link with CSS variables\n * <Link\n *   href=\"/products\"\n *   styles={{\n *     '--link-color': '#0066cc',\n *     '--link-decoration': 'underline',\n *   }}\n * >\n *   Browse Products\n * </Link>\n *\n * @example\n * // ✅ GOOD: Descriptive link text\n * <Link href=\"/docs/installation\">\n *   Read installation guide\n * </Link>\n *\n * @example\n * // ❌ BAD: Generic link text (poor for screen readers)\n * <Link href=\"/docs/installation\">\n *   Click here\n * </Link>\n *\n * @see {@link LinkProps} for complete prop documentation\n */\nexport const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(\n  (\n    {\n      href,\n      target,\n      rel,\n      children,\n      styles,\n      prefetch = false,\n      btnStyle,\n      onClick,\n      onPointerDown,\n      ...props\n    },\n    ref\n  ) => {\n    /**\n     * Compute the final `rel` attribute value with security defaults.\n     *\n     * For external links (target=\"_blank\"), we merge user-provided `rel` values\n     * with security defaults `noopener noreferrer` to prevent:\n     * - window.opener exploitation (noopener)\n     * - Referrer header leakage (noreferrer)\n     *\n     * If prefetch is enabled, we also add the `prefetch` hint.\n     */\n    const computedRel = React.useMemo(() => {\n      if (target === \"_blank\") {\n        // Start with security defaults\n        const securityTokens = new Set([\"noopener\", \"noreferrer\"]);\n\n        // Add prefetch if enabled\n        if (prefetch) {\n          securityTokens.add(\"prefetch\");\n        }\n\n        // Merge with user-provided rel tokens (if any)\n        if (rel) {\n          rel.split(/\\s+/).forEach((token) => {\n            if (token) securityTokens.add(token);\n          });\n        }\n\n        return Array.from(securityTokens).join(\" \");\n      }\n\n      // For non-external links, use provided rel as-is\n      return rel;\n    }, [target, rel, prefetch]);\n\n    return (\n      <UI\n        as=\"a\"\n        ref={ref}\n        href={href}\n        target={target}\n        rel={computedRel}\n        styles={styles}\n        data-btn={btnStyle}\n        onClick={onClick}\n        onPointerDown={onPointerDown}\n        {...props}\n      >\n        {children}\n      </UI>\n    );\n  }\n);\n\nexport const IconLink = React.forwardRef<HTMLAnchorElement, LinkProps>(\n  ({ href, icon, ...props }, ref) => {\n    return (\n      <Link ref={ref} href={href} {...props}>\n        {icon}\n      </Link>\n    );\n  }\n);\n\nexport const LinkButton = React.forwardRef<HTMLAnchorElement, LinkProps>(\n  ({ href, children, ...props }, ref) => {\n    return (\n      <Link ref={ref} href={href} {...props}>\n        {children}\n      </Link>\n    );\n  }\n);\n\nIconLink.displayName = \"IconLink\";\nLinkButton.displayName = \"LinkButton\";\nLink.displayName = \"Link\";\n\nexport default Link;\n"]}

package/libs/chunk-NNTBIHSD.js

@@ -1,8 +0,0 @@
-import { a } from './chunk-HHLNOC5T.js';
-import o from 'react';
-
-var i=o.forwardRef(({href:e,target:n,rel:r,children:t,styles:k,prefetch:s=!1,btnStyle:m,onClick:L,onPointerDown:d,...c},l)=>{let u=o.useMemo(()=>{if(n==="_blank"){let f=new Set(["noopener","noreferrer"]);return s&&f.add("prefetch"),r&&r.split(/\s+/).forEach(p=>{p&&f.add(p);}),Array.from(f).join(" ")}return r},[n,r,s]);return o.createElement(a,{as:"a",ref:l,href:e,target:n,rel:u,styles:k,"data-btn":m,onClick:L,onPointerDown:d,...c},t)}),y=o.forwardRef(({href:e,icon:n,...r},t)=>o.createElement(i,{ref:t,href:e,...r},n)),h=o.forwardRef(({href:e,children:n,...r},t)=>o.createElement(i,{ref:t,href:e,...r},n));y.displayName="IconLink";h.displayName="LinkButton";i.displayName="Link";var x=i;
-
-export { i as a, y as b, h as c, x as d };
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=chunk-NNTBIHSD.js.map

package/libs/chunk-NNTBIHSD.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/link/link.tsx"],"names":["React","Link","href","target","rel","children","styles","prefetch","btnStyle","onClick","onPointerDown","props","ref","computedRel","securityTokens","token","ui_default","IconLink","icon","LinkButton","link_default"],"mappings":"mCAAA,OAAOA,MAAW,QA+FX,IAAMC,EAAOD,EAAM,WACxB,CACE,CACE,KAAAE,EACA,OAAAC,EACA,IAAAC,EACA,SAAAC,EACA,OAAAC,EACA,SAAAC,EAAW,GACX,SAAAC,EACA,QAAAC,EACA,cAAAC,EACA,GAAGC,CACL,EACAC,IACG,CAWH,IAAMC,EAAcb,EAAM,QAAQ,IAAM,CACtC,GAAIG,IAAW,SAAU,CAEvB,IAAMW,EAAiB,IAAI,IAAI,CAAC,WAAY,YAAY,CAAC,EAGzD,OAAIP,GACFO,EAAe,IAAI,UAAU,EAI3BV,GACFA,EAAI,MAAM,KAAK,EAAE,QAASW,GAAU,CAC9BA,GAAOD,EAAe,IAAIC,CAAK,CACrC,CAAC,EAGI,MAAM,KAAKD,CAAc,EAAE,KAAK,GAAG,CAC5C,CAGA,OAAOV,CACT,EAAG,CAACD,EAAQC,EAAKG,CAAQ,CAAC,EAE1B,OACEP,EAAA,cAACgB,EAAA,CACC,GAAG,IACH,IAAKJ,EACL,KAAMV,EACN,OAAQC,EACR,IAAKU,EACL,OAAQP,EACR,WAAUE,EACV,QAASC,EACT,cAAeC,EACd,GAAGC,GAEHN,CACH,CAEJ,CACF,EAEaY,EAAWjB,EAAM,WAC5B,CAAC,CAAE,KAAAE,EAAM,KAAAgB,EAAM,GAAGP,CAAM,EAAGC,IAEvBZ,EAAA,cAACC,EAAA,CAAK,IAAKW,EAAK,KAAMV,EAAO,GAAGS,GAC7BO,CACH,CAGN,EAEaC,EAAanB,EAAM,WAC9B,CAAC,CAAE,KAAAE,EAAM,SAAAG,EAAU,GAAGM,CAAM,EAAGC,IAE3BZ,EAAA,cAACC,EAAA,CAAK,IAAKW,EAAK,KAAMV,EAAO,GAAGS,GAC7BN,CACH,CAGN,EAEAY,EAAS,YAAc,WACvBE,EAAW,YAAc,aACzBlB,EAAK,YAAc,OAEnB,IAAOmB,EAAQnB","sourcesContent":["import React from \"react\";\nimport UI from \"../ui\";\nimport type { LinkProps } from \"./link.types\";\n\n/**\n * Link - A semantic, accessible anchor component with enhanced security and styling.\n *\n * The Link component renders accessible `<a>` elements with automatic security\n * attributes for external links, customizable styling variants, and full WCAG 2.1\n * AA compliance. It supports traditional text links, button-styled links, and\n * programmatic focus management via ref forwarding.\n *\n * ## Features\n *\n * - 🔒 **Automatic Security**: External links get `rel=\"noopener noreferrer\"`\n * - ♿ **WCAG 2.1 AA Compliant**: Accessible focus indicators and semantic HTML\n * - 🎨 **Flexible Styling**: Text links, button links, and pill variants\n * - ⚡ **Performance**: Optional prefetch hints for faster navigation\n * - 🎯 **Ref Forwarding**: Direct DOM access for focus management and scroll\n * - 🧪 **Type-Safe**: Full TypeScript support with comprehensive prop types\n *\n * ## Accessibility\n *\n * - ✅ Semantic `<a>` element for proper keyboard navigation\n * - ✅ Focus indicators meet WCAG 2.4.7 (3:1 contrast ratio)\n * - ✅ Screen readers announce link purpose and destination\n * - ✅ External links include security attributes automatically\n * - ✅ Supports `aria-label` for icon-only or ambiguous links\n * - ✅ Ref forwarding enables skip-link patterns\n *\n * @example\n * // Basic internal link\n * <Link href=\"/about\">About Us</Link>\n *\n * @example\n * // External link with automatic security\n * <Link href=\"https://example.com\" target=\"_blank\">\n *   Visit Example\n * </Link>\n *\n * @example\n * // Button-styled call-to-action link\n * <Link href=\"/signup\">\n *   <b>Get Started</b>\n * </Link>\n *\n * @example\n * // Icon-only link with accessible label\n * <Link href=\"/settings\" aria-label=\"Open settings\">\n *   <SettingsIcon aria-hidden=\"true\" />\n * </Link>\n *\n * @example\n * // Analytics tracking with onClick (includes keyboard users)\n * <Link\n *   href=\"/products\"\n *   onClick={(e) => trackEvent('link_click', { href: '/products' })}\n * >\n *   Browse Products\n * </Link>\n *\n * @example\n * // Skip link with ref forwarding for focus management\n * const mainRef = useRef<HTMLAnchorElement>(null);\n *\n * <Link ref={mainRef} href=\"#main-content\">\n *   Skip to main content\n * </Link>\n *\n * @example\n * // Custom styled link with CSS variables\n * <Link\n *   href=\"/products\"\n *   styles={{\n *     '--link-color': '#0066cc',\n *     '--link-decoration': 'underline',\n *   }}\n * >\n *   Browse Products\n * </Link>\n *\n * @example\n * // ✅ GOOD: Descriptive link text\n * <Link href=\"/docs/installation\">\n *   Read installation guide\n * </Link>\n *\n * @example\n * // ❌ BAD: Generic link text (poor for screen readers)\n * <Link href=\"/docs/installation\">\n *   Click here\n * </Link>\n *\n * @see {@link LinkProps} for complete prop documentation\n */\nexport const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(\n  (\n    {\n      href,\n      target,\n      rel,\n      children,\n      styles,\n      prefetch = false,\n      btnStyle,\n      onClick,\n      onPointerDown,\n      ...props\n    },\n    ref\n  ) => {\n    /**\n     * Compute the final `rel` attribute value with security defaults.\n     *\n     * For external links (target=\"_blank\"), we merge user-provided `rel` values\n     * with security defaults `noopener noreferrer` to prevent:\n     * - window.opener exploitation (noopener)\n     * - Referrer header leakage (noreferrer)\n     *\n     * If prefetch is enabled, we also add the `prefetch` hint.\n     */\n    const computedRel = React.useMemo(() => {\n      if (target === \"_blank\") {\n        // Start with security defaults\n        const securityTokens = new Set([\"noopener\", \"noreferrer\"]);\n\n        // Add prefetch if enabled\n        if (prefetch) {\n          securityTokens.add(\"prefetch\");\n        }\n\n        // Merge with user-provided rel tokens (if any)\n        if (rel) {\n          rel.split(/\\s+/).forEach((token) => {\n            if (token) securityTokens.add(token);\n          });\n        }\n\n        return Array.from(securityTokens).join(\" \");\n      }\n\n      // For non-external links, use provided rel as-is\n      return rel;\n    }, [target, rel, prefetch]);\n\n    return (\n      <UI\n        as=\"a\"\n        ref={ref}\n        href={href}\n        target={target}\n        rel={computedRel}\n        styles={styles}\n        data-btn={btnStyle}\n        onClick={onClick}\n        onPointerDown={onPointerDown}\n        {...props}\n      >\n        {children}\n      </UI>\n    );\n  }\n);\n\nexport const IconLink = React.forwardRef<HTMLAnchorElement, LinkProps>(\n  ({ href, icon, ...props }, ref) => {\n    return (\n      <Link ref={ref} href={href} {...props}>\n        {icon}\n      </Link>\n    );\n  }\n);\n\nexport const LinkButton = React.forwardRef<HTMLAnchorElement, LinkProps>(\n  ({ href, children, ...props }, ref) => {\n    return (\n      <Link ref={ref} href={href} {...props}>\n        {children}\n      </Link>\n    );\n  }\n);\n\nIconLink.displayName = \"IconLink\";\nLinkButton.displayName = \"LinkButton\";\nLink.displayName = \"Link\";\n\nexport default Link;\n"]}