1import{a as k}from"./chunk-IAIZO75W.js";import{a as O}from"./chunk-NDU2TYXE.js";import{a as A}from"./chunk-4E3RRH4I.js";import{a as w}from"./chunk-CWUYLIUS.js";import{a as E}from"./chunk-AQI4XNHL.js";import{a as C}from"./chunk-BMTB4ZZX.js";import{a as x}from"./chunk-24JSAHGV.js";import{a as v}from"./chunk-YYQE3GHW.js";import{a as S}from"./chunk-RVW4MGQ2.js";import{a as T}from"./chunk-QTSERVLD.js";import{a as N}from"./chunk-IHKTM7CG.js";import{a as y}from"./chunk-4PLM7PM6.js";import{a as g}from"./chunk-YPIX2W27.js";import{a as f}from"./chunk-34RIJOB3.js";import{a as I,b}from"./chunk-YY4YCK5F.js";import"./chunk-RMZUX6ZM.js";import"./chunk-B7EPENHE.js";import{a as d}from"./chunk-NK4PWXL5.js";import{b as u}from"./chunk-NBWJT3WU.js";import"./chunk-T7SA5VQS.js";import"./chunk-NVNIRCRG.js";import"./chunk-WRCSE6XA.js";import"./chunk-VJOG7BHU.js";import"./chunk-RIE32WQ5.js";import"./chunk-D7UVY4ND.js";import"./chunk-Y65KIHR3.js";import"./chunk-HP5QCM5I.js";import"./chunk-T4UYT6YZ.js";import"./chunk-DPXL5ZHC.js";import{Jb as h,Kb as l,Lb as p,Mb as i,_ as m,ob as a}from"./chunk-TUWXKLON.js";import"./chunk-Z4C26HH6.js";import{a as r,b as c}from"./chunk-OSQMNGTH.js";var s=class o{static \u0275fac=function(e){return new(e||o)};static \u0275cmp=a({type:o,selectors:[["app-mixin-icons-example"]],decls:9,vars:0,consts:[[1,"d-flex","flex-wrap","align-items-center","gap-4"],[1,"d-flex","flex-wrap","align-items-center","gap-3",2,"font-size","1.5rem"],["name","cloud"],["name","bell"],["name","star"],[1,"icon-mixin-scope","d-flex","flex-wrap","align-items-center","gap-3"]],template:function(e,n){e&1&&(l(0,"div",0)(1,"div",1),i(2,"hub-icon",2)(3,"hub-icon",3)(4,"hub-icon",4),p(),l(5,"div",5),i(6,"hub-icon",2)(7,"hub-icon",3)(8,"hub-icon",4),p()())},dependencies:[u],styles:[".icon-mixin-scope[_ngcontent-%COMP%]{--hub-icon-color: #7c3aed;--hub-icon-size: 2rem}"],changeDetection:1})};var L={"icons-setup":y,"icons-font-awesome":w,"icons-bootstrap":E,"icons-material":C,"icons-solar":x,"icons-svg":v,"icons-sprite":S,"icons-img":T,"icons-variants":N,"icons-directive":k,"icons-theming":O,"icons-buttons":A},P=class o{exampleGroups=d;_exampleRegistry=m(I);
1iconsLibrary={title:"ng-hub-ui-icons",description:"Icon-set-agnostic icon rendering for Angular. Render Font Awesome, Bootstrap Icons, Material Symbols, Solar or your own SVGs through one API \u2014 with no hard dependency on any icon pack \u2014 and theme them all uniformly through `--hub-icon-*` CSS variables.",overview:{text:"ng-hub-ui-icons decouples how you reference an icon from which icon set draws it. A pack is a pure resolver (name, variant?) \u2192 render spec; the library ships factories and presets for the popular sets but bundles none of them, so your bundle stays lean and you can mix sets freely. The app loads each set's CSS/font/SVG; the library only knows the naming conventions and themes every pack the same way through one `--hub-icon-*` token set.",highlights:[{icon:"fa-solid fa-shapes",title:"Set-agnostic",description:"Font Awesome, Bootstrap Icons, Material Symbols, Solar, sprites, inline SVG and <img> \u2014 all behind one API."},{icon:"fa-solid fa-feather",title:"Zero icon dependencies",description:"No fonts or SVGs bundled. You load the set; the library formats its names and themes it."},{icon:"fa-solid fa-plug",title:"Component & directive",description:"<hub-icon> for standalone icons and [hubIcon] to decorate your own element."},{icon:"fa-solid fa-sliders",title:"Central registry",description:"provideHubIcons({ defaultPack, packs }) with per-call pack / variant overrides and a pack:variant:name shorthand."},{icon:"fa-solid fa-palette",title:"Uniform theming",description:"One --hub-icon-* token set (size, color and variable-font axes) themes every pack identically."},{icon:"fa-solid fa-puzzle-piece",title:"Just project it",description:"No adapters or wiring \u2014 drop <hub-icon> into any component (buttons, menus, links) and it renders. Position follows the markup."}],changelog:[{version:"22.4.0",date:"2026-09-23",changes:[{type:"changed",description:"BREAKING: the Angular floor rises from 17.1.0 to 17.3.0. The old range was measured from the source alone, and its published `.d.ts` names `InputSignalWithTransform` or `OutputEmitterRef`, which Angular did not ship until 17.3. An application below the new floor could install this package and then fail to build; it now gets the peer warning it should always have had. Nothing that worked stops working. See BREAKING_CHANGES.md."}]},{version:"22.3.4",date:"2026-09-23",changes:[{type:"changed",description:"The Angular peer range now says what the code needs. It asked for >=21.0.0, which nothing in this package justified: the newest Angular API the source uses is input(), which shipped in 17.1, and the compiled output carries no linker marker above it. The range is >=17.1.0, and npm run peers:floors derives and checks that floor from now on."}]},{version:"22.3.3",date:"2026-09-21",changes:[{type:"fixed",description:"The hubIcon directive builds its sprite and image nodes instead of interpolating markup. The use and img render kinds were assembled as an HTML string, so a quote inside the resolved href, src or alt closed the attribute and the rest landed in the host as markup."}]},{version:"22.3.2",date:"2026-09-16",changes:[{type:"changed",description:"Repository, issue and README links follow the move to the hub-env organization. Issues for every Hub UI package are now gathered in hub-env/hub-ui, and the repository and bugs fields of the manifest point at the new addresses. No code, types or styles change."}]},{version:"22.3.1",date:"2026-09-08",changes:[{type:"added",description:"ng-hub-ui-ds is declared as an optional peer dependency (>=22.0.0). The whole --hub-icon-* block resolves through the family --hub-sys-* / --hub-ref-* ladder, which is how an icon follows the theme ink and its dark mode without being told to, and the manifest said nothing about it, so a consumer reading the package on npm had no way to learn which package supplies those values. It is genuinely optional: every token ends in a literal fallback and the renderer works without it."}]},{version:"22.3.0",date:"2026-09-07",changes:[{type:"fixed",description:'A colour utility on an icon does something again. <hub-icon class="text-danger"> came out in the default ink, and so did text-warning, text-success and every other utility: the library declared its own color in a rule named .hub-icon \u2014 one class, exactly what a utility is \u2014 and this stylesheet is
1injected at runtime, so it always lands after the sheet the application shipped. Tied on specificity, decided by source order, the primitive won. Every rule the library lands on the icon element is now written through :where(), which matches the same element and contributes zero specificity, so any declaration a consumer writes wins whatever the order \u2014 including classes this library will never hear of. Two consequences worth reading before upgrading, in BREAKING_CHANGES.md.'},{type:"changed",description:"The color input is now also written as an inline color, beside the --hub-icon-color it has always set: with the token read from a zero-specificity rule it would otherwise lose to a utility class on the same element, and an input written on one icon and no other is the more deliberate of the two."},{type:"changed",description:"An SVG icon now takes its fill from currentColor instead of var(--hub-icon-color). The element's own color is where the token, a utility and the color input have already been resolved against each other, so reading it back keeps a drawn glyph and a filled path the same colour."}]},{version:"22.2.0",date:"2026-09-07",changes:[{type:"added",description:'label on the [hubIcon] directive, the same accessible-name input hub-icon already had: it exposes the host as role="img" with that aria-label, and without it the icon is decorative.'},{type:"fixed",description:`A screen reader no longer reads the icon's name out loud. The directive declared nothing but class="hub-icon" on its host, so every icon drawn with [hubIcon] was an unlabelled element in the accessibility tree; and with a ligature font such as Material Symbols the mechanism that draws the glyph is the icon's name written as text inside the element, so what got announced was the word "home" beside the link that already said Home. The text has to stay for the glyph to be drawn, so it is hidden rather than removed: a label-less icon is now aria-hidden="true" and a labelled one is role="img" with its aria-label. This is what hub-icon has always done; the directive had been left behind. Breaking for a host carrying its own role, aria-label or aria-hidden \u2014 see BREAKING_CHANGES.md.`}]},{version:"22.1.3",date:"2026-09-06",changes:[{type:"added",description:"FUNCTIONALITIES.md, the per-feature coverage table the rest of the ecosystem ships, so a reader can see what the library does and which parts a live example actually demonstrates instead of inferring both from the list of examples."},{type:"fixed",description:"The cssVars bridge now follows the pack that actually draws the icon. resolve() expands the pack:variant:name shorthand but the bridge lookup read the pack input alone, so an icon written with the shorthand was dressed with the default pack's custom properties, or with none, while binding the pack explicitly got the right ones. HubIconRegistry.cssVars() takes the icon name as an optional second argument so both entry points expand the same reference the same way and existing calls keep working. Latent for consumers of the shipped presets, none of which declares a bridge, and breaking for anyone who wrote a pack with one and used the documented shorthand."},{type:"fixed",description:"The input table now describes the directive as well as the component. name was listed as required for both forms, but on [hubIcon] it is optional and falls back to the value bound to the directive, and hubIcon itself appeared in no table at all, so the only way to learn it existed was to read the source. The documentation links pointed at the site root too, leaving the reader to hunt for the icons page, and now open it directly."},{type:"fixed",description:"The stylesheets are reachable by the subpath the README documents. The manifest declared no exports, so ng-packagr generated the minimal map and every sheet shipped in styles/ stayed outside the package's public surface. Resolvers that fall back to the filesystem found them anyway, which is why nobody noticed, while anything resolving strictly through exports answered ERR_PACKAGE_PATH_NOT_EXPORTED on the very line the docs tell you to write. The styles subpath now resolves, along with the icon, icon-base and icon-theme sheets."}]},{version:"22.1.2",date:"2026-09-01",changes:[{type:"changed",description:"The package manifest's homepage now points at this library's own documentation page instead of the site root, so the link a registry shows beside the package lands on the reference the reader was already after."}]},{version:"22.1.1",date:"2026-08-08",changes:[{type:"fixed",description:"Documentation links now point at the canonical localized URLs. The README linked to https://hubui.dev/<path> with no locale prefix and no trailing slash, and both forms are 301-redirected, so every reader arriving from npm or GitHub landed on a redirect instead of the canonical page."}]},{version:"22.1.0",date:"2026-07-07",changes:[{type:"added",description:"hub-icon-theme(...) mixin \u2014 one-call token theming for <hub-icon> / [hubIcon]: color, size, and the variable-font axes weight / fill / grade / optical-size. Null-defaulted and additive; @use 'ng-hub-ui-icons/styles' as *;."}]},{version:"22.0.0",date:"2026-07-01",changes:[{type:"added",description:"Initial release: <hub-icon> component and [hubIcon] directive, agnostic to the icon set."},{type:"added",description:"provideHubIcons pack registry; classPack / ligaturePack / svgPack factories and faPack / bootstrapPack / materialSymbolsPack / solarPack presets."},{type:"added",description:"Uniform --hub-icon-* theming (size, color and variable-font axes), so one token set themes every pack identically."}]}]},functionalities:[],api:{inputs:[{name:"name (hub-icon)",type:"string",required:!0,description:"DOCS.ICONS.API.INPUT.NAME.DESCRIPTION"},{name:"name ([hubIcon])",type:"string",required:!1,defaultValue:"''",description:"DOCS.ICONS.API.INPUT.NAME_DIRECTIVE.DESCRIPTION"},{name:"hubIcon ([hubIcon])",type:"string",required:!1,defaultValue:"''",description:"DOCS.ICONS.API.INPUT.HUB_ICON.DESCRIPTION"},{name:"pack",type:"string",required:!1,defaultValue:"defaultPack",description:"DOCS.ICONS.API.INPUT.PACK.DESCRIPTION"},{name:"variant",type:"string",required:!1,description:"DOCS.ICONS.API.INPUT.VARIA
1NT.DESCRIPTION"},{name:"size (hub-icon)",type:"string",required:!1,defaultValue:"1em",description:"DOCS.ICONS.API.INPUT.SIZE.DESCRIPTION"},{name:"color (hub-icon)",type:"string",required:!1,defaultValue:"currentColor",description:"DOCS.ICONS.API.INPUT.COLOR.DESCRIPTION"},{name:"label",type:"string",required:!1,description:"DOCS.ICONS.API.INPUT.LABEL.DESCRIPTION"},{name:"spin (hub-icon)",type:"boolean",required:!1,defaultValue:"false",description:"DOCS.ICONS.API.INPUT.SPIN.DESCRIPTION"}],outputs:[],templates:[],cssVariables:f.icons??[]},styling:[],mixins:c(r({},g.icons),{demos:[{title:"Theming with hub-icon-theme",previewComponent:s,code:`@use 'ng-hub-ui-icons/styles' as icons; 2 3.icon-mixin-scope { 4 @include icons.hub-icon-theme($color: #7c3aed, $size: 2rem); 5}`}]})};ngOnInit(){this.registerExamples(),this.populateFunctionalitiesFromRegistry()}registerExamples(){[{id:"icons-setup",title:"DOCS.ICONS.EXAMPLE.SETUP.TITLE",componentName:"IconsSetupExampleComponent",files:["icons-setup-example.component.ts"],loader:()=>import("./chunk-EZKVWD6B.js").then(e=>e.IconsSetupExampleComponent)},{id:"icons-font-awesome",title:"DOCS.ICONS.EXAMPLE.FONT_AWESOME.TITLE",componentName:"IconsFontAwesomeExampleComponent",files:["icons-font-awesome-example.component.ts"],loader:()=>import("./chunk-UMMKFSE4.js").then(e=>e.IconsFontAwesomeExampleComponent)},{id:"icons-bootstrap",title:"DOCS.ICONS.EXAMPLE.BOOTSTRAP.TITLE",componentName:"IconsBootstrapExampleComponent",files:["icons-bootstrap-example.component.ts"],loader:()=>import("./chunk-AFT4HOM6.js").then(e=>e.IconsBootstrapExampleComponent)},{id:"icons-material",title:"DOCS.ICONS.EXAMPLE.MATERIAL.TITLE",componentName:"IconsMaterialExampleComponent",files:["icons-material-example.component.ts"],loader:()=>import("./chunk-OJHY34W6.js").then(e=>e.IconsMaterialExampleComponent)},{id:"icons-solar",title:"DOCS.ICONS.EXAMPLE.SOLAR.TITLE",componentName:"IconsSolarExampleC
5omponent",files:["icons-solar-example.component.ts"],loader:()=>import("./chunk-JGS2POOG.js").then(e=>e.IconsSolarExampleComponent)},{id:"icons-svg",title:"DOCS.ICONS.EXAMPLE.SVG.TITLE",componentName:"IconsSvgExampleComponent",files:["icons-svg-example.component.ts"],loader:()=>import("./chunk-X56HIKGF.js").then(e=>e.IconsSvgExampleComponent)},{id:"icons-sprite",title:"DOCS.ICONS.EXAMPLE.SPRITE.TITLE",componentName:"IconsSpriteExampleComponent",files:["icons-sprite-example.component.ts"],loader:()=>import("./chunk-OZHJ5GC7.js").then(e=>e.IconsSpriteExampleComponent)},{id:"icons-img",title:"DOCS.ICONS.EXAMPLE.IMG.TITLE",componentName:"IconsImgExampleComponent",files:["icons-img-example.component.ts"],loader:()=>import("./chunk-CCL3LA5E.js").then(e=>e.IconsImgExampleComponent)},{id:"icons-variants",title:"DOCS.ICONS.EXAMPLE.VARIANTS.TITLE",componentName:"IconsVariantsExampleComponent",files:["icons-variants-example.component.ts"],loader:()=>import("./chunk-VNTFSA2U.js").then(e=>e.IconsVariantsExampleComponent)},{id:"icons-directive",title:"DOCS.ICONS.EXAMPLE.DIRECTIVE.TITLE",componentName:"IconsDirectiveExampleComponent",files:["icons-directive-example.component.ts"],loader:()=>import("./chunk-34PKG4BU.js").then(e=>e.IconsDirectiveExampleComponent)},{id:"icons-theming",title:"DOCS.ICONS.EXAMPLE.THEMING.TITLE",componentName:"IconsThemingExampleComponent",files:["icons-theming-example.component.ts"],loader:()=>import("./chunk-7RWIALZJ.js").then(e=>e.IconsThemingExampleComponent)},{id:"icons-buttons",title:"DOCS.ICONS.EXAMPLE.BUTTONS.TITLE",componentName:"IconsButtonsExampleComponent",files:["icons-buttons-example.component.ts"],loader:()=>import("./chunk-EO2YTXRV.js").then(e=>e.IconsButtonsExampleComponent)}].forEach(e=>this._exampleRegistry.register(c(r({},e),{packagePath:"icons"})))}populateFunctionalitiesFromRegistry(){this.iconsLibrary.functionalities=d.map(t=>({title:t.title,description:t.description,examples:t.exampleIds.map(e=>{let n=this._exampleRegistry.get(e);return n?{title:n.title,description:n.title,import:"",template:"",component:"",id:n.id,previewComponent:L[e]}:null}).filter(e=>e!==null)}))}static \u0275fac=function(e){return new(e||o)};static \u0275cmp=a({type:o,selectors:[["app-icons"]],decls:1,vars:3,consts:[[3,"library","package","exampleGroups"]],template:function(e,n){e&1&&i(0,"app-library-page",0),e&2&&h("library",n.iconsLibrary)("package","icons")("exampleGroups",n.exampleGroups)},dependencies:[b],encapsulation:2})};export{P as IconsComponent};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.