@pitchfork-ui/elements 0.0.0-stage → 0.2.1

package/dist/esm/pf-icon.entry.js

@@ -0,0 +1,325 @@
+import { h, r as registerInstance, H as Host } from './index-Bm6UxEit.js';
+import { r as registerIconGlyphs, n as normalizeIconName, a as resolveIconGlyph, g as getIconPaths } from './icons-CCln56Fj.js';
+
+//#region src/custom-glyphs.ts
+var polyline = (points) => ({
+	kind: "polyline",
+	points
+});
+var path = (d) => ({
+	kind: "path",
+	d
+});
+var circle = (cx, cy, r) => ({
+	kind: "circle",
+	cx,
+	cy,
+	r
+});
+var VIEW_BOX = "0 0 24 24";
+var CUSTOM_GLYPHS = {
+	"chevron-down": {
+		viewBox: VIEW_BOX,
+		strokeWidth: 3,
+		shapes: [polyline("5 9 12 18 19 9")]
+	},
+	"chevron-up": {
+		viewBox: VIEW_BOX,
+		strokeWidth: 3,
+		shapes: [polyline("5 15 12 6 19 15")]
+	},
+	"chevron-left": {
+		viewBox: VIEW_BOX,
+		strokeWidth: 3,
+		shapes: [polyline("15 5 6 12 15 19")]
+	},
+	"chevron-right": {
+		viewBox: VIEW_BOX,
+		strokeWidth: 3,
+		shapes: [polyline("9 5 18 12 9 19")]
+	},
+	"circle-info": {
+		viewBox: VIEW_BOX,
+		strokeWidth: 2,
+		shapes: [
+			circle(12, 12, 10),
+			path("M12 16v-4"),
+			path("M12 8h.01")
+		]
+	},
+	"triangle-exclamation": {
+		viewBox: VIEW_BOX,
+		strokeWidth: 2,
+		shapes: [
+			path("m21.73 18-8-14a2 2 0 0 0-3.46 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"),
+			path("M12 9v4"),
+			path("M12 17h.01")
+		]
+	},
+	"file-arrow-down": {
+		viewBox: VIEW_BOX,
+		strokeWidth: 2,
+		shapes: [
+			path("M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"),
+			path("M14 2v4a2 2 0 0 0 2 2h4"),
+			path("M12 12v6"),
+			path("m9 15 3 3 3-3")
+		]
+	},
+	"file-arrow-up": {
+		viewBox: VIEW_BOX,
+		strokeWidth: 2,
+		shapes: [
+			path("M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"),
+			path("M14 2v4a2 2 0 0 0 2 2h4"),
+			path("M12 12v6"),
+			path("m15 15-3-3-3 3")
+		]
+	},
+	ellipsis: {
+		viewBox: VIEW_BOX,
+		filled: true,
+		shapes: [
+			circle(5, 12, 2),
+			circle(12, 12, 2),
+			circle(19, 12, 2)
+		]
+	},
+	plus: {
+		viewBox: VIEW_BOX,
+		strokeWidth: 2.5,
+		shapes: [path("M12 5v14"), path("M5 12h14")]
+	},
+	clock: {
+		viewBox: VIEW_BOX,
+		strokeWidth: 2,
+		shapes: [circle(12, 12, 9), path("M12 7v5l3 2")]
+	},
+	"magnifying-glass": {
+		viewBox: VIEW_BOX,
+		strokeWidth: 2,
+		shapes: [circle(11, 11, 8), path("m21 21-4.35-4.35")]
+	},
+	minus: {
+		viewBox: VIEW_BOX,
+		strokeWidth: 2.5,
+		shapes: [path("M5 12h14")]
+	}
+};
+var resolveCustomGlyph = (name) => CUSTOM_GLYPHS[name];
+/**
+* The `<svg>` presentation attributes a glyph needs, as values rather than
+* attribute names: the two layers spell the names differently
+* (`strokeWidth` against `stroke-width`), so naming them here would only move
+* the duplication.
+*/
+function customGlyphAttributes(glyph) {
+	return {
+		viewBox: glyph.viewBox,
+		fill: glyph.filled ? "currentColor" : "none",
+		stroke: glyph.filled ? void 0 : "currentColor",
+		strokeWidth: glyph.filled ? void 0 : glyph.strokeWidth,
+		strokeLinecap: glyph.filled ? void 0 : "round",
+		strokeLinejoin: glyph.filled ? void 0 : "round"
+	};
+}
+
+/*!
+ * Font Awesome Free 7.3.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ * Copyright 2026 Fonticons, Inc.
+ */
+var faBell = {
+  prefix: 'far',
+  iconName: 'bell',
+  icon: [448, 512, [128276, 61602], "f0f3", "M224 0c-13.3 0-24 10.7-24 24l0 9.7C118.6 45.3 56 115.4 56 200l0 14.5c0 37.7-10 74.7-29 107.3L5.1 359.2C1.8 365 0 371.5 0 378.2 0 399.1 16.9 416 37.8 416l372.4 0c20.9 0 37.8-16.9 37.8-37.8 0-6.7-1.8-13.3-5.1-19L421 321.7c-19-32.6-29-69.6-29-107.3l0-14.5c0-84.6-62.6-154.7-144-166.3l0-9.7c0-13.3-10.7-24-24-24zM392.4 368l-336.9 0 12.9-22.1C91.7 306 104 260.6 104 214.5l0-14.5c0-66.3 53.7-120 120-120s120 53.7 120 120l0 14.5c0 46.2 12.3 91.5 35.5 131.4L392.4 368zM156.1 464c9.9 28 36.6 48 67.9 48s58-20 67.9-48l-135.8 0z"]
+};
+var faFolderOpen = {
+  prefix: 'far',
+  iconName: 'folder-open',
+  icon: [576, 512, [128194, 128449, 61717], "f07c", "M97.5 400l50-160 379.4 0-50 160-379.4 0zm190.7 48L477 448c21 0 39.6-13.6 45.8-33.7l50-160c9.7-30.9-13.4-62.3-45.8-62.3l-379.4 0c-21 0-39.6 13.6-45.8 33.7L80.2 294.4 80.2 96c0-8.8 7.2-16 16-16l138.7 0c3.5 0 6.8 1.1 9.6 3.2L282.9 112c13.8 10.4 30.7 16 48 16l117.3 0c8.8 0 16 7.2 16 16l48 0c0-35.3-28.7-64-64-64L330.9 80c-6.9 0-13.7-2.2-19.2-6.4L273.3 44.8C262.2 36.5 248.8 32 234.9 32L96.2 32c-35.3 0-64 28.7-64 64l0 288c0 35.3 28.7 64 64 64l192 0z"]
+};
+var faSquareCheck = {
+  prefix: 'far',
+  iconName: 'square-check',
+  icon: [448, 512, [9745, 9989, 61510, "check-square"], "f14a", "M384 32c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96C0 60.7 28.7 32 64 32l320 0zM64 80c-8.8 0-16 7.2-16 16l0 320c0 8.8 7.2 16 16 16l320 0c8.8 0 16-7.2 16-16l0-320c0-8.8-7.2-16-16-16L64 80zm230.7 89.9c7.8-10.7 22.8-13.1 33.5-5.3 10.7 7.8 13.1 22.8 5.3 33.5L211.4 366.1c-4.1 5.7-10.5 9.3-17.5 9.8-7 .5-13.9-2-18.8-6.9l-55.9-55.9c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l36 36 105.6-145.2z"]
+};
+var faCircleXmark = {
+  prefix: 'far',
+  iconName: 'circle-xmark',
+  icon: [512, 512, [61532, "times-circle", "xmark-circle"], "f057", "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464a256 256 0 1 0 0-512 256 256 0 1 0 0 512zM167 167c-9.4 9.4-9.4 24.6 0 33.9l55 55-55 55c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l55-55 55 55c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-55-55 55-55c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-55 55-55-55c-9.4-9.4-24.6-9.4-33.9 0z"]
+};
+var faSquareCaretRight = {
+  prefix: 'far',
+  iconName: 'square-caret-right',
+  icon: [448, 512, ["caret-square-right"], "f152", "M400 96c0-8.8-7.2-16-16-16L64 80c-8.8 0-16 7.2-16 16l0 320c0 8.8 7.2 16 16 16l320 0c8.8 0 16-7.2 16-16l0-320zM384 32c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96C0 60.7 28.7 32 64 32l320 0zM320 256c0 6.7-2.8 13-7.7 17.6l-112 104c-7 6.5-17.2 8.2-25.9 4.4S160 369.5 160 360l0-208c0-9.5 5.7-18.2 14.4-22s18.9-2.1 25.9 4.4l112 104c4.9 4.5 7.7 10.9 7.7 17.6z"]
+};
+var faCircleQuestion = {
+  prefix: 'far',
+  iconName: 'circle-question',
+  icon: [512, 512, [62108, "question-circle"], "f059", "M464 256a208 208 0 1 0 -416 0 208 208 0 1 0 416 0zM0 256a256 256 0 1 1 512 0 256 256 0 1 1 -512 0zm256-80c-17.7 0-32 14.3-32 32 0 13.3-10.7 24-24 24s-24-10.7-24-24c0-44.2 35.8-80 80-80s80 35.8 80 80c0 47.2-36 67.2-56 74.5l0 3.8c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-8.1c0-20.5 14.8-35.2 30.1-40.2 6.4-2.1 13.2-5.5 18.2-10.3 4.3-4.2 7.7-10 7.7-19.6 0-17.7-14.3-32-32-32zM224 368a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z"]
+};
+var faFile = {
+  prefix: 'far',
+  iconName: 'file',
+  icon: [384, 512, [128196, 128459, 61462], "f15b", "M176 48L64 48c-8.8 0-16 7.2-16 16l0 384c0 8.8 7.2 16 16 16l256 0c8.8 0 16-7.2 16-16l0-240-88 0c-39.8 0-72-32.2-72-72l0-88zM316.1 160L224 67.9 224 136c0 13.3 10.7 24 24 24l68.1 0zM0 64C0 28.7 28.7 0 64 0L197.5 0c17 0 33.3 6.7 45.3 18.7L365.3 141.3c12 12 18.7 28.3 18.7 45.3L384 448c0 35.3-28.7 64-64 64L64 512c-35.3 0-64-28.7-64-64L0 64z"]
+};
+var faCalendar = {
+  prefix: 'far',
+  iconName: 'calendar',
+  icon: [448, 512, [128197, 128198], "f133", "M120 0c13.3 0 24 10.7 24 24l0 40 160 0 0-40c0-13.3 10.7-24 24-24s24 10.7 24 24l0 40 32 0c35.3 0 64 28.7 64 64l0 288c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 128C0 92.7 28.7 64 64 64l32 0 0-40c0-13.3 10.7-24 24-24zm0 112l-56 0c-8.8 0-16 7.2-16 16l0 48 352 0 0-48c0-8.8-7.2-16-16-16l-264 0zM48 224l0 192c0 8.8 7.2 16 16 16l320 0c8.8 0 16-7.2 16-16l0-192-352 0z"]
+};
+var faChartBar = {
+  prefix: 'far',
+  iconName: 'chart-bar',
+  icon: [512, 512, ["bar-chart"], "f080", "M48 56c0-13.3-10.7-24-24-24S0 42.7 0 56L0 400c0 44.2 35.8 80 80 80l408 0c13.3 0 24-10.7 24-24s-10.7-24-24-24L80 432c-17.7 0-32-14.3-32-32L48 56zm104 72l208 0c13.3 0 24-10.7 24-24s-10.7-24-24-24L152 80c-13.3 0-24 10.7-24 24s10.7 24 24 24zm0 64c-13.3 0-24 10.7-24 24s10.7 24 24 24l144 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-144 0zm0 112c-13.3 0-24 10.7-24 24s10.7 24 24 24l272 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-272 0z"]
+};
+var faBarChart = faChartBar;
+var faUser = {
+  prefix: 'far',
+  iconName: 'user',
+  icon: [448, 512, [128100, 62144, 62470, "user-alt", "user-large"], "f007", "M144 128a80 80 0 1 1 160 0 80 80 0 1 1 -160 0zm208 0a128 128 0 1 0 -256 0 128 128 0 1 0 256 0zM48 480c0-70.7 57.3-128 128-128l96 0c70.7 0 128 57.3 128 128l0 8c0 13.3 10.7 24 24 24s24-10.7 24-24l0-8c0-97.2-78.8-176-176-176l-96 0C78.8 304 0 382.8 0 480l0 8c0 13.3 10.7 24 24 24s24-10.7 24-24l0-8z"]
+};
+var faSquareCaretLeft = {
+  prefix: 'far',
+  iconName: 'square-caret-left',
+  icon: [448, 512, ["caret-square-left"], "f191", "M48 416c0 8.8 7.2 16 16 16l320 0c8.8 0 16-7.2 16-16l0-320c0-8.8-7.2-16-16-16L64 80c-8.8 0-16 7.2-16 16l0 320zm16 64c-35.3 0-64-28.7-64-64L0 96C0 60.7 28.7 32 64 32l320 0c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480zm64-224c0-6.7 2.8-13 7.7-17.6l112-104c7-6.5 17.2-8.2 25.9-4.4S288 142.5 288 152l0 208c0 9.5-5.7 18.2-14.4 22s-18.9 2.1-25.9-4.4l-112-104c-4.9-4.5-7.7-10.9-7.7-17.6z"]
+};
+var faCircleCheck = {
+  prefix: 'far',
+  iconName: 'circle-check',
+  icon: [512, 512, [61533, "check-circle"], "f058", "M256 512a256 256 0 1 1 0-512 256 256 0 1 1 0 512zm0-464a208 208 0 1 0 0 416 208 208 0 1 0 0-416zm70.7 121.9c7.8-10.7 22.8-13.1 33.5-5.3 10.7 7.8 13.1 22.8 5.3 33.5L243.4 366.1c-4.1 5.7-10.5 9.3-17.5 9.8-7 .5-13.9-2-18.8-6.9l-55.9-55.9c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l36 36 105.6-145.2z"]
+};
+var faCreditCard = {
+  prefix: 'far',
+  iconName: 'credit-card',
+  icon: [512, 512, [128179, 62083, "credit-card-alt"], "f09d", "M448 112c8.8 0 16 7.2 16 16l0 32-416 0 0-32c0-8.8 7.2-16 16-16l384 0zm16 112l0 160c0 8.8-7.2 16-16 16L64 400c-8.8 0-16-7.2-16-16l0-160 416 0zM64 64C28.7 64 0 92.7 0 128L0 384c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-256c0-35.3-28.7-64-64-64L64 64zM80 344c0 13.3 10.7 24 24 24l48 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24zm144 0c0 13.3 10.7 24 24 24l64 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-64 0c-13.3 0-24 10.7-24 24z"]
+};
+var faStar = {
+  prefix: 'far',
+  iconName: 'star',
+  icon: [576, 512, [11088, 61446], "f005", "M288.1-32c9 0 17.3 5.1 21.4 13.1L383 125.3 542.9 150.7c8.9 1.4 16.3 7.7 19.1 16.3s.5 18-5.8 24.4L441.7 305.9 467 465.8c1.4 8.9-2.3 17.9-9.6 23.2s-17 6.1-25 2L288.1 417.6 143.8 491c-8 4.1-17.7 3.3-25-2s-11-14.2-9.6-23.2L134.4 305.9 20 191.4c-6.4-6.4-8.6-15.8-5.8-24.4s10.1-14.9 19.1-16.3l159.9-25.4 73.6-144.2c4.1-8 12.4-13.1 21.4-13.1zm0 76.8L230.3 158c-3.5 6.8-10 11.6-17.6 12.8l-125.5 20 89.8 89.9c5.4 5.4 7.9 13.1 6.7 20.7l-19.8 125.5 113.3-57.6c6.8-3.5 14.9-3.5 21.8 0l113.3 57.6-19.8-125.5c-1.2-7.6 1.3-15.3 6.7-20.7l89.8-89.9-125.5-20c-7.6-1.2-14.1-6-17.6-12.8L288.1 44.8z"]
+};
+var faCopy = {
+  prefix: 'far',
+  iconName: 'copy',
+  icon: [448, 512, [], "f0c5", "M384 336l-192 0c-8.8 0-16-7.2-16-16l0-256c0-8.8 7.2-16 16-16l133.5 0c4.2 0 8.3 1.7 11.3 4.7l58.5 58.5c3 3 4.7 7.1 4.7 11.3L400 320c0 8.8-7.2 16-16 16zM192 384l192 0c35.3 0 64-28.7 64-64l0-197.5c0-17-6.7-33.3-18.7-45.3L370.7 18.7C358.7 6.7 342.5 0 325.5 0L192 0c-35.3 0-64 28.7-64 64l0 256c0 35.3 28.7 64 64 64zM64 128c-35.3 0-64 28.7-64 64L0 448c0 35.3 28.7 64 64 64l192 0c35.3 0 64-28.7 64-64l0-16-48 0 0 16c0 8.8-7.2 16-16 16L64 464c-8.8 0-16-7.2-16-16l0-256c0-8.8 7.2-16 16-16l16 0 0-48-16 0z"]
+};
+
+/**
+ * The Font Awesome regular icons this package ships, registered into the
+ * shared registry on import.
+ *
+ * An explicit list, not the whole free-regular set, so a consumer's bundle
+ * carries only these — the same policy the React library follows. It has to
+ * be registered here as well as there, because a consumer using only the
+ * custom elements never loads the React package.
+ *
+ * Anything outside the list is not "an icon the library lacks": register it
+ * with `registerIconGlyphs()` from the peer dependency you already install.
+ *
+ * The *names* are core's `BUNDLED_FA_ICON_NAMES`, which the spec asserts this
+ * map against. Adding an icon to one layer and forgetting the other would
+ * otherwise leave a name that draws in React and nothing in `<pf-icon>`, with
+ * every test in both layers passing.
+ */
+const bundled = {
+    bell: faBell,
+    calendar: faCalendar,
+    'chart-bar': faBarChart,
+    'circle-check': faCircleCheck,
+    'circle-question': faCircleQuestion,
+    'circle-xmark': faCircleXmark,
+    copy: faCopy,
+    'credit-card': faCreditCard,
+    file: faFile,
+    'folder-open': faFolderOpen,
+    'square-caret-left': faSquareCaretLeft,
+    'square-caret-right': faSquareCaretRight,
+    'square-check': faSquareCheck,
+    star: faStar,
+    user: faUser,
+};
+const registerBundledIcons = () => registerIconGlyphs(bundled);
+
+/*
+ * The glyphs the Font Awesome regular set does not carry, rendered from the
+ * shared data in @pitchfork-ui/core.
+ *
+ * The geometry used to be written out here as Stencil JSX and a second time as
+ * React JSX in the React `Icon`. Two copies of a shape agree on the day they
+ * are written, and no test in either layer could have seen them stop agreeing,
+ * because each layer only ever rendered its own. So core holds the shapes and
+ * this maps them to Stencil's hyphenated presentation attributes -- which is
+ * the whole reason core holds *data*: it has no vdom of its own, and the
+ * attribute names differ between the two layers.
+ *
+ * A separate module because Stencil allows a component file only one export.
+ */
+/** The glyph for a name, as a VNode, or undefined if it is not a custom one. */
+const renderCustomIcon = (name) => {
+    const glyph = resolveCustomGlyph(name);
+    return glyph ? renderGlyph(glyph) : undefined;
+};
+const renderGlyph = (glyph) => {
+    const { viewBox, fill, stroke, strokeWidth, strokeLinecap, strokeLinejoin } = customGlyphAttributes(glyph);
+    return (h("svg", {
+        // The Font Awesome branch has always exposed this part; the custom
+        // glyphs did not, so `pf-icon::part(svg)` reached two thirds of the
+        // icons and silently missed every chevron.
+        part: "svg", width: "1em", height: "1em", viewBox: viewBox, fill: fill, stroke: stroke, "stroke-width": strokeWidth, "stroke-linecap": strokeLinecap, "stroke-linejoin": strokeLinejoin, focusable: "false", "aria-hidden": "true"
+    }, glyph.shapes.map((shape) => {
+        if (shape.kind === 'polyline')
+            return h("polyline", { points: shape.points });
+        if (shape.kind === 'circle')
+            return h("circle", { cx: shape.cx, cy: shape.cy, r: shape.r });
+        return h("path", { d: shape.d });
+    })));
+};
+
+const pfIconCss = () => `:host{display:inline-flex;align-items:center;justify-content:center;line-height:1}:host([hidden]){display:none}svg{display:block;height:1em;width:1em}`;
+
+// Called rather than imported for its side effect: a side-effect-only
+// import is something a bundler may drop, and did.
+registerBundledIcons();
+const warned = new Set();
+const warnUnknown = (name) => {
+    if (warned.has(name))
+        return;
+    warned.add(name);
+    // Deliberately not behind a build-time DEV guard: the React library lost
+    // this warning to exactly that, and unknown names failed in silence.
+    console.warn(`[pitchfork-ui] <pf-icon name="${name}"> is not registered, so nothing was drawn. ` +
+        `Register it with registerIconGlyphs({ '${name}': <the icon> }) from @pitchfork-ui/core.`);
+};
+const PfIcon = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    /** A registered Font Awesome name, one of its aliases, or a custom glyph. */
+    name;
+    /**
+     * Accessible name. Without one the icon is decorative and hidden from
+     * assistive technology, which is the right default beside a text label.
+     */
+    label;
+    render() {
+        const custom = renderCustomIcon(this.name) ?? renderCustomIcon(normalizeIconName(this.name));
+        const glyph = custom ? undefined : resolveIconGlyph(this.name);
+        if (!custom && !glyph) {
+            warnUnknown(this.name);
+            return null;
+        }
+        return (h(Host, { role: this.label ? 'img' : null, "aria-label": this.label, "aria-hidden": this.label ? null : 'true' }, custom ?? this.renderGlyph(glyph)));
+    }
+    renderGlyph(glyph) {
+        const { viewBox, paths } = getIconPaths(glyph);
+        return (h("svg", { part: "svg", width: "1em", height: "1em", viewBox: viewBox, fill: "currentColor", focusable: "false", "aria-hidden": "true" }, paths.map((d) => (h("path", { d: d })))));
+    }
+};
+PfIcon.style = pfIconCss();
+
+export { PfIcon as pf_icon };
+//# sourceMappingURL=pf-icon.entry.js.map
+
+//# sourceMappingURL=pf-icon.entry.js.map