@reykjavik/hanna-react 0.10.53

package/lib/FormField.cjs

@@ -0,0 +1,153 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+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(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var FormField_exports = {};
+__export(FormField_exports, {
+  default: () => FormField_default
+});
+module.exports = __toCommonJS(FormField_exports);
+var import_react = __toESM(require("react"));
+var import_hooks = require("@hugsmidjan/react/hooks");
+var import_getBemClass = __toESM(require("@hugsmidjan/react/utils/getBemClass"));
+var import_env = require("./utils/env");
+const inputClassNames = {
+  bem: "FormField",
+  input: "FormField__input",
+  options: "FormField__options",
+  control: "FormField__control"
+};
+const FormField = (props) => {
+  const {
+    className,
+    small,
+    group,
+    LabelTag = group ? "h4" : void 0,
+    label,
+    assistText,
+    hideLabel,
+    empty,
+    filled,
+    readOnly,
+    disabled,
+    invalid,
+    errorMessage,
+    required,
+    reqText,
+    renderInput,
+    id,
+    ssr
+  } = props;
+  const isBrowser = (0, import_hooks.useIsBrowserSide)(ssr);
+  const isInvalid = invalid || !!errorMessage || void 0;
+  const domid = (0, import_hooks.useDomid)(id);
+  const [focused, setFocused] = (0, import_react.useState)(false);
+  const addFocusProps = (0, import_react.useCallback)((ownProps) => {
+    const { onFocus, onBlur } = ownProps || {};
+    const focusHandler = (e) => {
+      if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {
+        setFocused(true);
+      }
+      onFocus && onFocus(e);
+    };
+    const blurHandler = (e) => {
+      if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {
+        setFocused(false);
+      }
+      onBlur && onBlur(e);
+    };
+    const focusProps = __spreadProps(__spreadValues({}, ownProps), {
+      onFocus: focusHandler,
+      onBlur: blurHandler
+    });
+    if (import_env.isPreact) {
+      const focusinHandler = (e) => {
+        e.currentTarget !== e.target && focusHandler(e);
+      };
+      const focusoutHandler = (e) => {
+        e.currentTarget !== e.target && blurHandler(e);
+      };
+      focusProps.onfocusin = focusinHandler;
+      focusProps.onfocusout = focusoutHandler;
+    }
+    return focusProps;
+  }, []);
+  const errorId = errorMessage ? "error:" + domid : void 0;
+  const assistTextId = assistText ? "assist:" + domid : void 0;
+  const labelId = LabelTag ? "label:" + domid : void 0;
+  const reqStar = required && reqText !== false && /* @__PURE__ */ import_react.default.createElement("abbr", {
+    className: "FormField__label__reqstar",
+    title: (reqText || "\xDEarf a\xF0 fylla \xFAt") + ": "
+  }, "*");
+  const inputProps = {
+    id: domid,
+    disabled,
+    required,
+    readOnly,
+    "aria-invalid": isInvalid,
+    "aria-describedby": assistTextId && errorId ? assistTextId + " " + errorId : assistTextId || errorId,
+    "aria-labelledby": labelId
+  };
+  return /* @__PURE__ */ import_react.default.createElement("div", {
+    className: (0, import_getBemClass.default)("FormField", [
+      small && "small",
+      hideLabel && "nolabel",
+      isInvalid && "invalid",
+      disabled && "disabled",
+      readOnly && "readonly",
+      isBrowser && empty && "empty",
+      isBrowser && filled && "filled",
+      isBrowser && focused && "focused"
+    ], className),
+    role: group ? "group" : void 0,
+    ref: props.wrapperRef
+  }, LabelTag ? /* @__PURE__ */ import_react.default.createElement(LabelTag, {
+    className: "FormField__label",
+    id: labelId
+  }, " ", reqStar, " ", label, " ") : /* @__PURE__ */ import_react.default.createElement("label", {
+    className: "FormField__label",
+    htmlFor: domid
+  }, " ", reqStar, " ", label, " "), " ", renderInput(inputClassNames, inputProps, addFocusProps, isBrowser), assistText && /* @__PURE__ */ import_react.default.createElement("div", {
+    id: assistTextId,
+    className: "FormField__assist"
+  }, assistText), errorMessage && /* @__PURE__ */ import_react.default.createElement("div", {
+    id: errorId,
+    className: "FormField__error"
+  }, errorMessage));
+};
+var FormField_default = FormField;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {});

package/lib/FormField.mjs

@@ -0,0 +1,131 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import React, { useCallback, useState } from "react";
+import { useDomid, useIsBrowserSide } from "@hugsmidjan/react/hooks";
+import getBemClass from "@hugsmidjan/react/utils/getBemClass";
+import { isPreact } from "./utils/env";
+const inputClassNames = {
+  bem: "FormField",
+  input: "FormField__input",
+  options: "FormField__options",
+  control: "FormField__control"
+};
+const FormField = (props) => {
+  const {
+    className,
+    small,
+    group,
+    LabelTag = group ? "h4" : void 0,
+    label,
+    assistText,
+    hideLabel,
+    empty,
+    filled,
+    readOnly,
+    disabled,
+    invalid,
+    errorMessage,
+    required,
+    reqText,
+    renderInput,
+    id,
+    ssr
+  } = props;
+  const isBrowser = useIsBrowserSide(ssr);
+  const isInvalid = invalid || !!errorMessage || void 0;
+  const domid = useDomid(id);
+  const [focused, setFocused] = useState(false);
+  const addFocusProps = useCallback((ownProps) => {
+    const { onFocus, onBlur } = ownProps || {};
+    const focusHandler = (e) => {
+      if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {
+        setFocused(true);
+      }
+      onFocus && onFocus(e);
+    };
+    const blurHandler = (e) => {
+      if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {
+        setFocused(false);
+      }
+      onBlur && onBlur(e);
+    };
+    const focusProps = __spreadProps(__spreadValues({}, ownProps), {
+      onFocus: focusHandler,
+      onBlur: blurHandler
+    });
+    if (isPreact) {
+      const focusinHandler = (e) => {
+        e.currentTarget !== e.target && focusHandler(e);
+      };
+      const focusoutHandler = (e) => {
+        e.currentTarget !== e.target && blurHandler(e);
+      };
+      focusProps.onfocusin = focusinHandler;
+      focusProps.onfocusout = focusoutHandler;
+    }
+    return focusProps;
+  }, []);
+  const errorId = errorMessage ? "error:" + domid : void 0;
+  const assistTextId = assistText ? "assist:" + domid : void 0;
+  const labelId = LabelTag ? "label:" + domid : void 0;
+  const reqStar = required && reqText !== false && /* @__PURE__ */ React.createElement("abbr", {
+    className: "FormField__label__reqstar",
+    title: (reqText || "\xDEarf a\xF0 fylla \xFAt") + ": "
+  }, "*");
+  const inputProps = {
+    id: domid,
+    disabled,
+    required,
+    readOnly,
+    "aria-invalid": isInvalid,
+    "aria-describedby": assistTextId && errorId ? assistTextId + " " + errorId : assistTextId || errorId,
+    "aria-labelledby": labelId
+  };
+  return /* @__PURE__ */ React.createElement("div", {
+    className: getBemClass("FormField", [
+      small && "small",
+      hideLabel && "nolabel",
+      isInvalid && "invalid",
+      disabled && "disabled",
+      readOnly && "readonly",
+      isBrowser && empty && "empty",
+      isBrowser && filled && "filled",
+      isBrowser && focused && "focused"
+    ], className),
+    role: group ? "group" : void 0,
+    ref: props.wrapperRef
+  }, LabelTag ? /* @__PURE__ */ React.createElement(LabelTag, {
+    className: "FormField__label",
+    id: labelId
+  }, " ", reqStar, " ", label, " ") : /* @__PURE__ */ React.createElement("label", {
+    className: "FormField__label",
+    htmlFor: domid
+  }, " ", reqStar, " ", label, " "), " ", renderInput(inputClassNames, inputProps, addFocusProps, isBrowser), assistText && /* @__PURE__ */ React.createElement("div", {
+    id: assistTextId,
+    className: "FormField__assist"
+  }, assistText), errorMessage && /* @__PURE__ */ React.createElement("div", {
+    id: errorId,
+    className: "FormField__error"
+  }, errorMessage));
+};
+var FormField_default = FormField;
+export {
+  FormField_default as default
+};

package/lib/Gallery/_GalleryItem.cjs

@@ -0,0 +1,83 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+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(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var GalleryItem_exports = {};
+__export(GalleryItem_exports, {
+  default: () => GalleryItem_default
+});
+module.exports = __toCommonJS(GalleryItem_exports);
+var import_react = __toESM(require("react"));
+var import_Button = __toESM(require("../_abstract/Button"));
+var import_Image = __toESM(require("../_abstract/Image"));
+var import_GalleryModalContext = __toESM(require("./_GalleryModalContext"));
+const GalleryItem = (props) => {
+  const _a = props, { caption, description, largeImageSrc } = _a, image = __objRest(_a, ["caption", "description", "largeImageSrc"]);
+  const { setCurrentImage } = (0, import_react.useContext)(import_GalleryModalContext.default);
+  return /* @__PURE__ */ import_react.default.createElement("figure", {
+    className: "GalleryItem"
+  }, /* @__PURE__ */ import_react.default.createElement("figcaption", {
+    className: "GalleryItem__caption"
+  }, caption), largeImageSrc ? /* @__PURE__ */ import_react.default.createElement(import_Button.default, {
+    bem: "GalleryItem__button",
+    href: largeImageSrc,
+    onClick: (e) => {
+      e.preventDefault();
+      setCurrentImage(__spreadProps(__spreadValues({}, image), { caption, description, largeImageSrc }));
+    }
+  }, " ", /* @__PURE__ */ import_react.default.createElement(import_Image.default, __spreadValues({
+    className: "GalleryItem__image"
+  }, image)), " ") : /* @__PURE__ */ import_react.default.createElement(import_Image.default, __spreadValues({
+    className: "GalleryItem__image"
+  }, image)), description && /* @__PURE__ */ import_react.default.createElement("div", {
+    className: "GalleryItem__description"
+  }, description));
+};
+var GalleryItem_default = GalleryItem;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {});

package/lib/Gallery/_GalleryItem.mjs

@@ -0,0 +1,61 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import React, { useContext } from "react";
+import Button from "../_abstract/Button";
+import Image from "../_abstract/Image";
+import GalleryModalContext from "./_GalleryModalContext";
+const GalleryItem = (props) => {
+  const _a = props, { caption, description, largeImageSrc } = _a, image = __objRest(_a, ["caption", "description", "largeImageSrc"]);
+  const { setCurrentImage } = useContext(GalleryModalContext);
+  return /* @__PURE__ */ React.createElement("figure", {
+    className: "GalleryItem"
+  }, /* @__PURE__ */ React.createElement("figcaption", {
+    className: "GalleryItem__caption"
+  }, caption), largeImageSrc ? /* @__PURE__ */ React.createElement(Button, {
+    bem: "GalleryItem__button",
+    href: largeImageSrc,
+    onClick: (e) => {
+      e.preventDefault();
+      setCurrentImage(__spreadProps(__spreadValues({}, image), { caption, description, largeImageSrc }));
+    }
+  }, " ", /* @__PURE__ */ React.createElement(Image, __spreadValues({
+    className: "GalleryItem__image"
+  }, image)), " ") : /* @__PURE__ */ React.createElement(Image, __spreadValues({
+    className: "GalleryItem__image"
+  }, image)), description && /* @__PURE__ */ React.createElement("div", {
+    className: "GalleryItem__description"
+  }, description));
+};
+var GalleryItem_default = GalleryItem;
+export {
+  GalleryItem_default as default
+};

package/lib/Gallery/_GalleryModal.cjs

@@ -0,0 +1,104 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+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(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var GalleryModal_exports = {};
+__export(GalleryModal_exports, {
+  default: () => GalleryModal_default
+});
+module.exports = __toCommonJS(GalleryModal_exports);
+var import_react = __toESM(require("react"));
+var import_react_transition_group = require("react-transition-group");
+var import_object = require("@hugsmidjan/qj/object");
+var import_CarouselPaging = __toESM(require("@hugsmidjan/react/CarouselPaging"));
+var import_Modal = __toESM(require("@hugsmidjan/react/Modal"));
+var import_GalleryModalContext = __toESM(require("./_GalleryModalContext"));
+var import_GalleryModalItem = __toESM(require("./_GalleryModalItem"));
+const GalleryModal = (props) => {
+  const { texts } = props;
+  const { currentImage, items, setCurrentImage } = (0, import_react.useContext)(import_GalleryModalContext.default);
+  const [image, setImage] = (0, import_react.useState)(currentImage);
+  const [animated, setAnimated] = (0, import_react.useState)(false);
+  const updateImage = (index) => {
+    setAnimated(!animated);
+    setTimeout(() => {
+      setCurrentImage(items[index]);
+    }, 200);
+  };
+  (0, import_react.useEffect)(() => {
+    if (image !== currentImage) {
+      const imgSource = (currentImage == null ? void 0 : currentImage.largeImageSrc) || (currentImage == null ? void 0 : currentImage.src);
+      if (imgSource) {
+        const imageToLoad = new window.Image();
+        imageToLoad.src = imgSource;
+        imageToLoad.onload = () => {
+          setImage(currentImage);
+        };
+      } else {
+        setImage(void 0);
+      }
+    }
+  }, [image, currentImage]);
+  if (!image) {
+    return null;
+  }
+  const imageIndex = items.findIndex((item) => (0, import_object.objectIsSame)((0, import_object.objectClean)(image), (0, import_object.objectClean)(item)));
+  return /* @__PURE__ */ import_react.default.createElement(import_Modal.default, {
+    open: true,
+    onClosed: () => {
+      setCurrentImage(void 0);
+    },
+    startOpen: false,
+    bem: "GalleryModal",
+    texts: { closeButton: texts.modalCloseLabel }
+  }, /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_react_transition_group.CSSTransition, {
+    in: animated,
+    timeout: 200,
+    onEntered: () => {
+      setAnimated(!animated);
+    },
+    classNames: "GalleryModalItem--"
+  }, /* @__PURE__ */ import_react.default.createElement(import_GalleryModalItem.default, __spreadValues({}, image))), /* @__PURE__ */ import_react.default.createElement(import_CarouselPaging.default, {
+    bem: "GalleryModalPager",
+    itemCount: items.length,
+    current: imageIndex,
+    setCurrent: updateImage,
+    texts: {
+      next: texts.modalNextLabel,
+      prev: texts.modalPrevLabel
+    }
+  })));
+};
+var GalleryModal_default = GalleryModal;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {});

package/lib/Gallery/_GalleryModal.mjs

@@ -0,0 +1,82 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import React, { useContext, useEffect, useState } from "react";
+import { CSSTransition } from "react-transition-group";
+import { objectClean, objectIsSame } from "@hugsmidjan/qj/object";
+import CarouselPaging from "@hugsmidjan/react/CarouselPaging";
+import Modal from "@hugsmidjan/react/Modal";
+import GalleryModalContext from "./_GalleryModalContext";
+import GalleryModalItem from "./_GalleryModalItem";
+const GalleryModal = (props) => {
+  const { texts } = props;
+  const { currentImage, items, setCurrentImage } = useContext(GalleryModalContext);
+  const [image, setImage] = useState(currentImage);
+  const [animated, setAnimated] = useState(false);
+  const updateImage = (index) => {
+    setAnimated(!animated);
+    setTimeout(() => {
+      setCurrentImage(items[index]);
+    }, 200);
+  };
+  useEffect(() => {
+    if (image !== currentImage) {
+      const imgSource = (currentImage == null ? void 0 : currentImage.largeImageSrc) || (currentImage == null ? void 0 : currentImage.src);
+      if (imgSource) {
+        const imageToLoad = new window.Image();
+        imageToLoad.src = imgSource;
+        imageToLoad.onload = () => {
+          setImage(currentImage);
+        };
+      } else {
+        setImage(void 0);
+      }
+    }
+  }, [image, currentImage]);
+  if (!image) {
+    return null;
+  }
+  const imageIndex = items.findIndex((item) => objectIsSame(objectClean(image), objectClean(item)));
+  return /* @__PURE__ */ React.createElement(Modal, {
+    open: true,
+    onClosed: () => {
+      setCurrentImage(void 0);
+    },
+    startOpen: false,
+    bem: "GalleryModal",
+    texts: { closeButton: texts.modalCloseLabel }
+  }, /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(CSSTransition, {
+    in: animated,
+    timeout: 200,
+    onEntered: () => {
+      setAnimated(!animated);
+    },
+    classNames: "GalleryModalItem--"
+  }, /* @__PURE__ */ React.createElement(GalleryModalItem, __spreadValues({}, image))), /* @__PURE__ */ React.createElement(CarouselPaging, {
+    bem: "GalleryModalPager",
+    itemCount: items.length,
+    current: imageIndex,
+    setCurrent: updateImage,
+    texts: {
+      next: texts.modalNextLabel,
+      prev: texts.modalPrevLabel
+    }
+  })));
+};
+var GalleryModal_default = GalleryModal;
+export {
+  GalleryModal_default as default
+};

package/lib/Gallery/_GalleryModalContext.cjs

@@ -0,0 +1,30 @@
+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 __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(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var GalleryModalContext_exports = {};
+__export(GalleryModalContext_exports, {
+  default: () => GalleryModalContext_default
+});
+module.exports = __toCommonJS(GalleryModalContext_exports);
+var import_react = __toESM(require("react"));
+const GalleryModalContext = import_react.default.createContext({});
+var GalleryModalContext_default = GalleryModalContext;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {});

package/lib/Gallery/_GalleryModalContext.mjs

@@ -0,0 +1,6 @@
+import React from "react";
+const GalleryModalContext = React.createContext({});
+var GalleryModalContext_default = GalleryModalContext;
+export {
+  GalleryModalContext_default as default
+};