@behivetech/atoms.icon 0.0.0-stage → 0.3.2

package/README.md

@@ -1,3 +1,28 @@
-# Temporary Holding Version
+# Icon
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+A hand-authored, stroke-based SVG icon set behind a single `Icon` component — the same idea as `@ant-design/icons`/`@mui/icons-material`, but self-contained (no new dependency). Icons use `stroke="currentColor"`, so they inherit color from whatever text color is in scope.
+
+## Usage
+
+```jsx
+import { Icon } from '@behivetech/atoms.icon';
+
+<Icon name="trash" />
+<Icon name="close" size="sm" />
+```
+
+## Available icons
+
+`close`, `chevron-up`, `chevron-down`, `pencil`, `trash`, `box`, `upload`, `bold`, `italic`, `list`, `link`, `image`, `file-text`, `ellipse`, `rectangle`, `polygon`, `cursor`, `label`, `camp-border`, `structure`, `road`, `restroom`
+
+Note that `box` is the 3D carton glyph; `rectangle` is the flat shape primitive that pairs with `ellipse`.
+
+Add new icons by adding a module under `icons/` that calls `createIcon` with geometry in a `0 0 24 24` viewBox, stroke-based to match the existing set, then registering it in `icons/index.ts` and `icons/registry.ts`.
+
+## Props
+
+| Prop        | Type                   | Default | Description                     |
+| ----------- | ---------------------- | ------- | ------------------------------- |
+| `name`      | `IconName`             | —       | Which icon to render (required) |
+| `size`      | `sm \| md \| lg \| xl` | `md`    | Icon width/height               |
+| `className` | `string`               | —       | Additional class names          |

package/dist/index.cjs

@@ -0,0 +1,499 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __commonJS = (cb, mod) => function __require() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// ../../../../node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.js
+var require_classnames = __commonJS({
+  "../../../../node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.js"(exports2, module2) {
+    "use strict";
+    (function() {
+      "use strict";
+      var hasOwn = {}.hasOwnProperty;
+      function classNames() {
+        var classes = "";
+        for (var i = 0; i < arguments.length; i++) {
+          var arg = arguments[i];
+          if (arg) {
+            classes = appendClass(classes, parseValue(arg));
+          }
+        }
+        return classes;
+      }
+      function parseValue(arg) {
+        if (typeof arg === "string" || typeof arg === "number") {
+          return arg;
+        }
+        if (typeof arg !== "object") {
+          return "";
+        }
+        if (Array.isArray(arg)) {
+          return classNames.apply(null, arg);
+        }
+        if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes("[native code]")) {
+          return arg.toString();
+        }
+        var classes = "";
+        for (var key in arg) {
+          if (hasOwn.call(arg, key) && arg[key]) {
+            classes = appendClass(classes, key);
+          }
+        }
+        return classes;
+      }
+      function appendClass(value, newClass) {
+        if (!newClass) {
+          return value;
+        }
+        if (value) {
+          return value + " " + newClass;
+        }
+        return value + newClass;
+      }
+      if (typeof module2 !== "undefined" && module2.exports) {
+        classNames.default = classNames;
+        module2.exports = classNames;
+      } else if (typeof define === "function" && typeof define.amd === "object" && define.amd) {
+        define("classnames", [], function() {
+          return classNames;
+        });
+      } else {
+        window.classNames = classNames;
+      }
+    })();
+  }
+});
+
+// index.ts
+var index_exports = {};
+__export(index_exports, {
+  BoldIcon: () => BoldIcon,
+  BoxIcon: () => BoxIcon,
+  CampBorderIcon: () => CampBorderIcon,
+  ChevronDownIcon: () => ChevronDownIcon,
+  ChevronUpIcon: () => ChevronUpIcon,
+  CloseIcon: () => CloseIcon,
+  CursorIcon: () => CursorIcon,
+  EllipseIcon: () => EllipseIcon,
+  FileTextIcon: () => FileTextIcon,
+  Icon: () => Icon,
+  ImageIcon: () => ImageIcon,
+  ItalicIcon: () => ItalicIcon,
+  LabelIcon: () => LabelIcon,
+  LinkIcon: () => LinkIcon,
+  ListIcon: () => ListIcon,
+  PencilIcon: () => PencilIcon,
+  PolygonIcon: () => PolygonIcon,
+  RectangleIcon: () => RectangleIcon,
+  RestroomIcon: () => RestroomIcon,
+  RoadIcon: () => RoadIcon,
+  StructureIcon: () => StructureIcon,
+  TrashIcon: () => TrashIcon,
+  UploadIcon: () => UploadIcon,
+  createIcon: () => createIcon
+});
+module.exports = __toCommonJS(index_exports);
+
+// ../../../../packages/registry/class-names/dist/index.js
+var import_classnames = __toESM(require_classnames(), 1);
+var getClassName = ({
+  className,
+  modifiers = {},
+  rootClass,
+  styles = {}
+}) => {
+  function getModifiers() {
+    const updatedModifiers = {};
+    const modifierKeys = Object.keys(modifiers);
+    if (modifierKeys.length) {
+      modifierKeys.forEach((modKey) => {
+        const classKey = `${rootClass}--${modKey}`;
+        const newClassName = styles[classKey] || classKey;
+        updatedModifiers[newClassName] = modifiers[modKey] ?? false;
+      });
+    }
+    return updatedModifiers;
+  }
+  function getChildClass(childClassName) {
+    const classKey = `${rootClass}__${childClassName}`;
+    return styles[classKey] || classKey;
+  }
+  function getRootStyles() {
+    return (0, import_classnames.default)(
+      className,
+      {
+        ...getModifiers()
+      },
+      styles[rootClass] || rootClass
+    );
+  }
+  return [getRootStyles(), getChildClass];
+};
+
+// icon.module.scss
+var icon_module_default = {
+  "BHT__Icon": "BHT__Icon",
+  "BHT__Icon--sm": "BHT__Icon--sm",
+  "BHT__Icon--md": "BHT__Icon--md",
+  "BHT__Icon--lg": "BHT__Icon--lg",
+  "BHT__Icon--xl": "BHT__Icon--xl"
+};
+
+// create-icon.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function createIcon(displayName, children) {
+  const Component = ({ size = "md", className, ...rest }) => {
+    const [rootClass] = getClassName({
+      className,
+      rootClass: "BHT__Icon",
+      modifiers: { [size]: true },
+      styles: icon_module_default
+    });
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "svg",
+      {
+        ...rest,
+        className: rootClass,
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: 2,
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        "aria-hidden": "true",
+        children
+      }
+    );
+  };
+  Component.displayName = displayName;
+  return Component;
+}
+
+// icons/close.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var CloseIcon = /* @__PURE__ */ createIcon(
+  "CloseIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M18 6 6 18M6 6l12 12" })
+);
+
+// icons/chevron-up.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var ChevronUpIcon = /* @__PURE__ */ createIcon(
+  "ChevronUpIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M18 15l-6-6-6 6" })
+);
+
+// icons/chevron-down.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var ChevronDownIcon = /* @__PURE__ */ createIcon(
+  "ChevronDownIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M6 9l6 6 6-6" })
+);
+
+// icons/pencil.tsx
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var PencilIcon = /* @__PURE__ */ createIcon(
+  "PencilIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 20h9" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4Z" })
+  ] })
+);
+
+// icons/trash.tsx
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var TrashIcon = /* @__PURE__ */ createIcon(
+  "TrashIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M3 6h18" }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M10 11v6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M14 11v6" })
+  ] })
+);
+
+// icons/box.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var BoxIcon = /* @__PURE__ */ createIcon(
+  "BoxIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M21 8 12 3 3 8l9 5 9-5Z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3 8v8l9 5 9-5V8" }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 13v8" })
+  ] })
+);
+
+// icons/upload.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var UploadIcon = /* @__PURE__ */ createIcon(
+  "UploadIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M17 8l-5-5-5 5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M12 3v12" })
+  ] })
+);
+
+// icons/bold.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var BoldIcon = /* @__PURE__ */ createIcon(
+  "BoldIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M6 4h8a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("path", { d: "M6 12h9a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z" })
+  ] })
+);
+
+// icons/italic.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var ItalicIcon = /* @__PURE__ */ createIcon(
+  "ItalicIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", { d: "M19 4h-9" }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", { d: "M14 20H5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", { d: "M15 4 9 20" })
+  ] })
+);
+
+// icons/list.tsx
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var ListIcon = /* @__PURE__ */ createIcon(
+  "ListIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M8 6h13" }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M8 12h13" }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M8 18h13" }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M3 6h.01" }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M3 12h.01" }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M3 18h.01" })
+  ] })
+);
+
+// icons/link.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var LinkIcon = /* @__PURE__ */ createIcon(
+  "LinkIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("path", { d: "M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3" }),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("path", { d: "M8 12h8" })
+  ] })
+);
+
+// icons/image.tsx
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var ImageIcon = /* @__PURE__ */ createIcon(
+  "ImageIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("circle", { cx: "8.5", cy: "8.5", r: "1.5" }),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M21 15l-5-5L5 21" })
+  ] })
+);
+
+// icons/file-text.tsx
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var FileTextIcon = /* @__PURE__ */ createIcon(
+  "FileTextIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: "M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2Z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: "M14 2v6h6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: "M16 13H8" }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: "M16 17H8" }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("path", { d: "M10 9H8" })
+  ] })
+);
+
+// icons/ellipse.tsx
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var EllipseIcon = /* @__PURE__ */ createIcon(
+  "EllipseIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("ellipse", { cx: "12", cy: "12", rx: "10", ry: "7" })
+);
+
+// icons/rectangle.tsx
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var RectangleIcon = /* @__PURE__ */ createIcon(
+  "RectangleIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("rect", { x: "2", y: "5", width: "20", height: "14", rx: "1" })
+);
+
+// icons/polygon.tsx
+var import_jsx_runtime17 = require("react/jsx-runtime");
+var PolygonIcon = /* @__PURE__ */ createIcon(
+  "PolygonIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("path", { d: "M10.83 2.38a2 2 0 0 1 2.34 0l8 5.74a2 2 0 0 1 .73 2.25l-3.04 9.26a2 2 0 0 1-1.9 1.37H7.04a2 2 0 0 1-1.9-1.37L2.1 10.37a2 2 0 0 1 .73-2.25z" })
+);
+
+// icons/cursor.tsx
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var CursorIcon = /* @__PURE__ */ createIcon(
+  "CursorIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("path", { d: "M4.037 4.688a.495.495 0 0 1 .651-.651l16 6.5a.5.5 0 0 1-.063.947l-6.124 1.58a2 2 0 0 0-1.438 1.435l-1.579 6.126a.5.5 0 0 1-.947.063z" })
+);
+
+// icons/label.tsx
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var LabelIcon = /* @__PURE__ */ createIcon(
+  "LabelIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M12 4v16" }),
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M4 7V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M9 20h6" })
+  ] })
+);
+
+// icons/camp-border.tsx
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var CampBorderIcon = /* @__PURE__ */ createIcon(
+  "CampBorderIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M5 3a2 2 0 0 0-2 2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M19 3a2 2 0 0 1 2 2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M21 19a2 2 0 0 1-2 2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M5 21a2 2 0 0 1-2-2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M9 3h1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M9 21h1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M14 3h1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M14 21h1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M3 9v1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M21 9v1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M3 14v1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("path", { d: "M21 14v1" })
+  ] })
+);
+
+// icons/structure.tsx
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var StructureIcon = /* @__PURE__ */ createIcon(
+  "StructureIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("path", { d: "M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8" }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("path", { d: "M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" })
+  ] })
+);
+
+// icons/road.tsx
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var RoadIcon = /* @__PURE__ */ createIcon(
+  "RoadIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M4 19l4-14" }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M16 5l4 14" }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M12 8v-2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M12 13v-2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("path", { d: "M12 18v-2" })
+  ] })
+);
+
+// icons/restroom.tsx
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var RestroomIcon = /* @__PURE__ */ createIcon(
+  "RestroomIcon",
+  /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("circle", { cx: "6.5", cy: "4", r: "2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("path", { d: "M3.5 14 6.5 8l3 6z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("path", { d: "M5 14v7" }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("path", { d: "M8 14v7" }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("circle", { cx: "17.5", cy: "4", r: "2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("path", { d: "M14.5 14 17.5 8l3 6z" }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("path", { d: "M16 14v7" }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("path", { d: "M19 14v7" })
+  ] })
+);
+
+// icons/registry.ts
+var iconRegistry = {
+  close: CloseIcon,
+  "chevron-up": ChevronUpIcon,
+  "chevron-down": ChevronDownIcon,
+  pencil: PencilIcon,
+  trash: TrashIcon,
+  box: BoxIcon,
+  upload: UploadIcon,
+  bold: BoldIcon,
+  italic: ItalicIcon,
+  list: ListIcon,
+  link: LinkIcon,
+  image: ImageIcon,
+  "file-text": FileTextIcon,
+  ellipse: EllipseIcon,
+  rectangle: RectangleIcon,
+  polygon: PolygonIcon,
+  cursor: CursorIcon,
+  label: LabelIcon,
+  "camp-border": CampBorderIcon,
+  structure: StructureIcon,
+  road: RoadIcon,
+  restroom: RestroomIcon
+};
+
+// icon.tsx
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var Icon = ({ name, ...rest }) => {
+  const Glyph = iconRegistry[name];
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Glyph, { ...rest });
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BoldIcon,
+  BoxIcon,
+  CampBorderIcon,
+  ChevronDownIcon,
+  ChevronUpIcon,
+  CloseIcon,
+  CursorIcon,
+  EllipseIcon,
+  FileTextIcon,
+  Icon,
+  ImageIcon,
+  ItalicIcon,
+  LabelIcon,
+  LinkIcon,
+  ListIcon,
+  PencilIcon,
+  PolygonIcon,
+  RectangleIcon,
+  RestroomIcon,
+  RoadIcon,
+  StructureIcon,
+  TrashIcon,
+  UploadIcon,
+  createIcon
+});
+/*! Bundled license information:
+
+classnames/index.js:
+  (*!
+  	Copyright (c) 2018 Jed Watson.
+  	Licensed under the MIT License (MIT), see
+  	http://jedwatson.github.io/classnames
+  *)
+*/

package/dist/index.css

@@ -0,0 +1,21 @@
+/* esbuild-sass-plugin:css-chunkicon.module.scss */
+.BHT__Icon {
+  display: inline-block;
+  flex-shrink: 0;
+}
+.BHT__Icon--sm {
+  width: 1rem;
+  height: 1rem;
+}
+.BHT__Icon--md {
+  width: 1.25rem;
+  height: 1.25rem;
+}
+.BHT__Icon--lg {
+  width: 1.5rem;
+  height: 1.5rem;
+}
+.BHT__Icon--xl {
+  width: 2.5rem;
+  height: 2.5rem;
+}

package/dist/index.d.ts

@@ -0,0 +1,133 @@
+import * as react from 'react';
+import { SVGAttributes, ReactNode } from 'react';
+
+type IconSize = "sm" | "md" | "lg" | "xl";
+interface IconBaseProps extends SVGAttributes<SVGSVGElement> {
+    /** Controls width/height; defaults to md */
+    size?: IconSize;
+    /** Additional class names to merge with the component root element */
+    className?: string;
+}
+type IconComponent = (props: IconBaseProps) => ReactNode;
+/**
+ * Builds a single icon component from its glyph geometry.
+ *
+ * This is the only module that imports the stylesheet, so the per-icon modules
+ * stay free of side effects and a consumer importing one icon pulls in one
+ * glyph rather than the whole set.
+ */
+declare function createIcon(displayName: string, children: ReactNode): IconComponent;
+
+declare const CloseIcon: IconComponent;
+
+declare const ChevronUpIcon: IconComponent;
+
+declare const ChevronDownIcon: IconComponent;
+
+declare const PencilIcon: IconComponent;
+
+declare const TrashIcon: IconComponent;
+
+declare const BoxIcon: IconComponent;
+
+declare const UploadIcon: IconComponent;
+
+declare const BoldIcon: IconComponent;
+
+declare const ItalicIcon: IconComponent;
+
+declare const ListIcon: IconComponent;
+
+declare const LinkIcon: IconComponent;
+
+/** Feather `image` */
+declare const ImageIcon: IconComponent;
+
+declare const FileTextIcon: IconComponent;
+
+/** Lucide `circle`, flattened. No set ships an ellipse — it's a primitive. */
+declare const EllipseIcon: IconComponent;
+
+/**
+ * A flat rectangle primitive — the counterpart to `ellipse`. Lucide's `square`
+ * is the nearest thing any set ships, but a square is the wrong footprint for a
+ * shape tool sitting next to the ellipse, so this matches the ellipse's bounds.
+ */
+declare const RectangleIcon: IconComponent;
+
+/** Lucide `pentagon` */
+declare const PolygonIcon: IconComponent;
+
+/** Lucide `mouse-pointer-2` */
+declare const CursorIcon: IconComponent;
+
+/** Lucide `type` */
+declare const LabelIcon: IconComponent;
+
+/** Lucide `square-dashed` */
+declare const CampBorderIcon: IconComponent;
+
+/** Lucide `house` */
+declare const StructureIcon: IconComponent;
+
+/** Tabler `road` */
+declare const RoadIcon: IconComponent;
+
+/**
+ * The two-figure WC convention, authored rather than taken from a library.
+ *
+ * This is the one glyph in the set with no stroke-library equivalent: Lucide's
+ * `toilet` collapses into an unreadable shape at 16px, and Tabler's `friends`
+ * loses its heads at that size. Kept deliberately blunt — head, body, legs and
+ * nothing else — because it is checked at `sm`, where any further detail fills
+ * in solid.
+ */
+declare const RestroomIcon: IconComponent;
+
+/**
+ * Every icon keyed by its string name. Importing this pulls in the whole set,
+ * which is why it lives behind `<Icon name>` rather than the barrel: a
+ * consumer reaching for one glyph should import that glyph.
+ */
+declare const iconRegistry: {
+    readonly close: IconComponent;
+    readonly "chevron-up": IconComponent;
+    readonly "chevron-down": IconComponent;
+    readonly pencil: IconComponent;
+    readonly trash: IconComponent;
+    readonly box: IconComponent;
+    readonly upload: IconComponent;
+    readonly bold: IconComponent;
+    readonly italic: IconComponent;
+    readonly list: IconComponent;
+    readonly link: IconComponent;
+    readonly image: IconComponent;
+    readonly "file-text": IconComponent;
+    readonly ellipse: IconComponent;
+    readonly rectangle: IconComponent;
+    readonly polygon: IconComponent;
+    readonly cursor: IconComponent;
+    readonly label: IconComponent;
+    readonly "camp-border": IconComponent;
+    readonly structure: IconComponent;
+    readonly road: IconComponent;
+    readonly restroom: IconComponent;
+};
+
+type IconName = keyof typeof iconRegistry;
+interface IconProps extends Omit<IconBaseProps, "name"> {
+    /** Which icon to render */
+    name: IconName;
+}
+/**
+ * Renders any icon by name.
+ *
+ * Convenient when the icon is chosen at runtime — a toolbar built from config,
+ * say — but the lookup is dynamic, so a bundler cannot know which glyphs are
+ * reachable and this pulls in the entire set. Import the icon you want
+ * (`import { BoxIcon } from "@behivetech/atoms.icon"`, or
+ * `"@behivetech/atoms.icon/box"`) wherever the name is known at build time.
+ */
+declare const Icon: ({ name, ...rest }: IconProps) => react.JSX.Element;
+
+export { BoldIcon, BoxIcon, CampBorderIcon, ChevronDownIcon, ChevronUpIcon, CloseIcon, CursorIcon, EllipseIcon, FileTextIcon, Icon, type IconBaseProps, type IconComponent, type IconName, type IconProps, type IconSize, ImageIcon, ItalicIcon, LabelIcon, LinkIcon, ListIcon, PencilIcon, PolygonIcon, RectangleIcon, RestroomIcon, RoadIcon, StructureIcon, TrashIcon, UploadIcon, createIcon };