"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/molecules/dot-navigation.tsx
var dot_navigation_exports = {};
__export(dot_navigation_exports, {
  DotNavigation: () => DotNavigation
});
module.exports = __toCommonJS(dot_navigation_exports);
var import_react = require("react");
var import_react_icons = require("@radix-ui/react-icons");

// src/atoms/flex.tsx
var import_themes = require("@radix-ui/themes");

// src/molecules/dot-navigation.tsx
var import_jsx_runtime = require("react/jsx-runtime");
function DotNavigation(props) {
  const { dotCount, onClick, dotIndex, defaultDotIndex, onChangeDotIndex } = props;
  const [currentDot, setCurrentDot] = (0, import_react.useState)(
    () => {
      var _a;
      return (_a = defaultDotIndex != null ? defaultDotIndex : dotIndex) != null ? _a : 0;
    }
  );
  const onClickDot = (0, import_react.useCallback)(
    (i) => {
      if (onClick) {
        onClick(i);
      } else {
        setCurrentDot(i);
      }
    },
    [onClick]
  );
  (0, import_react.useEffect)(() => {
    onChangeDotIndex == null ? void 0 : onChangeDotIndex(currentDot);
  }, [currentDot, onChangeDotIndex]);
  (0, import_react.useEffect)(() => {
    if (typeof dotIndex === "undefined")
      return;
    setCurrentDot(dotIndex);
  }, [dotIndex]);
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Flex, { children: dotCount ? Array.from({ length: dotCount }, (_, i) => i).map((_, index) => {
    const isSelected = currentDot === index;
    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
      import_react_icons.DotFilledIcon,
      {
        height: "24px",
        onClick: () => {
          onClickDot(index);
        },
        opacity: isSelected ? void 0 : 0.25,
        style: {
          cursor: "pointer"
        },
        width: "24px"
      },
      index
    );
  }) : null });
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  DotNavigation
});
//# sourceMappingURL=dot-navigation.cjs.map