@mbpockets/shared-ui 0.2.0 → 0.2.5

package/dist/TablePage/EditComponents.mjs

@@ -0,0 +1,286 @@
+"use client";
+import { useState, useMemo } from 'react';
+import { Box, Tooltip } from '@mui/material';
+import TextField2 from '@mui/material/TextField';
+import CasinoIcon from '@mui/icons-material/Casino';
+import Grid from '@mui/material/Grid';
+import Autocomplete from '@mui/material/Autocomplete';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+// src/components/TablePage/EditComponents/EditTableDetailsForm.tsx
+
+// src/components/shared/NameGenerator.ts
+var getRandomTitle = () => {
+  const randomPrefix = titlePrefixes[Math.random() * titlePrefixes.length | 0];
+  const randomMiddle = tileMiddle[Math.random() * tileMiddle.length | 0];
+  const randomSuffix = titleSuffixes[Math.random() * titleSuffixes.length | 0];
+  return `${randomPrefix} ${randomMiddle} ${randomSuffix}`;
+};
+var getRandomTagline = () => taglines[Math.random() * taglines.length | 0];
+var titlePrefixes = [
+  "The Knights of The",
+  "The Fellowship of The",
+  "The Order of The",
+  "The Infamous",
+  "The Legendary",
+  "The Dubious",
+  "The Sworn Guardians of The",
+  "The Ancient Guild of The",
+  "The Unstoppable",
+  "The Misfit",
+  "The Chaotic",
+  "The Brave",
+  "The Forgotten",
+  "The Wandering",
+  "The Noble Council of The",
+  "The Dread Pirates of The",
+  "The Honorable Society of The",
+  "The Cursed",
+  "The Unlikely Heroes of The",
+  "The Elders of The",
+  "The Seekers of The",
+  "The Champions of The",
+  "The Heralds of The",
+  "The Disciples of The",
+  "The Ragtag Band of The",
+  "The Cult of The"
+];
+var tileMiddle = [
+  "Round",
+  "Kitchen",
+  "Deepest",
+  "Sorcery",
+  "Munchkin",
+  "Shenanigan",
+  "Secret",
+  "Dungeon",
+  "Fireside",
+  "Tabletop",
+  "Midnight",
+  "Tavern",
+  "Goblin",
+  "Dragon",
+  "Critical",
+  "Natural Twenty",
+  "Counterspell",
+  "Nat One",
+  "Cardboard",
+  "Dice Tower",
+  "Campaign",
+  "Lore",
+  "Awkward",
+  "Unhinged",
+  "Chaotic Neutral",
+  "Homebrew",
+  "Side Quest"
+];
+var titleSuffixes = [
+  "Table",
+  "Dungeon",
+  "Cave",
+  "Crew",
+  "Team",
+  "League",
+  "Horde",
+  "Party",
+  "Conclave",
+  "Collective",
+  "Alliance",
+  "Syndicate",
+  "Guild",
+  "Cabal",
+  "Council",
+  "Expedition",
+  "Enclave",
+  "Consortium",
+  "Troupe",
+  "Vanguard",
+  "Cohort",
+  "Brotherhood",
+  "Sisterhood",
+  "Pantheon",
+  "Assembly",
+  "Coven"
+];
+var taglines = [
+  "Everyone is welcome!",
+  "Looking for serious players.",
+  "Get in nerds, we're gaming!",
+  "If you aren't there, you're square.",
+  "It will be legendary!",
+  "Beginners welcome \u2014 we were all level 1 once.",
+  "No experience necessary. Snacks encouraged.",
+  "Roleplayers, board gamers, and chaos gremlins welcome.",
+  "We don't metagame. Much.",
+  "All alignments accepted. True Neutral gets the snacks.",
+  "Where every session is a one-shot... until it isn't.",
+  "Homebrew rules may apply.",
+  "Warning: may contain excessive lore.",
+  "Critical failures celebrated as much as critical hits.",
+  "No powergamers. Okay, maybe one powergamer.",
+  "We finish campaigns. (Eventually.)",
+  "Veteran players seeking worthy companions.",
+  "Casuals only \u2014 we're here for the vibes.",
+  "Serious about fun, not about rules.",
+  "Min-maxers need not apply.",
+  "For those who read the rulebook... and those who definitely didn't.",
+  "Roll for initiative. Arrive on time.",
+  "Side quests are the main quest here.",
+  "Chaotic good energy required.",
+  "If you bring snacks, you can name the first NPC.",
+  "We read the rulebook so you don't have to.",
+  "Wargamers only \u2014 no take-backs, no mercy.",
+  "Everyone welcome. Meeple provided.",
+  "We always play the longest game on the shelf.",
+  "Worker placement. Resource management. Existential dread.",
+  "No phones at the table! We're here for the game.",
+  "Someone always flips the table. Metaphorically. Usually.",
+  "We have a designated rules lawyer. It's fine.",
+  "Cooperative games only \u2014 we can't handle another Monopoly incident.",
+  "Teaching time is half the fun!"
+];
+function Chip({ tag, removeCallback }) {
+  var _a;
+  const color = (_a = tag.color) != null ? _a : "#bfbcbb";
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: "inline-block text-sm px-3 py-1 rounded-full border-2 font-outlined text-white m-0.5 font-stretch-105% font-sans",
+      style: {
+        borderColor: `color-mix(in srgb, ${color}, black 50%)`,
+        background: `linear-gradient(160deg, color-mix(in srgb, ${color}, white 10%) 0%, color-mix(in srgb, ${color}, black 60%) 100%)`,
+        textShadow: "black 1.5px 1px 1.5px",
+        filter: `drop-shadow(2px 2px 1.5px color-mix(in srgb, ${color}, black 80%))`
+      },
+      children: [
+        tag.label,
+        removeCallback && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => removeCallback(tag.id),
+            className: "ml-2 text-white hover:text-red-700 focus:outline-none pl-0.5 pr-1 cursor-pointer hover:bg-white rounded-full",
+            style: {
+              textShadow: "black 1px 1px 1px"
+            },
+            children: "X"
+          }
+        )
+      ]
+    },
+    tag.id
+  ) });
+}
+function TagSelector({ initialTagIDs, allTags, onTagChange }) {
+  const [tagList, updateTagList] = useState(initialTagIDs);
+  const [inputValue, setInputValue] = useState("");
+  const toggleTag = (id) => tagList.find((t) => t === id) ? removeTag(id) : addTag(id);
+  const addTag = (id) => {
+    const newList = [...tagList, id];
+    updateTagList(newList);
+    onTagChange(newList);
+  };
+  const removeTag = (id) => {
+    const newList = tagList.filter((t) => t !== id);
+    updateTagList(newList);
+    onTagChange(newList);
+  };
+  const selectedTags = useMemo(() => allTags.filter((tag) => tagList.includes(tag.id)), [allTags, tagList]);
+  const options = useMemo(
+    () => allTags.map((tag) => ({ value: tag.id, label: tag.label })),
+    [allTags]
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: selectedTags.map((tag) => /* @__PURE__ */ jsx(
+      Chip,
+      {
+        tag,
+        removeCallback: () => toggleTag(tag.id)
+      },
+      tag.id
+    )) }),
+    /* @__PURE__ */ jsx(Grid, { container: true, spacing: 3, children: /* @__PURE__ */ jsx(Grid, { sx: { marginTop: 3, width: "100%", minWidth: "550px" }, children: /* @__PURE__ */ jsx(
+      Autocomplete,
+      {
+        options,
+        filterOptions: (availableOptions, state) => availableOptions.filter(
+          (option) => !tagList.includes(option.value) && option.label.toLowerCase().includes(state.inputValue.toLowerCase())
+        ),
+        value: null,
+        inputValue,
+        onInputChange: (event, newInputValue) => {
+          if (event && event.type === "change") {
+            setInputValue(newInputValue);
+          }
+        },
+        onChange: (event, newValue) => {
+          if (newValue) {
+            toggleTag(newValue.value);
+          }
+          setInputValue("");
+        },
+        renderInput: (params) => /* @__PURE__ */ jsx(TextField2, { ...params, label: "Select Tags" })
+      },
+      tagList.join("-")
+    ) }) })
+  ] });
+}
+function EditTableDetailsForm({ initialTitle, initialSubtitle, onTitleChange, onSubtitleChange, allowEditingTitles, initialTagIDs, allTags, onTagChange }) {
+  const [title, setTitle] = useState(initialTitle);
+  const [subtitle, setSubtitle] = useState(initialSubtitle);
+  const handleTitleChange = (newTitle) => {
+    setTitle(newTitle);
+    onTitleChange(newTitle);
+  };
+  const handleSubtitleChange = (newSubtitle) => {
+    setSubtitle(newSubtitle);
+    onSubtitleChange(newSubtitle);
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    allowEditingTitles && /* @__PURE__ */ jsxs(Box, { className: "flex flex-col gap-4 mb-8", children: [
+      /* @__PURE__ */ jsxs(Box, { className: "inline-flex", children: [
+        /* @__PURE__ */ jsx(
+          TextField2,
+          {
+            sx: { minWidth: "400px" },
+            label: "Title",
+            onChange: (e) => handleTitleChange(e.target.value),
+            variant: "filled",
+            value: title
+          }
+        ),
+        /* @__PURE__ */ jsx(Tooltip, { title: "Randomize", children: /* @__PURE__ */ jsx(
+          CasinoIcon,
+          {
+            sx: { cursor: "pointer", alignSelf: "center", ml: 1 },
+            onClick: () => handleTitleChange(getRandomTitle())
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ jsxs(Box, { className: "inline-flex min-w-96", children: [
+        /* @__PURE__ */ jsx(
+          TextField2,
+          {
+            sx: { minWidth: "400px" },
+            label: "Short Description or Tagline",
+            onChange: (e) => handleSubtitleChange(e.target.value),
+            variant: "filled",
+            value: subtitle
+          }
+        ),
+        /* @__PURE__ */ jsx(Tooltip, { title: "Randomize", children: /* @__PURE__ */ jsx(
+          CasinoIcon,
+          {
+            sx: { cursor: "pointer", alignSelf: "center", ml: 1 },
+            onClick: () => handleSubtitleChange(getRandomTagline())
+          }
+        ) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(TagSelector, { initialTagIDs, allTags, onTagChange })
+  ] });
+}
+
+export { EditTableDetailsForm, TagSelector };
+//# sourceMappingURL=EditComponents.mjs.map
+//# sourceMappingURL=EditComponents.mjs.map

package/dist/TablePage/EditComponents.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/shared/NameGenerator.ts","../../src/components/shared/Chip.tsx","../../src/components/TablePage/EditComponents/TagSelector.tsx","../../src/components/TablePage/EditComponents/EditTableDetailsForm.tsx"],"names":["jsxs","Fragment","jsx","TextField","useState"],"mappings":"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","file":"EditComponents.mjs","sourcesContent":["\r\nexport const getRandomTitle = () => {\r\n    const randomPrefix = titlePrefixes[Math.random() * titlePrefixes.length | 0];\r\n    const randomMiddle = tileMiddle[Math.random() * tileMiddle.length | 0];\r\n    const randomSuffix = titleSuffixes[Math.random() * titleSuffixes.length | 0];\r\n    return `${randomPrefix} ${randomMiddle} ${randomSuffix}`;\r\n}\r\n\r\nexport const getRandomTagline = () => taglines[Math.random() * taglines.length | 0];\r\n\r\n\r\nconst titlePrefixes = [\r\n    \"The Knights of The\",\r\n    \"The Fellowship of The\",\r\n    \"The Order of The\",\r\n    \"The Infamous\",\r\n    \"The Legendary\",\r\n    \"The Dubious\",\r\n    \"The Sworn Guardians of The\",\r\n    \"The Ancient Guild of The\",\r\n    \"The Unstoppable\",\r\n    \"The Misfit\",\r\n    \"The Chaotic\",\r\n    \"The Brave\",\r\n    \"The Forgotten\",\r\n    \"The Wandering\",\r\n    \"The Noble Council of The\",\r\n    \"The Dread Pirates of The\",\r\n    \"The Honorable Society of The\",\r\n    \"The Cursed\",\r\n    \"The Unlikely Heroes of The\",\r\n    \"The Elders of The\",\r\n    \"The Seekers of The\",\r\n    \"The Champions of The\",\r\n    \"The Heralds of The\",\r\n    \"The Disciples of The\",\r\n    \"The Ragtag Band of The\",\r\n    \"The Cult of The\",\r\n];\r\n\r\nconst tileMiddle = [\r\n    \"Round\",\r\n    \"Kitchen\",\r\n    \"Deepest\",\r\n    \"Sorcery\",\r\n    \"Munchkin\",\r\n    \"Shenanigan\",\r\n    \"Secret\",\r\n    \"Dungeon\",\r\n    \"Fireside\",\r\n    \"Tabletop\",\r\n    \"Midnight\",\r\n    \"Tavern\",\r\n    \"Goblin\",\r\n    \"Dragon\",\r\n    \"Critical\",\r\n    \"Natural Twenty\",\r\n    \"Counterspell\",\r\n    \"Nat One\",\r\n    \"Cardboard\",\r\n    \"Dice Tower\",\r\n    \"Campaign\",\r\n    \"Lore\",\r\n    \"Awkward\",\r\n    \"Unhinged\",\r\n    \"Chaotic Neutral\",\r\n    \"Homebrew\",\r\n    \"Side Quest\",\r\n];\r\n\r\nconst titleSuffixes = [\r\n    \"Table\",\r\n    \"Dungeon\",\r\n    \"Cave\",\r\n    \"Crew\",\r\n    \"Team\",\r\n    \"League\",\r\n    \"Horde\",\r\n    \"Party\",\r\n    \"Conclave\",\r\n    \"Collective\",\r\n    \"Alliance\",\r\n    \"Syndicate\",\r\n    \"Guild\",\r\n    \"Cabal\",\r\n    \"Council\",\r\n    \"Expedition\",\r\n    \"Enclave\",\r\n    \"Consortium\",\r\n    \"Troupe\",\r\n    \"Vanguard\",\r\n    \"Cohort\",\r\n    \"Brotherhood\",\r\n    \"Sisterhood\",\r\n    \"Pantheon\",\r\n    \"Assembly\",\r\n    \"Coven\",\r\n];\r\n\r\nconst taglines = [\r\n    \"Everyone is welcome!\",\r\n    \"Looking for serious players.\",\r\n    \"Get in nerds, we're gaming!\",\r\n    \"If you aren't there, you're square.\",\r\n    \"It will be legendary!\",\r\n    \"Beginners welcome — we were all level 1 once.\",\r\n    \"No experience necessary. Snacks encouraged.\",\r\n    \"Roleplayers, board gamers, and chaos gremlins welcome.\",\r\n    \"We don't metagame. Much.\",\r\n    \"All alignments accepted. True Neutral gets the snacks.\",\r\n    \"Where every session is a one-shot... until it isn't.\",\r\n    \"Homebrew rules may apply.\",\r\n    \"Warning: may contain excessive lore.\",\r\n    \"Critical failures celebrated as much as critical hits.\",\r\n    \"No powergamers. Okay, maybe one powergamer.\",\r\n    \"We finish campaigns. (Eventually.)\",\r\n    \"Veteran players seeking worthy companions.\",\r\n    \"Casuals only — we're here for the vibes.\",\r\n    \"Serious about fun, not about rules.\",\r\n    \"Min-maxers need not apply.\",\r\n    \"For those who read the rulebook... and those who definitely didn't.\",\r\n    \"Roll for initiative. Arrive on time.\",\r\n    \"Side quests are the main quest here.\",\r\n    \"Chaotic good energy required.\",\r\n    \"If you bring snacks, you can name the first NPC.\",\r\n    \"We read the rulebook so you don't have to.\",\r\n    \"Wargamers only — no take-backs, no mercy.\",\r\n    \"Everyone welcome. Meeple provided.\",\r\n    \"We always play the longest game on the shelf.\",\r\n    \"Worker placement. Resource management. Existential dread.\",\r\n    \"No phones at the table! We're here for the game.\",\r\n    \"Someone always flips the table. Metaphorically. Usually.\",\r\n    \"We have a designated rules lawyer. It's fine.\",\r\n    \"Cooperative games only — we can't handle another Monopoly incident.\",\r\n    \"Teaching time is half the fun!\",\r\n];\r\n","import React from \"react\";\r\nimport {Tag} from \"@/types/tag\";\r\n\r\nexport default function Chip({ tag, removeCallback }: { tag: Tag, removeCallback?: (tagId: number) => void }) {\r\n  const color = tag.color ?? \"#bfbcbb\";\r\n  return (\r\n      <>\r\n      <span\r\n          key={tag.id}\r\n          className=\"inline-block text-sm px-3 py-1 rounded-full border-2 font-outlined text-white m-0.5 font-stretch-105% font-sans\"\r\n          style={{\r\n            borderColor: `color-mix(in srgb, ${color}, black 50%)`,\r\n            background: `linear-gradient(160deg, color-mix(in srgb, ${color}, white 10%) 0%, color-mix(in srgb, ${color}, black 60%) 100%)`,\r\n            textShadow: \"black 1.5px 1px 1.5px\",\r\n            filter: `drop-shadow(2px 2px 1.5px color-mix(in srgb, ${color}, black 80%))`\r\n          }}\r\n      >\r\n          {tag.label}\r\n          {removeCallback && (\r\n              <button\r\n                  type=\"button\"\r\n                  onClick={() => removeCallback(tag.id)}\r\n                  className=\"ml-2 text-white hover:text-red-700 focus:outline-none pl-0.5 pr-1 cursor-pointer hover:bg-white rounded-full\"\r\n                  style={{\r\n                    textShadow: \"black 1px 1px 1px\"\r\n                  }}\r\n              >\r\n                X\r\n              </button>\r\n          )}\r\n    </span>\r\n    </>\r\n  )\r\n\r\n}","import React, {useMemo, useState} from \"react\";\r\nimport TextField from \"@mui/material/TextField\";\r\nimport Grid from \"@mui/material/Grid\";\r\nimport Autocomplete from \"@mui/material/Autocomplete\";\r\nimport Chip from \"../../shared/Chip\";\r\nimport {Tag} from \"@/types/tag\";\r\n\r\nexport function TagSelector({initialTagIDs, allTags, onTagChange}: {\r\n  initialTagIDs: number[];\r\n  allTags: Tag[];\r\n  onTagChange: (tagIDs: number[]) => void;\r\n}) {\r\n  const [tagList, updateTagList] = useState(initialTagIDs);\r\n  const [inputValue, setInputValue] = useState(\"\");\r\n\r\n  const toggleTag = (id: number) => tagList.find(t => t === id) ? removeTag(id) : addTag(id);\r\n  const addTag = (id: number) => {\r\n    const newList = [...tagList, id];\r\n    updateTagList(newList);\r\n    onTagChange(newList);\r\n  };\r\n  const removeTag = (id: number) => {\r\n    const newList = tagList.filter(t => t !== id);\r\n    updateTagList(newList);\r\n    onTagChange(newList);\r\n  }\r\n  const selectedTags = useMemo(() => allTags.filter(tag => tagList.includes(tag.id)), [allTags, tagList]);\r\n  const options = useMemo(\r\n      () => allTags.map((tag) => ({ value: tag.id, label: tag.label })),\r\n      [allTags]\r\n  );\r\n\r\n  return (\r\n    <>\r\n      <div className=\"flex flex-wrap gap-2\">\r\n        {selectedTags.map((tag) => (\r\n            <Chip\r\n                key={tag.id}\r\n                tag={tag}\r\n                removeCallback={() => toggleTag(tag.id)}\r\n            />\r\n        ))}\r\n      </div>\r\n      <Grid container spacing={3}>\r\n          <Grid sx={{ marginTop: 3, width: \"100%\", minWidth: \"550px\" }}>\r\n              <Autocomplete\r\n                  key={tagList.join(\"-\")}\r\n                  options={options}\r\n                  filterOptions={(availableOptions, state) =>\r\n                      availableOptions\r\n                          .filter(\r\n                              (option) =>\r\n                                  !tagList.includes(option.value) &&\r\n                                  option.label.toLowerCase().includes(state.inputValue.toLowerCase())\r\n                          )\r\n                  }\r\n                  value={null}\r\n                  inputValue={inputValue}\r\n                  onInputChange={(event, newInputValue) => {\r\n                    if (event && event.type === \"change\") {\r\n                      setInputValue(newInputValue);\r\n                    }\r\n                  }}\r\n                  onChange={(event, newValue) => {\r\n                    if (newValue) {\r\n                      toggleTag(newValue.value);\r\n                    }\r\n                    setInputValue(\"\");\r\n                  }}\r\n                  renderInput={(params) => <TextField {...params} label=\"Select Tags\" />}\r\n              />\r\n          </Grid>\r\n      </Grid>\r\n    </>\r\n  );\r\n}\r\n","import React, {useState} from \"react\";\r\nimport {Box, Tooltip} from \"@mui/material\";\r\nimport TextField from \"@mui/material/TextField\";\r\nimport CasinoIcon from \"@mui/icons-material/Casino\";\r\nimport {getRandomTagline, getRandomTitle} from \"@/components/shared/NameGenerator\";\r\nimport {Tag} from \"@/types/tag\";\r\nimport {TagSelector} from \"./TagSelector\";\r\n\r\nexport function EditTableDetailsForm({initialTitle, initialSubtitle, onTitleChange, onSubtitleChange, allowEditingTitles, initialTagIDs, allTags, onTagChange}: {\r\n  initialTitle: string;\r\n  initialSubtitle: string;\r\n  onTitleChange: (title: string) => void;\r\n  onSubtitleChange: (subtitle: string) => void;\r\n  allowEditingTitles?: boolean;\r\n  onTagChange: (tagIDs: number[]) => void;\r\n  initialTagIDs: number[],\r\n  allTags: Tag[],\r\n}) {\r\n  const [title, setTitle] = useState(initialTitle);\r\n  const [subtitle, setSubtitle] = useState(initialSubtitle);\r\n  const handleTitleChange = (newTitle: string) => {\r\n    setTitle(newTitle);\r\n    onTitleChange(newTitle);\r\n  };\r\n\r\n  const handleSubtitleChange = (newSubtitle: string) => {\r\n    setSubtitle(newSubtitle);\r\n    onSubtitleChange(newSubtitle);\r\n  };\r\n\r\n  return (\r\n    <>\r\n      {(allowEditingTitles && <Box className={\"flex flex-col gap-4 mb-8\"}>\r\n        <Box className={\"inline-flex\"}>\r\n          <TextField\r\n              sx={{minWidth: \"400px\"}}\r\n              label=\"Title\"\r\n              onChange={(e) => handleTitleChange(e.target.value)}\r\n              variant=\"filled\"\r\n              value={title}\r\n          />\r\n          <Tooltip title=\"Randomize\">\r\n            <CasinoIcon sx={{cursor: \"pointer\", alignSelf: \"center\", ml: 1}}\r\n                    onClick={() => handleTitleChange(getRandomTitle())}/>\r\n          </Tooltip>\r\n        </Box>\r\n        <Box className={\"inline-flex min-w-96\"}>\r\n          <TextField\r\n              sx={{minWidth: \"400px\"}}\r\n              label=\"Short Description or Tagline\"\r\n              onChange={(e) => handleSubtitleChange(e.target.value)}\r\n              variant=\"filled\"\r\n              value={subtitle}\r\n          />\r\n          <Tooltip title=\"Randomize\">\r\n            <CasinoIcon sx={{cursor: \"pointer\", alignSelf: \"center\", ml: 1}}\r\n                    onClick={() => handleSubtitleChange(getRandomTagline())}/>\r\n          </Tooltip>\r\n        </Box>\r\n      </Box>)}\r\n\r\n      <TagSelector initialTagIDs={initialTagIDs} allTags={allTags} onTagChange={onTagChange} />\r\n    </>\r\n  );\r\n}"]}

package/dist/TablePage/ModalProvider/index.cjs

@@ -2,76 +2,77 @@
 'use strict';
 
 var react = require('react');
+var Dialog = require('@mui/material/Dialog');
+var DialogContent = require('@mui/material/DialogContent');
+var DialogActions = require('@mui/material/DialogActions');
+var Button = require('@mui/material/Button');
+var IconButton = require('@mui/material/IconButton');
+var CloseIcon = require('@mui/icons-material/Close');
+var material = require('@mui/material');
+var DialogTitle = require('@mui/material/DialogTitle');
 var jsxRuntime = require('react/jsx-runtime');
 
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var Dialog__default = /*#__PURE__*/_interopDefault(Dialog);
+var DialogContent__default = /*#__PURE__*/_interopDefault(DialogContent);
+var DialogActions__default = /*#__PURE__*/_interopDefault(DialogActions);
+var Button__default = /*#__PURE__*/_interopDefault(Button);
+var IconButton__default = /*#__PURE__*/_interopDefault(IconButton);
+var CloseIcon__default = /*#__PURE__*/_interopDefault(CloseIcon);
+var DialogTitle__default = /*#__PURE__*/_interopDefault(DialogTitle);
+
 var ModalContext = react.createContext({
-  showModal: (content) => {
+  showModal: () => {
   },
   hideModal: () => {
   }
 });
 var useModal = () => react.useContext(ModalContext);
-var Modal = ({ onClose, children }) => {
-  const modalRef = react.useRef(null);
-  const previouslyFocusedElement = react.useRef(null);
-  react.useEffect(() => {
-    var _a;
-    if (children) {
-      previouslyFocusedElement.current = document.activeElement;
-      (_a = modalRef.current) == null ? void 0 : _a.focus();
-    }
-    return () => {
-      var _a2;
-      (_a2 = previouslyFocusedElement.current) == null ? void 0 : _a2.focus();
-    };
-  }, [children]);
-  const handleOnClose = () => {
-    onClose();
-  };
-  const handleKeyDown = (e) => {
-    var _a;
-    if (e.key !== "Tab") return;
-    const focusableElements = (_a = modalRef.current) == null ? void 0 : _a.querySelectorAll(
-      'button, [tabindex]:not([tabindex="-1"])'
-    );
-    if (!focusableElements || focusableElements.length === 0) return;
-    const first = focusableElements[0];
-    const last = focusableElements[focusableElements.length - 1];
-    if (e.shiftKey) {
-      if (document.activeElement === first) {
-        e.preventDefault();
-        last.focus();
-      }
-    } else {
-      if (document.activeElement === last) {
-        e.preventDefault();
-        first.focus();
-      }
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: "modal-overlay",
-      onKeyDown: handleKeyDown,
-      ref: modalRef,
-      role: "dialog",
-      tabIndex: -1,
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "modal-container", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "modal-control-strip", children: /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: handleOnClose, children: "X" }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "modal-content", children })
-      ] })
-    }
-  );
-};
-var Modal_default = Modal;
 var ModalProvider = ({ children }) => {
+  var _a;
   const [modalContent, setModalContent] = react.useState(null);
-  const showModal = (content) => setModalContent(content);
-  const hideModal = () => setModalContent(null);
+  const [displayModal, setDisplayModal] = react.useState(false);
+  const [title, setTitle] = react.useState("");
+  const [options, setOptions] = react.useState({});
+  const showModal = (content, title2, opts) => {
+    setModalContent(content);
+    setTitle(title2);
+    setOptions(opts != null ? opts : {});
+    setDisplayModal(true);
+  };
+  const hideModal = () => {
+    setDisplayModal(false);
+  };
   return /* @__PURE__ */ jsxRuntime.jsxs(ModalContext.Provider, { value: { showModal, hideModal }, children: [
     children,
-    modalContent && /* @__PURE__ */ jsxRuntime.jsx(Modal_default, { onClose: hideModal, children: modalContent })
+    /* @__PURE__ */ jsxRuntime.jsxs(Dialog__default.default, { open: displayModal, onClose: hideModal, sx: { height: "85%" }, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(DialogTitle__default.default, { sx: { marginRight: "20px", minWidth: "400px" }, children: title }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          IconButton__default.default,
+          {
+            "aria-label": "close",
+            onClick: hideModal,
+            sx: { position: "absolute", right: 8, top: 8 },
+            children: /* @__PURE__ */ jsxRuntime.jsx(CloseIcon__default.default, {})
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(DialogContent__default.default, { sx: { paddingTop: 0 }, children: modalContent }),
+      (options.acceptText || options.onAccept) && /* @__PURE__ */ jsxRuntime.jsxs(DialogActions__default.default, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Button__default.default, { variant: "contained", onClick: () => {
+          var _a2;
+          hideModal();
+          (_a2 = options.onAccept) == null ? void 0 : _a2.call(options);
+        }, children: (_a = options.acceptText) != null ? _a : "OK" }),
+        /* @__PURE__ */ jsxRuntime.jsx(Button__default.default, { onClick: () => {
+          var _a2;
+          hideModal();
+          (_a2 = options.onCancel) == null ? void 0 : _a2.call(options);
+        }, children: "Cancel" })
+      ] })
+    ] })
   ] });
 };
 var ModalProvider_default = ModalProvider;

package/dist/TablePage/ModalProvider/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/TablePage/ModalProvider/ModalContext.ts","../../../src/components/shared/Modal/index.tsx","../../../src/components/TablePage/ModalProvider/ModalProvider.tsx"],"names":["createContext","useContext","useRef","useEffect","_a","jsx","jsxs","useState"],"mappings":"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","file":"index.cjs","sourcesContent":["\"use client\"\r\nimport { createContext, ReactNode, useContext } from \"react\";\r\n\r\ntype ModalContextType = {\r\n  showModal: (content: ReactNode) => void;\r\n  hideModal: () => void;\r\n}\r\n\r\nexport const ModalContext = createContext<ModalContextType>({\r\n  showModal: (content: ReactNode) => {},\r\n  hideModal: () => {},\r\n});\r\n\r\nexport const useModal = () => useContext(ModalContext);","\"use client\"\r\nimport React, { useEffect, useRef } from \"react\";\r\nimport \"./style.css\";\r\n\r\ninterface IModalProps {\r\n  onClose: () => void;\r\n  children: React.ReactNode;\r\n}\r\n\r\nconst Modal: React.FC<IModalProps> = ({ onClose, children }) => {\r\n  const modalRef = useRef<HTMLDivElement>(null);\r\n  const previouslyFocusedElement = useRef<HTMLElement | null>(null);\r\n\r\n  useEffect(() => {\r\n    if (children) {\r\n      previouslyFocusedElement.current = document.activeElement as HTMLElement;\r\n      modalRef.current?.focus();\r\n    }\r\n    return () => {\r\n      previouslyFocusedElement.current?.focus();\r\n    }\r\n  }, [children]);\r\n\r\n  const handleOnClose = () => {\r\n    onClose();\r\n  };\r\n\r\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\r\n    if (e.key !== 'Tab') return;\r\n\r\n    const focusableElements = modalRef.current?.querySelectorAll<HTMLElement>(\r\n      'button, [tabindex]:not([tabindex=\"-1\"])'\r\n    );\r\n\r\n    if (!focusableElements || focusableElements.length === 0) return;\r\n\r\n    const first = focusableElements[0];\r\n    const last = focusableElements[focusableElements.length - 1];\r\n\r\n    if (e.shiftKey) {\r\n      // shift + tab\r\n      if (document.activeElement === first) {\r\n        e.preventDefault();\r\n        last.focus();\r\n      }\r\n    } else {\r\n      // tab\r\n      if (document.activeElement === last) {\r\n        e.preventDefault();\r\n        first.focus();\r\n      }\r\n    }\r\n  };\r\n\r\n  return (\r\n    <div\r\n      className=\"modal-overlay\"\r\n      onKeyDown={handleKeyDown}\r\n      ref={modalRef}\r\n      role=\"dialog\"\r\n      tabIndex={-1}\r\n    >\r\n      <div className=\"modal-container\">\r\n        <div className=\"modal-control-strip\">\r\n          <button onClick={handleOnClose}>X</button>\r\n        </div>\r\n        <div className=\"modal-content\">\r\n          {children}\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default Modal;\r\n","\"use client\";\n\nimport React, { ReactNode, useState } from \"react\";\r\nimport { ModalContext } from './ModalContext';\r\nimport Modal from \"@/components/shared/Modal\";\r\n\r\ntype ModalProviderProps = {\r\n  children: ReactNode;\r\n}\r\n\r\nexport const ModalProvider = ({ children }: ModalProviderProps) => {\r\n  const [modalContent, setModalContent] = useState<null | ReactNode>(null);\r\n\r\n  const showModal = (content: ReactNode) => setModalContent(content);\r\n  const hideModal = () => setModalContent(null);\r\n\r\n  return (\r\n    <ModalContext.Provider value={{ showModal, hideModal }}>\r\n      {children}\r\n      {modalContent && (\r\n        <Modal onClose={hideModal}>\r\n          {modalContent}\r\n        </Modal>\r\n      )}\r\n    </ModalContext.Provider>\r\n  );\r\n}\r\n\r\nexport default ModalProvider;"]}
+{"version":3,"sources":["../../../src/components/TablePage/ModalProvider/ModalContext.ts","../../../src/components/TablePage/ModalProvider/ModalProvider.tsx"],"names":["createContext","useContext","useState","title","jsxs","Dialog","Box","jsx","DialogTitle","IconButton","CloseIcon","DialogContent","DialogActions","Button","_a"],"mappings":"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","file":"index.cjs","sourcesContent":["\"use client\"\r\nimport { createContext, ReactNode, useContext } from \"react\";\r\n\r\nexport type ModalOptions = {\r\n  acceptText?: string;\r\n  onAccept?: () => void;\r\n  onCancel?: () => void;\r\n}\r\n\r\ntype ModalContextType = {\r\n  showModal: (content: ReactNode, title: string, options?: ModalOptions) => void;\r\n  hideModal: () => void;\r\n}\r\n\r\nexport const ModalContext = createContext<ModalContextType>({\r\n  showModal: () => {},\r\n  hideModal: () => {},\r\n});\r\n\r\nexport const useModal = () => useContext(ModalContext);","\"use client\";\r\n\r\nimport React, { ReactNode, useState } from \"react\";\r\nimport Dialog from \"@mui/material/Dialog\";\r\nimport DialogContent from \"@mui/material/DialogContent\";\r\nimport DialogActions from \"@mui/material/DialogActions\";\r\nimport Button from \"@mui/material/Button\";\r\nimport IconButton from \"@mui/material/IconButton\";\r\nimport CloseIcon from \"@mui/icons-material/Close\";\r\nimport { ModalContext, ModalOptions } from '@/components';\r\nimport {Box} from \"@mui/material\";\r\nimport DialogTitle from \"@mui/material/DialogTitle\";\r\n\r\ntype ModalProviderProps = {\r\n  children: ReactNode;\r\n}\r\n\r\nexport const ModalProvider = ({ children }: ModalProviderProps) => {\r\n  const [modalContent, setModalContent] = useState<null | ReactNode>(null);\r\n  const [displayModal, setDisplayModal] = useState(false);\r\n  const [title, setTitle] = useState(\"\");\r\n  const [options, setOptions] = useState<ModalOptions>({});\r\n\r\n  const showModal = (content: ReactNode, title: string, opts?: ModalOptions) => {\r\n    setModalContent(content);\r\n    setTitle(title);\r\n    setOptions(opts ?? {});\r\n    setDisplayModal(true);\r\n  }\r\n  const hideModal = () => {\r\n    setDisplayModal(false);\r\n  };\r\n\r\n  return (\r\n    <ModalContext.Provider value={{ showModal, hideModal }}>\r\n      {children}\r\n      <Dialog open={displayModal} onClose={hideModal} sx={{height: \"85%\"}}>\r\n        <Box>\r\n          <DialogTitle sx={{marginRight: '20px', minWidth: '400px'}}>{title}</DialogTitle>\r\n          <IconButton\r\n            aria-label=\"close\"\r\n            onClick={hideModal}\r\n            sx={{ position: 'absolute', right: 8, top: 8 }}\r\n          >\r\n            <CloseIcon />\r\n          </IconButton>\r\n        </Box>\r\n        <DialogContent sx={{paddingTop: 0}}>\r\n          {modalContent}\r\n        </DialogContent>\r\n        {(options.acceptText || options.onAccept) && (\r\n          <DialogActions>\r\n            <Button variant=\"contained\" onClick={() => { hideModal(); options.onAccept?.(); }}>\r\n              {options.acceptText ?? \"OK\"}\r\n            </Button>\r\n            <Button onClick={() => { hideModal(); options.onCancel?.(); }}>Cancel</Button>\r\n          </DialogActions>\r\n        )}\r\n      </Dialog>\r\n    </ModalContext.Provider>\r\n  );\r\n}\r\n\r\nexport default ModalProvider;"]}

package/dist/TablePage/ModalProvider/index.d.cts

@@ -1,3 +1,3 @@
-export { ModalContext, ModalProvider, useModal } from '../ModalProvider';
+export { ModalContext, ModalOptions, ModalProvider, useModal } from '../ModalProvider';
 import 'react';
 import 'react/jsx-runtime';

package/dist/TablePage/ModalProvider/index.d.ts

@@ -1,3 +1,3 @@
-export { ModalContext, ModalProvider, useModal } from '../ModalProvider';
+export { ModalContext, ModalOptions, ModalProvider, useModal } from '../ModalProvider';
 import 'react';
 import 'react/jsx-runtime';

package/dist/TablePage/ModalProvider/index.mjs

@@ -1,75 +1,66 @@
 "use client";
-import { createContext, useContext, useState, useRef, useEffect } from 'react';
+import { createContext, useContext, useState } from 'react';
+import Dialog from '@mui/material/Dialog';
+import DialogContent from '@mui/material/DialogContent';
+import DialogActions from '@mui/material/DialogActions';
+import Button from '@mui/material/Button';
+import IconButton from '@mui/material/IconButton';
+import CloseIcon from '@mui/icons-material/Close';
+import { Box } from '@mui/material';
+import DialogTitle from '@mui/material/DialogTitle';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 var ModalContext = createContext({
-  showModal: (content) => {
+  showModal: () => {
   },
   hideModal: () => {
   }
 });
 var useModal = () => useContext(ModalContext);
-var Modal = ({ onClose, children }) => {
-  const modalRef = useRef(null);
-  const previouslyFocusedElement = useRef(null);
-  useEffect(() => {
-    var _a;
-    if (children) {
-      previouslyFocusedElement.current = document.activeElement;
-      (_a = modalRef.current) == null ? void 0 : _a.focus();
-    }
-    return () => {
-      var _a2;
-      (_a2 = previouslyFocusedElement.current) == null ? void 0 : _a2.focus();
-    };
-  }, [children]);
-  const handleOnClose = () => {
-    onClose();
-  };
-  const handleKeyDown = (e) => {
-    var _a;
-    if (e.key !== "Tab") return;
-    const focusableElements = (_a = modalRef.current) == null ? void 0 : _a.querySelectorAll(
-      'button, [tabindex]:not([tabindex="-1"])'
-    );
-    if (!focusableElements || focusableElements.length === 0) return;
-    const first = focusableElements[0];
-    const last = focusableElements[focusableElements.length - 1];
-    if (e.shiftKey) {
-      if (document.activeElement === first) {
-        e.preventDefault();
-        last.focus();
-      }
-    } else {
-      if (document.activeElement === last) {
-        e.preventDefault();
-        first.focus();
-      }
-    }
-  };
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      className: "modal-overlay",
-      onKeyDown: handleKeyDown,
-      ref: modalRef,
-      role: "dialog",
-      tabIndex: -1,
-      children: /* @__PURE__ */ jsxs("div", { className: "modal-container", children: [
-        /* @__PURE__ */ jsx("div", { className: "modal-control-strip", children: /* @__PURE__ */ jsx("button", { onClick: handleOnClose, children: "X" }) }),
-        /* @__PURE__ */ jsx("div", { className: "modal-content", children })
-      ] })
-    }
-  );
-};
-var Modal_default = Modal;
 var ModalProvider = ({ children }) => {
+  var _a;
   const [modalContent, setModalContent] = useState(null);
-  const showModal = (content) => setModalContent(content);
-  const hideModal = () => setModalContent(null);
+  const [displayModal, setDisplayModal] = useState(false);
+  const [title, setTitle] = useState("");
+  const [options, setOptions] = useState({});
+  const showModal = (content, title2, opts) => {
+    setModalContent(content);
+    setTitle(title2);
+    setOptions(opts != null ? opts : {});
+    setDisplayModal(true);
+  };
+  const hideModal = () => {
+    setDisplayModal(false);
+  };
   return /* @__PURE__ */ jsxs(ModalContext.Provider, { value: { showModal, hideModal }, children: [
     children,
-    modalContent && /* @__PURE__ */ jsx(Modal_default, { onClose: hideModal, children: modalContent })
+    /* @__PURE__ */ jsxs(Dialog, { open: displayModal, onClose: hideModal, sx: { height: "85%" }, children: [
+      /* @__PURE__ */ jsxs(Box, { children: [
+        /* @__PURE__ */ jsx(DialogTitle, { sx: { marginRight: "20px", minWidth: "400px" }, children: title }),
+        /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            "aria-label": "close",
+            onClick: hideModal,
+            sx: { position: "absolute", right: 8, top: 8 },
+            children: /* @__PURE__ */ jsx(CloseIcon, {})
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(DialogContent, { sx: { paddingTop: 0 }, children: modalContent }),
+      (options.acceptText || options.onAccept) && /* @__PURE__ */ jsxs(DialogActions, { children: [
+        /* @__PURE__ */ jsx(Button, { variant: "contained", onClick: () => {
+          var _a2;
+          hideModal();
+          (_a2 = options.onAccept) == null ? void 0 : _a2.call(options);
+        }, children: (_a = options.acceptText) != null ? _a : "OK" }),
+        /* @__PURE__ */ jsx(Button, { onClick: () => {
+          var _a2;
+          hideModal();
+          (_a2 = options.onCancel) == null ? void 0 : _a2.call(options);
+        }, children: "Cancel" })
+      ] })
+    ] })
   ] });
 };
 var ModalProvider_default = ModalProvider;