@uxf/ui 1.0.0-beta.10 → 1.0.0-beta.11

package/button/theme.d.ts

@@ -11,5 +11,8 @@ export interface ButtonSizes {
 }
 export interface ButtonColors {
     default: true;
-    secondary: true;
+    white: true;
+    success: true;
+    warning: true;
+    error: true;
 }

package/image-gallery/components/close-button.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+interface CloseButtonProps {
+    onClick: () => void;
+}
+declare function CloseButton(props: CloseButtonProps): JSX.Element;
+export default CloseButton;

package/image-gallery/components/close-button.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var icon_close_1 = __importDefault(require("./icon-close"));
+function CloseButton(props) {
+    return (react_1.default.createElement("button", { className: "bg-black bg-opacity-50 p-3", onClick: function () { return props.onClick(); } },
+        react_1.default.createElement(icon_close_1.default, null)));
+}
+exports.default = CloseButton;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2xvc2UtYnV0dG9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ltYWdlLWdhbGxlcnkvY29tcG9uZW50cy9jbG9zZS1idXR0b24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsZ0RBQTBCO0FBQzFCLDREQUFxQztBQU1yQyxTQUFTLFdBQVcsQ0FBQyxLQUF1QjtJQUMxQyxPQUFPLENBQ0wsMENBQ0UsU0FBUyxFQUFDLDRCQUE0QixFQUN0QyxPQUFPLEVBQUUsY0FBTSxPQUFBLEtBQUssQ0FBQyxPQUFPLEVBQUUsRUFBZixDQUFlO1FBRTlCLDhCQUFDLG9CQUFTLE9BQUcsQ0FDTixDQUNWLENBQUM7QUFDSixDQUFDO0FBRUQsa0JBQWUsV0FBVyxDQUFDIn0=

package/image-gallery/components/dot.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+interface DotProps {
+    active?: boolean;
+}
+declare function Dot(props: DotProps): JSX.Element;
+export default Dot;

package/image-gallery/components/dot.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var cx_1 = require("@uxf/core/utils/cx");
+var react_1 = __importDefault(require("react"));
+function Dot(props) {
+    var className = (0, cx_1.cx)("h-2 w-2 rounded-full", props.active ? "bg-gray-500" : "bg-white");
+    return react_1.default.createElement("div", { className: className });
+}
+exports.default = Dot;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZG90LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ltYWdlLWdhbGxlcnkvY29tcG9uZW50cy9kb3QudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEseUNBQXdDO0FBQ3hDLGdEQUEwQjtBQU0xQixTQUFTLEdBQUcsQ0FBQyxLQUFlO0lBQzFCLElBQU0sU0FBUyxHQUFHLElBQUEsT0FBRSxFQUNsQixzQkFBc0IsRUFDdEIsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsYUFBYSxDQUFDLENBQUMsQ0FBQyxVQUFVLENBQzFDLENBQUM7SUFFRixPQUFPLHVDQUFLLFNBQVMsRUFBRSxTQUFTLEdBQUksQ0FBQztBQUN2QyxDQUFDO0FBRUQsa0JBQWUsR0FBRyxDQUFDIn0=

package/image-gallery/components/gallery.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { ImageGalleryImageProps } from "../types";
+interface GalleryProps {
+    onClose: () => void;
+    onNext: () => void;
+    onPrevious: () => void;
+    imageIndex: number;
+    images: ImageGalleryImageProps[];
+}
+declare function Gallery(props: GalleryProps): JSX.Element;
+export default Gallery;

package/image-gallery/components/gallery.js

@@ -0,0 +1,68 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var close_button_1 = __importDefault(require("./close-button"));
+var previous_button_1 = __importDefault(require("./previous-button"));
+var next_button_1 = __importDefault(require("./next-button"));
+var dot_1 = __importDefault(require("./dot"));
+var react_1 = __importStar(require("react"));
+function Gallery(props) {
+    (0, react_1.useEffect)(function () {
+        var onKeyDown = function (event) {
+            switch (event.key) {
+                case "ArrowRight":
+                    props.onNext();
+                    break;
+                case "ArrowLeft":
+                    props.onPrevious();
+                    break;
+                case "Escape":
+                    props.onClose();
+                    break;
+            }
+        };
+        document.body.style.overflow = "hidden";
+        window.addEventListener("keydown", onKeyDown);
+        return function () {
+            document.body.style.overflow = "auto";
+            window.removeEventListener("keydown", onKeyDown);
+        };
+    }, []);
+    return (react_1.default.createElement("div", { className: "fixed inset-0 top-0 bottom-0 z-50 flex flex-col bg-black bg-opacity-75 transition-opacity" },
+        react_1.default.createElement("div", { className: "flex justify-end" },
+            react_1.default.createElement(close_button_1.default, { onClick: props.onClose })),
+        react_1.default.createElement("div", { className: "container mx-auto flex h-full flex-1 flex-col" },
+            react_1.default.createElement("div", { className: "relative flex flex-1 items-center justify-center" },
+                react_1.default.createElement("img", { className: "absolute left-0 right-0 top-0 h-full w-full object-contain", src: props.images[props.imageIndex].src }),
+                react_1.default.createElement("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-between p-2" },
+                    react_1.default.createElement(previous_button_1.default, { onClick: props.onPrevious }),
+                    react_1.default.createElement(next_button_1.default, { onClick: props.onNext })))),
+        react_1.default.createElement("div", { className: "row mx-auto flex space-x-2 p-4" }, props.images.map(function (url, index) { return (react_1.default.createElement(dot_1.default, { key: url.src, active: index === props.imageIndex })); }))));
+}
+exports.default = Gallery;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ2FsbGVyeS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9pbWFnZS1nYWxsZXJ5L2NvbXBvbmVudHMvZ2FsbGVyeS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLGdFQUF5QztBQUN6QyxzRUFBK0M7QUFDL0MsOERBQXVDO0FBQ3ZDLDhDQUF3QjtBQUN4Qiw2Q0FBeUM7QUFXekMsU0FBUyxPQUFPLENBQUMsS0FBbUI7SUFDbEMsSUFBQSxpQkFBUyxFQUFDO1FBQ1IsSUFBTSxTQUFTLEdBQUcsVUFBQyxLQUFvQjtZQUNyQyxRQUFRLEtBQUssQ0FBQyxHQUFHLEVBQUU7Z0JBQ2pCLEtBQUssWUFBWTtvQkFDZixLQUFLLENBQUMsTUFBTSxFQUFFLENBQUM7b0JBQ2YsTUFBTTtnQkFDUixLQUFLLFdBQVc7b0JBQ2QsS0FBSyxDQUFDLFVBQVUsRUFBRSxDQUFDO29CQUNuQixNQUFNO2dCQUNSLEtBQUssUUFBUTtvQkFDWCxLQUFLLENBQUMsT0FBTyxFQUFFLENBQUM7b0JBQ2hCLE1BQU07YUFDVDtRQUNILENBQUMsQ0FBQztRQUVGLFFBQVEsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLFFBQVEsR0FBRyxRQUFRLENBQUM7UUFDeEMsTUFBTSxDQUFDLGdCQUFnQixDQUFDLFNBQVMsRUFBRSxTQUFTLENBQUMsQ0FBQztRQUU5QyxPQUFPO1lBQ0wsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsUUFBUSxHQUFHLE1BQU0sQ0FBQztZQUN0QyxNQUFNLENBQUMsbUJBQW1CLENBQUMsU0FBUyxFQUFFLFNBQVMsQ0FBQyxDQUFDO1FBQ25ELENBQUMsQ0FBQztJQUNKLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQztJQUVQLE9BQU8sQ0FDTCx1Q0FBSyxTQUFTLEVBQUMsMkZBQTJGO1FBQ3hHLHVDQUFLLFNBQVMsRUFBQyxrQkFBa0I7WUFDL0IsOEJBQUMsc0JBQVcsSUFBQyxPQUFPLEVBQUUsS0FBSyxDQUFDLE9BQU8sR0FBSSxDQUNuQztRQUNOLHVDQUFLLFNBQVMsRUFBQywrQ0FBK0M7WUFDNUQsdUNBQUssU0FBUyxFQUFDLGtEQUFrRDtnQkFDL0QsdUNBQ0UsU0FBUyxFQUFDLDREQUE0RCxFQUN0RSxHQUFHLEVBQUUsS0FBSyxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUMsVUFBVSxDQUFDLENBQUMsR0FBRyxHQUN2QztnQkFDRix1Q0FBSyxTQUFTLEVBQUMsNEVBQTRFO29CQUN6Riw4QkFBQyx5QkFBYyxJQUFDLE9BQU8sRUFBRSxLQUFLLENBQUMsVUFBVSxHQUFJO29CQUM3Qyw4QkFBQyxxQkFBVSxJQUFDLE9BQU8sRUFBRSxLQUFLLENBQUMsTUFBTSxHQUFJLENBQ2pDLENBQ0YsQ0FDRjtRQUNOLHVDQUFLLFNBQVMsRUFBQyxnQ0FBZ0MsSUFDNUMsS0FBSyxDQUFDLE1BQU0sQ0FBQyxHQUFHLENBQUMsVUFBQyxHQUFHLEVBQUUsS0FBSyxJQUFLLE9BQUEsQ0FDaEMsOEJBQUMsYUFBRyxJQUFDLEdBQUcsRUFBRSxHQUFHLENBQUMsR0FBRyxFQUFFLE1BQU0sRUFBRSxLQUFLLEtBQUssS0FBSyxDQUFDLFVBQVUsR0FBSSxDQUMxRCxFQUZpQyxDQUVqQyxDQUFDLENBQ0UsQ0FDRixDQUNQLENBQUM7QUFDSixDQUFDO0FBRUQsa0JBQWUsT0FBTyxDQUFDIn0=

package/image-gallery/components/icon-chevron-left.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare function IconChevronLeft(): JSX.Element;
+export default IconChevronLeft;

package/image-gallery/components/icon-chevron-left.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+function IconChevronLeft() {
+    return (react_1.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-10 w-10 text-white", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2 },
+        react_1.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 19l-7-7 7-7" })));
+}
+exports.default = IconChevronLeft;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi1jaGV2cm9uLWxlZnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvaW1hZ2UtZ2FsbGVyeS9jb21wb25lbnRzL2ljb24tY2hldnJvbi1sZWZ0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7OztBQUFBLGdEQUEwQjtBQUUxQixTQUFTLGVBQWU7SUFDdEIsT0FBTyxDQUNMLHVDQUNFLEtBQUssRUFBQyw0QkFBNEIsRUFDbEMsU0FBUyxFQUFDLHNCQUFzQixFQUNoQyxJQUFJLEVBQUMsTUFBTSxFQUNYLE9BQU8sRUFBQyxXQUFXLEVBQ25CLE1BQU0sRUFBQyxjQUFjLEVBQ3JCLFdBQVcsRUFBRSxDQUFDO1FBRWQsd0NBQU0sYUFBYSxFQUFDLE9BQU8sRUFBQyxjQUFjLEVBQUMsT0FBTyxFQUFDLENBQUMsRUFBQyxpQkFBaUIsR0FBRyxDQUNyRSxDQUNQLENBQUM7QUFDSixDQUFDO0FBRUQsa0JBQWUsZUFBZSxDQUFDIn0=

package/image-gallery/components/icon-chevron-right.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare function IconChevronRight(): JSX.Element;
+export default IconChevronRight;

package/image-gallery/components/icon-chevron-right.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+function IconChevronRight() {
+    return (react_1.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-10 w-10 text-white", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2 },
+        react_1.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" })));
+}
+exports.default = IconChevronRight;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi1jaGV2cm9uLXJpZ2h0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ltYWdlLWdhbGxlcnkvY29tcG9uZW50cy9pY29uLWNoZXZyb24tcmlnaHQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsZ0RBQTBCO0FBRTFCLFNBQVMsZ0JBQWdCO0lBQ3ZCLE9BQU8sQ0FDTCx1Q0FDRSxLQUFLLEVBQUMsNEJBQTRCLEVBQ2xDLFNBQVMsRUFBQyxzQkFBc0IsRUFDaEMsSUFBSSxFQUFDLE1BQU0sRUFDWCxPQUFPLEVBQUMsV0FBVyxFQUNuQixNQUFNLEVBQUMsY0FBYyxFQUNyQixXQUFXLEVBQUUsQ0FBQztRQUVkLHdDQUFNLGFBQWEsRUFBQyxPQUFPLEVBQUMsY0FBYyxFQUFDLE9BQU8sRUFBQyxDQUFDLEVBQUMsY0FBYyxHQUFHLENBQ2xFLENBQ1AsQ0FBQztBQUNKLENBQUM7QUFFRCxrQkFBZSxnQkFBZ0IsQ0FBQyJ9

package/image-gallery/components/icon-close.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare function IconClose(): JSX.Element;
+export default IconClose;

package/image-gallery/components/icon-close.js

@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+function IconClose() {
+    return (react_1.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", strokeWidth: 2, className: "h-10 w-10 text-white" },
+        react_1.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 18L18 6M6 6l12 12" })));
+}
+exports.default = IconClose;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi1jbG9zZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9pbWFnZS1nYWxsZXJ5L2NvbXBvbmVudHMvaWNvbi1jbG9zZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxnREFBMEI7QUFFMUIsU0FBUyxTQUFTO0lBQ2hCLE9BQU8sQ0FDTCx1Q0FDRSxLQUFLLEVBQUMsNEJBQTRCLEVBQ2xDLElBQUksRUFBQyxNQUFNLEVBQ1gsT0FBTyxFQUFDLFdBQVcsRUFDbkIsTUFBTSxFQUFDLGNBQWMsRUFDckIsV0FBVyxFQUFFLENBQUMsRUFDZCxTQUFTLEVBQUMsc0JBQXNCO1FBRWhDLHdDQUNFLGFBQWEsRUFBQyxPQUFPLEVBQ3JCLGNBQWMsRUFBQyxPQUFPLEVBQ3RCLENBQUMsRUFBQyxzQkFBc0IsR0FDeEIsQ0FDRSxDQUNQLENBQUM7QUFDSixDQUFDO0FBRUQsa0JBQWUsU0FBUyxDQUFDIn0=

package/image-gallery/components/next-button.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+interface NextButtonProps {
+    onClick: () => void;
+}
+declare function NextButton(props: NextButtonProps): JSX.Element;
+export default NextButton;

package/image-gallery/components/next-button.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var icon_chevron_right_1 = __importDefault(require("./icon-chevron-right"));
+function NextButton(props) {
+    return (react_1.default.createElement("button", { className: "pointer-events-auto rounded-full bg-black bg-opacity-50  p-2", onClick: props.onClick },
+        react_1.default.createElement(icon_chevron_right_1.default, null)));
+}
+exports.default = NextButton;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmV4dC1idXR0b24uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvaW1hZ2UtZ2FsbGVyeS9jb21wb25lbnRzL25leHQtYnV0dG9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7OztBQUFBLGdEQUEwQjtBQUMxQiw0RUFBb0Q7QUFNcEQsU0FBUyxVQUFVLENBQUMsS0FBc0I7SUFDeEMsT0FBTyxDQUNMLDBDQUNFLFNBQVMsRUFBQyw4REFBOEQsRUFDeEUsT0FBTyxFQUFFLEtBQUssQ0FBQyxPQUFPO1FBRXRCLDhCQUFDLDRCQUFnQixPQUFHLENBQ2IsQ0FDVixDQUFDO0FBQ0osQ0FBQztBQUVELGtCQUFlLFVBQVUsQ0FBQyJ9

package/image-gallery/components/previous-button.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+interface PreviousButtonProps {
+    onClick: () => void;
+}
+declare function PreviousButton(props: PreviousButtonProps): JSX.Element;
+export default PreviousButton;

package/image-gallery/components/previous-button.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var icon_chevron_left_1 = __importDefault(require("./icon-chevron-left"));
+function PreviousButton(props) {
+    return (react_1.default.createElement("button", { className: "pointer-events-auto rounded-full bg-black bg-opacity-50 p-2", onClick: props.onClick },
+        react_1.default.createElement(icon_chevron_left_1.default, null)));
+}
+exports.default = PreviousButton;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJldmlvdXMtYnV0dG9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2ltYWdlLWdhbGxlcnkvY29tcG9uZW50cy9wcmV2aW91cy1idXR0b24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsZ0RBQTBCO0FBQzFCLDBFQUFrRDtBQU1sRCxTQUFTLGNBQWMsQ0FBQyxLQUEwQjtJQUNoRCxPQUFPLENBQ0wsMENBQ0UsU0FBUyxFQUFDLDZEQUE2RCxFQUN2RSxPQUFPLEVBQUUsS0FBSyxDQUFDLE9BQU87UUFFdEIsOEJBQUMsMkJBQWUsT0FBRyxDQUNaLENBQ1YsQ0FBQztBQUNKLENBQUM7QUFFRCxrQkFBZSxjQUFjLENBQUMifQ==

package/image-gallery/context.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { ImageGalleryImageProps } from "./types";
+declare type ContextType = {
+    registerImage: (props: ImageGalleryImageProps) => void;
+    unregisterImage: (props: ImageGalleryImageProps) => void;
+    openGallery: (props: ImageGalleryImageProps) => void;
+};
+export declare const ImageGalleryProvider: import("react").Provider<ContextType>;
+export declare const useImageGalleryContext: () => ContextType;
+export {};

package/image-gallery/context.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useImageGalleryContext = exports.ImageGalleryProvider = void 0;
+var react_1 = require("react");
+var ImageGalleryContext = (0, react_1.createContext)({
+    registerImage: function () { return null; },
+    unregisterImage: function () { return null; },
+    openGallery: function () { return null; },
+});
+exports.ImageGalleryProvider = ImageGalleryContext.Provider;
+var useImageGalleryContext = function () { return (0, react_1.useContext)(ImageGalleryContext); };
+exports.useImageGalleryContext = useImageGalleryContext;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udGV4dC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9pbWFnZS1nYWxsZXJ5L2NvbnRleHQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7OztBQUFBLCtCQUFrRDtBQVNsRCxJQUFNLG1CQUFtQixHQUFHLElBQUEscUJBQWEsRUFBYztJQUNyRCxhQUFhLEVBQUUsY0FBTSxPQUFBLElBQUksRUFBSixDQUFJO0lBQ3pCLGVBQWUsRUFBRSxjQUFNLE9BQUEsSUFBSSxFQUFKLENBQUk7SUFDM0IsV0FBVyxFQUFFLGNBQU0sT0FBQSxJQUFJLEVBQUosQ0FBSTtDQUN4QixDQUFDLENBQUM7QUFFVSxRQUFBLG9CQUFvQixHQUFHLG1CQUFtQixDQUFDLFFBQVEsQ0FBQztBQUMxRCxJQUFNLHNCQUFzQixHQUFHLGNBQU0sT0FBQSxJQUFBLGtCQUFVLEVBQUMsbUJBQW1CLENBQUMsRUFBL0IsQ0FBK0IsQ0FBQztBQUEvRCxRQUFBLHNCQUFzQiwwQkFBeUMifQ==

package/image-gallery/image-gallery.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from "react";
+interface ImageGalleryProviderProps {
+    children: ReactNode;
+}
+declare function ImageGallery(props: ImageGalleryProviderProps): JSX.Element;
+export default ImageGallery;

package/image-gallery/image-gallery.js

@@ -0,0 +1,87 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importStar(require("react"));
+var context_1 = require("./context");
+var gallery_1 = __importDefault(require("./components/gallery"));
+function ImageGallery(props) {
+    var _a = __read((0, react_1.useState)([]), 2), images = _a[0], setImages = _a[1];
+    var _b = __read((0, react_1.useState)(null), 2), imageIndex = _b[0], setImageIndex = _b[1];
+    var registerImage = function (image) {
+        return setImages(function (v) { return __spreadArray(__spreadArray([], __read(v), false), [image], false); });
+    };
+    var unregisterImage = function (image) {
+        return setImages(function (v) { return v.filter(function (u) { return u.src !== image.src; }); });
+    };
+    var openGallery = function (image) {
+        return setImageIndex(images.findIndex(function (i) { return i.src === image.src; }));
+    };
+    var onPrevious = (0, react_1.useCallback)(function () {
+        setImageIndex(function (v) { return (v === null ? null : v - 1); });
+    }, []);
+    var onNext = (0, react_1.useCallback)(function () {
+        setImageIndex(function (v) { return (v === null ? null : v + 1); });
+    }, []);
+    // modulo bug https://stackoverflow.com/a/4467559
+    var moduloImageIndex = imageIndex === null
+        ? null
+        : imageIndex < 0
+            ? ((imageIndex % images.length) + images.length) % images.length
+            : imageIndex % images.length;
+    var contextValue = { registerImage: registerImage, unregisterImage: unregisterImage, openGallery: openGallery };
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(context_1.ImageGalleryProvider, { value: contextValue }, props.children),
+        typeof moduloImageIndex === "number" && (react_1.default.createElement(gallery_1.default, { onClose: function () { return setImageIndex(null); }, onNext: onNext, onPrevious: onPrevious, imageIndex: moduloImageIndex, images: images }))));
+}
+exports.default = ImageGallery;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1hZ2UtZ2FsbGVyeS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9pbWFnZS1nYWxsZXJ5L2ltYWdlLWdhbGxlcnkudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBQUEsNkNBQWdFO0FBQ2hFLHFDQUFpRDtBQUVqRCxpRUFBMkM7QUFNM0MsU0FBUyxZQUFZLENBQUMsS0FBZ0M7SUFDOUMsSUFBQSxLQUFBLE9BQXNCLElBQUEsZ0JBQVEsRUFBMkIsRUFBRSxDQUFDLElBQUEsRUFBM0QsTUFBTSxRQUFBLEVBQUUsU0FBUyxRQUEwQyxDQUFDO0lBQzdELElBQUEsS0FBQSxPQUE4QixJQUFBLGdCQUFRLEVBQWdCLElBQUksQ0FBQyxJQUFBLEVBQTFELFVBQVUsUUFBQSxFQUFFLGFBQWEsUUFBaUMsQ0FBQztJQUVsRSxJQUFNLGFBQWEsR0FBRyxVQUFDLEtBQTZCO1FBQ2xELE9BQUEsU0FBUyxDQUFDLFVBQUMsQ0FBQyxJQUFLLDhDQUFJLENBQUMsWUFBRSxLQUFLLFdBQVosQ0FBYSxDQUFDO0lBQS9CLENBQStCLENBQUM7SUFFbEMsSUFBTSxlQUFlLEdBQUcsVUFBQyxLQUE2QjtRQUNwRCxPQUFBLFNBQVMsQ0FBQyxVQUFDLENBQUMsSUFBSyxPQUFBLENBQUMsQ0FBQyxNQUFNLENBQUMsVUFBQyxDQUFDLElBQUssT0FBQSxDQUFDLENBQUMsR0FBRyxLQUFLLEtBQUssQ0FBQyxHQUFHLEVBQW5CLENBQW1CLENBQUMsRUFBcEMsQ0FBb0MsQ0FBQztJQUF0RCxDQUFzRCxDQUFDO0lBRXpELElBQU0sV0FBVyxHQUFHLFVBQUMsS0FBNkI7UUFDaEQsT0FBQSxhQUFhLENBQUMsTUFBTSxDQUFDLFNBQVMsQ0FBQyxVQUFDLENBQUMsSUFBSyxPQUFBLENBQUMsQ0FBQyxHQUFHLEtBQUssS0FBSyxDQUFDLEdBQUcsRUFBbkIsQ0FBbUIsQ0FBQyxDQUFDO0lBQTNELENBQTJELENBQUM7SUFFOUQsSUFBTSxVQUFVLEdBQUcsSUFBQSxtQkFBVyxFQUFDO1FBQzdCLGFBQWEsQ0FBQyxVQUFDLENBQUMsSUFBSyxPQUFBLENBQUMsQ0FBQyxLQUFLLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLEVBQTNCLENBQTJCLENBQUMsQ0FBQztJQUNwRCxDQUFDLEVBQUUsRUFBRSxDQUFDLENBQUM7SUFFUCxJQUFNLE1BQU0sR0FBRyxJQUFBLG1CQUFXLEVBQUM7UUFDekIsYUFBYSxDQUFDLFVBQUMsQ0FBQyxJQUFLLE9BQUEsQ0FBQyxDQUFDLEtBQUssSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLENBQUMsR0FBRyxDQUFDLENBQUMsRUFBM0IsQ0FBMkIsQ0FBQyxDQUFDO0lBQ3BELENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQztJQUVQLGlEQUFpRDtJQUNqRCxJQUFNLGdCQUFnQixHQUNwQixVQUFVLEtBQUssSUFBSTtRQUNqQixDQUFDLENBQUMsSUFBSTtRQUNOLENBQUMsQ0FBQyxVQUFVLEdBQUcsQ0FBQztZQUNoQixDQUFDLENBQUMsQ0FBQyxDQUFDLFVBQVUsR0FBRyxNQUFNLENBQUMsTUFBTSxDQUFDLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQyxHQUFHLE1BQU0sQ0FBQyxNQUFNO1lBQ2hFLENBQUMsQ0FBQyxVQUFVLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQztJQUVqQyxJQUFNLFlBQVksR0FBRyxFQUFFLGFBQWEsZUFBQSxFQUFFLGVBQWUsaUJBQUEsRUFBRSxXQUFXLGFBQUEsRUFBRSxDQUFDO0lBRXJFLE9BQU8sQ0FDTDtRQUNFLDhCQUFDLDhCQUFvQixJQUFDLEtBQUssRUFBRSxZQUFZLElBQ3RDLEtBQUssQ0FBQyxRQUFRLENBQ007UUFDdEIsT0FBTyxnQkFBZ0IsS0FBSyxRQUFRLElBQUksQ0FDdkMsOEJBQUMsaUJBQU8sSUFDTixPQUFPLEVBQUUsY0FBTSxPQUFBLGFBQWEsQ0FBQyxJQUFJLENBQUMsRUFBbkIsQ0FBbUIsRUFDbEMsTUFBTSxFQUFFLE1BQU0sRUFDZCxVQUFVLEVBQUUsVUFBVSxFQUN0QixVQUFVLEVBQUUsZ0JBQWdCLEVBQzVCLE1BQU0sRUFBRSxNQUFNLEdBQ2QsQ0FDSCxDQUNBLENBQ0osQ0FBQztBQUNKLENBQUM7QUFFRCxrQkFBZSxZQUFZLENBQUMifQ==

package/image-gallery/image-gallery.stories.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import ImageGallery from "./image-gallery";
+declare const _default: {
+    title: string;
+    component: typeof ImageGallery;
+    parameters: {
+        actions: {
+            argTypesRegex: string;
+        };
+    };
+};
+export default _default;
+export declare function Default(): JSX.Element;

package/image-gallery/image-gallery.stories.js

@@ -0,0 +1,27 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = void 0;
+var react_1 = __importDefault(require("react"));
+var image_gallery_1 = __importDefault(require("./image-gallery"));
+var image_1 = __importDefault(require("./image"));
+exports.default = {
+    title: "Lab/ImageGallery",
+    component: image_gallery_1.default,
+    parameters: { actions: { argTypesRegex: "^on.*" } },
+};
+var images = [
+    "https://opentopo.app/hero_image.jpeg",
+    "https://opentopo.app/generated/area-18/d/9/d9033d93-ea48-4f66-b0c1-6045c091b326_1024_1024_c.jpg",
+    "https://opentopo.app/generated/area-16/f/4/f4a4ca79-ea9e-44d1-a4ec-3c8ccfbcc218_1024_1024_c.jpg",
+    "https://opentopo.app/generated/area-1/8/b/8b84e378-1f55-4ce7-b750-b504091cb833_1024_1024_c.jpg",
+    "https://opentopo.app/generated/area-2/e/7/e7ec532b-20c2-407e-9305-fa7cfb71f01f_1024_1024_c.jpg",
+];
+function Default() {
+    return (react_1.default.createElement(image_gallery_1.default, null,
+        react_1.default.createElement("div", { className: "flex-direction flex gap-2" }, images.map(function (src) { return (react_1.default.createElement(image_1.default, { key: src, src: src, className: "h-56 w-56 cursor-pointer object-cover transition-transform hover:scale-105" })); }))));
+}
+exports.Default = Default;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1hZ2UtZ2FsbGVyeS5zdG9yaWVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2ltYWdlLWdhbGxlcnkvaW1hZ2UtZ2FsbGVyeS5zdG9yaWVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7QUFBQSxnREFBMEI7QUFDMUIsa0VBQTJDO0FBQzNDLGtEQUE0QjtBQUU1QixrQkFBZTtJQUNiLEtBQUssRUFBRSxrQkFBa0I7SUFDekIsU0FBUyxFQUFFLHVCQUFZO0lBQ3ZCLFVBQVUsRUFBRSxFQUFFLE9BQU8sRUFBRSxFQUFFLGFBQWEsRUFBRSxPQUFPLEVBQUUsRUFBRTtDQUNwRCxDQUFDO0FBRUYsSUFBTSxNQUFNLEdBQUc7SUFDYixzQ0FBc0M7SUFDdEMsaUdBQWlHO0lBQ2pHLGlHQUFpRztJQUNqRyxnR0FBZ0c7SUFDaEcsZ0dBQWdHO0NBQ2pHLENBQUM7QUFFRixTQUFnQixPQUFPO0lBQ3JCLE9BQU8sQ0FDTCw4QkFBQyx1QkFBWTtRQUNYLHVDQUFLLFNBQVMsRUFBQywyQkFBMkIsSUFDdkMsTUFBTSxDQUFDLEdBQUcsQ0FBQyxVQUFDLEdBQUcsSUFBSyxPQUFBLENBQ25CLDhCQUFDLGVBQUssSUFDSixHQUFHLEVBQUUsR0FBRyxFQUNSLEdBQUcsRUFBRSxHQUFHLEVBQ1IsU0FBUyxFQUFDLDRFQUE0RSxHQUN0RixDQUNILEVBTm9CLENBTXBCLENBQUMsQ0FDRSxDQUNPLENBQ2hCLENBQUM7QUFDSixDQUFDO0FBZEQsMEJBY0MifQ==

package/image-gallery/image.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { ImageGalleryImageProps } from "@uxf/ui/image-gallery/types";
+declare function Image(props: ImageGalleryImageProps): JSX.Element;
+export default Image;

package/image-gallery/image.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var use_image_1 = require("./use-image");
+function Image(props) {
+    var openGallery = (0, use_image_1.useImage)(props);
+    return (react_1.default.createElement("img", { src: props.src, alt: props.alt, title: props.title, className: props.className, onClick: function () { return openGallery(props); } }));
+}
+exports.default = Image;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1hZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvaW1hZ2UtZ2FsbGVyeS9pbWFnZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxnREFBMEI7QUFDMUIseUNBQXVDO0FBR3ZDLFNBQVMsS0FBSyxDQUFDLEtBQTZCO0lBQzFDLElBQU0sV0FBVyxHQUFHLElBQUEsb0JBQVEsRUFBQyxLQUFLLENBQUMsQ0FBQztJQUVwQyxPQUFPLENBQ0wsdUNBQ0UsR0FBRyxFQUFFLEtBQUssQ0FBQyxHQUFHLEVBQ2QsR0FBRyxFQUFFLEtBQUssQ0FBQyxHQUFHLEVBQ2QsS0FBSyxFQUFFLEtBQUssQ0FBQyxLQUFLLEVBQ2xCLFNBQVMsRUFBRSxLQUFLLENBQUMsU0FBUyxFQUMxQixPQUFPLEVBQUUsY0FBTSxPQUFBLFdBQVcsQ0FBQyxLQUFLLENBQUMsRUFBbEIsQ0FBa0IsR0FDakMsQ0FDSCxDQUFDO0FBQ0osQ0FBQztBQUVELGtCQUFlLEtBQUssQ0FBQyJ9

package/image-gallery/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Image } from "./image";
+export { default as ImageGallery } from "./image-gallery";
+export * from "./use-image";

package/image-gallery/index.js

@@ -0,0 +1,26 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ImageGallery = exports.Image = void 0;
+var image_1 = require("./image");
+Object.defineProperty(exports, "Image", { enumerable: true, get: function () { return __importDefault(image_1).default; } });
+var image_gallery_1 = require("./image-gallery");
+Object.defineProperty(exports, "ImageGallery", { enumerable: true, get: function () { return __importDefault(image_gallery_1).default; } });
+__exportStar(require("./use-image"), exports);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvaW1hZ2UtZ2FsbGVyeS9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLGlDQUEyQztBQUFsQywrR0FBQSxPQUFPLE9BQVM7QUFDekIsaURBQTBEO0FBQWpELDhIQUFBLE9BQU8sT0FBZ0I7QUFDaEMsOENBQTRCIn0=

package/image-gallery/types.d.ts

@@ -0,0 +1,6 @@
+export interface ImageGalleryImageProps {
+    src: string;
+    title?: string;
+    alt?: string;
+    className?: string;
+}

package/image-gallery/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHlwZXMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvaW1hZ2UtZ2FsbGVyeS90eXBlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=

package/image-gallery/use-image.d.ts

@@ -0,0 +1,2 @@
+import { ImageGalleryImageProps } from "./types";
+export declare function useImage(props: ImageGalleryImageProps): (props: ImageGalleryImageProps) => void;

package/image-gallery/use-image.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useImage = void 0;
+var react_1 = require("react");
+var context_1 = require("./context");
+function useImage(props) {
+    var _a = (0, context_1.useImageGalleryContext)(), registerImage = _a.registerImage, unregisterImage = _a.unregisterImage, openGallery = _a.openGallery;
+    (0, react_1.useEffect)(function () {
+        registerImage(props);
+        return function () {
+            unregisterImage(props);
+        };
+    }, [props]);
+    return openGallery;
+}
+exports.useImage = useImage;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlLWltYWdlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL2ltYWdlLWdhbGxlcnkvdXNlLWltYWdlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7OztBQUFBLCtCQUFrQztBQUNsQyxxQ0FBbUQ7QUFHbkQsU0FBZ0IsUUFBUSxDQUFDLEtBQTZCO0lBQzlDLElBQUEsS0FDSixJQUFBLGdDQUFzQixHQUFFLEVBRGxCLGFBQWEsbUJBQUEsRUFBRSxlQUFlLHFCQUFBLEVBQUUsV0FBVyxpQkFDekIsQ0FBQztJQUUzQixJQUFBLGlCQUFTLEVBQUM7UUFDUixhQUFhLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDckIsT0FBTztZQUNMLGVBQWUsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUN6QixDQUFDLENBQUM7SUFDSixDQUFDLEVBQUUsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDO0lBRVosT0FBTyxXQUFXLENBQUM7QUFDckIsQ0FBQztBQVpELDRCQVlDIn0=

package/input/index.d.ts

@@ -0,0 +1,6 @@
+export { default as Input } from "./input";
+export { default as InputGroup } from "./input-group";
+export { default as InputLeftElement } from "./input-left-element";
+export { default as InputRightElement } from "./input-right-element";
+export { default as InputLeftAddon } from "./input-left-addon";
+export { default as InputRightAddon } from "./input-right-addon";

package/input/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InputRightAddon = exports.InputLeftAddon = exports.InputRightElement = exports.InputLeftElement = exports.InputGroup = exports.Input = void 0;
+var input_1 = require("./input");
+Object.defineProperty(exports, "Input", { enumerable: true, get: function () { return __importDefault(input_1).default; } });
+var input_group_1 = require("./input-group");
+Object.defineProperty(exports, "InputGroup", { enumerable: true, get: function () { return __importDefault(input_group_1).default; } });
+var input_left_element_1 = require("./input-left-element");
+Object.defineProperty(exports, "InputLeftElement", { enumerable: true, get: function () { return __importDefault(input_left_element_1).default; } });
+var input_right_element_1 = require("./input-right-element");
+Object.defineProperty(exports, "InputRightElement", { enumerable: true, get: function () { return __importDefault(input_right_element_1).default; } });
+var input_left_addon_1 = require("./input-left-addon");
+Object.defineProperty(exports, "InputLeftAddon", { enumerable: true, get: function () { return __importDefault(input_left_addon_1).default; } });
+var input_right_addon_1 = require("./input-right-addon");
+Object.defineProperty(exports, "InputRightAddon", { enumerable: true, get: function () { return __importDefault(input_right_addon_1).default; } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvaW5wdXQvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQUEsaUNBQTJDO0FBQWxDLCtHQUFBLE9BQU8sT0FBUztBQUN6Qiw2Q0FBc0Q7QUFBN0MsMEhBQUEsT0FBTyxPQUFjO0FBQzlCLDJEQUFtRTtBQUExRCx1SUFBQSxPQUFPLE9BQW9CO0FBQ3BDLDZEQUFxRTtBQUE1RCx5SUFBQSxPQUFPLE9BQXFCO0FBQ3JDLHVEQUErRDtBQUF0RCxtSUFBQSxPQUFPLE9BQWtCO0FBQ2xDLHlEQUFpRTtBQUF4RCxxSUFBQSxPQUFPLE9BQW1CIn0=

package/input/input-group.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from "react";
+import { InputGroupSizes, InputGroupVariants } from "@uxf/ui/input/theme";
+interface InputGroupProps {
+    children: ReactNode;
+    variant?: keyof InputGroupVariants;
+    size?: keyof InputGroupSizes;
+}
+declare function InputGroup(props: InputGroupProps): JSX.Element;
+export default InputGroup;