dirk-cfx-react 1.1.65 → 1.1.67

package/dist/components/index.d.cts

@@ -853,6 +853,44 @@ type PositionPickerProps = {
 };
 declare function PositionPicker(props: PositionPickerProps): react_jsx_runtime.JSX.Element;
 
+type GroupValue = {
+    name?: string;
+    grade?: number;
+};
+type GroupType = "job" | "gang";
+type GroupSelectProps = {
+    value: GroupValue;
+    onChange: (next: GroupValue) => void;
+    type?: GroupType;
+    children: React__default.ReactNode;
+    style?: React__default.CSSProperties;
+};
+declare function GroupSelect({ value, onChange, type, children, style, }: GroupSelectProps): react_jsx_runtime.JSX.Element;
+declare namespace GroupSelect {
+    var Name: typeof GroupName;
+    var Rank: typeof GroupRank;
+}
+type GroupNameProps = {
+    value?: string;
+    onChange?: (name: string) => void;
+    type?: GroupType;
+    label?: string;
+    description?: string;
+    placeholder?: string;
+    size?: string;
+    disabled?: boolean;
+    style?: React__default.CSSProperties;
+};
+declare function GroupName(props: GroupNameProps): react_jsx_runtime.JSX.Element;
+type GroupRankProps = {
+    label?: string;
+    description?: string;
+    placeholder?: string;
+    size?: string;
+    style?: React__default.CSSProperties;
+};
+declare function GroupRank(props: GroupRankProps): react_jsx_runtime.JSX.Element;
+
 type FiveMControls = {
     _type: string;
     _key: string;
@@ -907,4 +945,4 @@ interface TestBedProps {
 }
 declare function TestBed({ items, storageKey, disablePersistence, title, }: TestBedProps): react_jsx_runtime.JSX.Element | null;
 
-export { AdminPageTitle, type AdminPageTitleProps, AsyncSaveButton, BlipColorSelect, type BlipColorSelectProps, BlipDisplaySelect, type BlipDisplaySelectProps, BlipIconSelect, type BlipIconSelectProps, BorderedIcon, type BorderedIconProps, type ButtonProps, ConfigPanel, type ConfigPanelProps, ConfirmModal, type ConfirmModalProps, Counter, type FiveMControls, FiveMKeyBindInput, FloatingParticles, type FloatingParticlesProps, InfoBox, type InfoBoxProps, InputContainer, type InputContainerProps, LevelBanner, LevelPanel, Modal, ModalContext, type ModalProps, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, type NavItem, NavigationContext, NavigationProvider, type NavigationStore, type ParticleState, PositionPicker, type PositionPickerProps, type ProgressProps, type Prompt, type PromptButton, PromptModal, type SegmentProps, SegmentedControl, type SegmentedControlProps, SegmentedProgress, SelectItem, type SelectItemProps, type StoreModalProps, TestBed, type TestBedItem, type TestBedProps, Title, type TitleProps, type Vector4Value, useModal, useModalActions, useNavigation, useNavigationStore };
+export { AdminPageTitle, type AdminPageTitleProps, AsyncSaveButton, BlipColorSelect, type BlipColorSelectProps, BlipDisplaySelect, type BlipDisplaySelectProps, BlipIconSelect, type BlipIconSelectProps, BorderedIcon, type BorderedIconProps, type ButtonProps, ConfigPanel, type ConfigPanelProps, ConfirmModal, type ConfirmModalProps, Counter, type FiveMControls, FiveMKeyBindInput, FloatingParticles, type FloatingParticlesProps, GroupName, type GroupNameProps, GroupRank, type GroupRankProps, GroupSelect, type GroupSelectProps, type GroupType, type GroupValue, InfoBox, type InfoBoxProps, InputContainer, type InputContainerProps, LevelBanner, LevelPanel, Modal, ModalContext, type ModalProps, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, type NavItem, NavigationContext, NavigationProvider, type NavigationStore, type ParticleState, PositionPicker, type PositionPickerProps, type ProgressProps, type Prompt, type PromptButton, PromptModal, type SegmentProps, SegmentedControl, type SegmentedControlProps, SegmentedProgress, SelectItem, type SelectItemProps, type StoreModalProps, TestBed, type TestBedItem, type TestBedProps, Title, type TitleProps, type Vector4Value, useModal, useModalActions, useNavigation, useNavigationStore };

package/dist/components/index.d.ts

@@ -853,6 +853,44 @@ type PositionPickerProps = {
 };
 declare function PositionPicker(props: PositionPickerProps): react_jsx_runtime.JSX.Element;
 
+type GroupValue = {
+    name?: string;
+    grade?: number;
+};
+type GroupType = "job" | "gang";
+type GroupSelectProps = {
+    value: GroupValue;
+    onChange: (next: GroupValue) => void;
+    type?: GroupType;
+    children: React__default.ReactNode;
+    style?: React__default.CSSProperties;
+};
+declare function GroupSelect({ value, onChange, type, children, style, }: GroupSelectProps): react_jsx_runtime.JSX.Element;
+declare namespace GroupSelect {
+    var Name: typeof GroupName;
+    var Rank: typeof GroupRank;
+}
+type GroupNameProps = {
+    value?: string;
+    onChange?: (name: string) => void;
+    type?: GroupType;
+    label?: string;
+    description?: string;
+    placeholder?: string;
+    size?: string;
+    disabled?: boolean;
+    style?: React__default.CSSProperties;
+};
+declare function GroupName(props: GroupNameProps): react_jsx_runtime.JSX.Element;
+type GroupRankProps = {
+    label?: string;
+    description?: string;
+    placeholder?: string;
+    size?: string;
+    style?: React__default.CSSProperties;
+};
+declare function GroupRank(props: GroupRankProps): react_jsx_runtime.JSX.Element;
+
 type FiveMControls = {
     _type: string;
     _key: string;
@@ -907,4 +945,4 @@ interface TestBedProps {
 }
 declare function TestBed({ items, storageKey, disablePersistence, title, }: TestBedProps): react_jsx_runtime.JSX.Element | null;
 
-export { AdminPageTitle, type AdminPageTitleProps, AsyncSaveButton, BlipColorSelect, type BlipColorSelectProps, BlipDisplaySelect, type BlipDisplaySelectProps, BlipIconSelect, type BlipIconSelectProps, BorderedIcon, type BorderedIconProps, type ButtonProps, ConfigPanel, type ConfigPanelProps, ConfirmModal, type ConfirmModalProps, Counter, type FiveMControls, FiveMKeyBindInput, FloatingParticles, type FloatingParticlesProps, InfoBox, type InfoBoxProps, InputContainer, type InputContainerProps, LevelBanner, LevelPanel, Modal, ModalContext, type ModalProps, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, type NavItem, NavigationContext, NavigationProvider, type NavigationStore, type ParticleState, PositionPicker, type PositionPickerProps, type ProgressProps, type Prompt, type PromptButton, PromptModal, type SegmentProps, SegmentedControl, type SegmentedControlProps, SegmentedProgress, SelectItem, type SelectItemProps, type StoreModalProps, TestBed, type TestBedItem, type TestBedProps, Title, type TitleProps, type Vector4Value, useModal, useModalActions, useNavigation, useNavigationStore };
+export { AdminPageTitle, type AdminPageTitleProps, AsyncSaveButton, BlipColorSelect, type BlipColorSelectProps, BlipDisplaySelect, type BlipDisplaySelectProps, BlipIconSelect, type BlipIconSelectProps, BorderedIcon, type BorderedIconProps, type ButtonProps, ConfigPanel, type ConfigPanelProps, ConfirmModal, type ConfirmModalProps, Counter, type FiveMControls, FiveMKeyBindInput, FloatingParticles, type FloatingParticlesProps, GroupName, type GroupNameProps, GroupRank, type GroupRankProps, GroupSelect, type GroupSelectProps, type GroupType, type GroupValue, InfoBox, type InfoBoxProps, InputContainer, type InputContainerProps, LevelBanner, LevelPanel, Modal, ModalContext, type ModalProps, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, type NavItem, NavigationContext, NavigationProvider, type NavigationStore, type ParticleState, PositionPicker, type PositionPickerProps, type ProgressProps, type Prompt, type PromptButton, PromptModal, type SegmentProps, SegmentedControl, type SegmentedControlProps, SegmentedProgress, SelectItem, type SelectItemProps, type StoreModalProps, TestBed, type TestBedItem, type TestBedProps, Title, type TitleProps, type Vector4Value, useModal, useModalActions, useNavigation, useNavigationStore };

package/dist/components/index.js

@@ -1353,6 +1353,20 @@ registerInitialFetch("FETCH_ALL_ITEMS", null, {
   useItems.setState(fetchedItems);
 }).catch(() => {
 });
+var useFrameworkGroups = create(() => ({
+  jobs: [],
+  gangs: [],
+  loaded: false
+}));
+registerInitialFetch("GET_FRAMEWORK_GROUPS", void 0).then((data) => {
+  useFrameworkGroups.setState({
+    jobs: Array.isArray(data?.jobs) ? data.jobs : [],
+    gangs: Array.isArray(data?.gangs) ? data.gangs : [],
+    loaded: true
+  });
+}).catch(() => {
+  useFrameworkGroups.setState({ loaded: true });
+});
 
 // src/utils/inputMapper.ts
 var INPUT_MAPPER_PRIMARY_OPTIONS = [
@@ -4011,6 +4025,7 @@ function SelectItem(props) {
       data: formattedItems,
       allowDeselect: false,
       searchable: true,
+      comboboxProps: { withinPortal: true, zIndex: 2e3 },
       leftSectionWidth: "4vh",
       leftSection: props.value ? /* @__PURE__ */ jsx(
         Image,
@@ -4254,6 +4269,94 @@ function PickerButton({
     }
   ) });
 }
+var GroupSelectContext = createContext(null);
+function GroupSelect({
+  value,
+  onChange,
+  type,
+  children,
+  style
+}) {
+  return /* @__PURE__ */ jsx(GroupSelectContext.Provider, { value: { value, onChange, type }, children: /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "0.4vh", ...style }, children }) });
+}
+function filterByType(jobs, gangs, type) {
+  if (type === "job") return jobs;
+  if (type === "gang") return gangs;
+  return [...jobs, ...gangs];
+}
+function GroupName(props) {
+  const ctx = useContext(GroupSelectContext);
+  const jobs = useFrameworkGroups((s) => s.jobs);
+  const gangs = useFrameworkGroups((s) => s.gangs);
+  const inCompound = ctx !== null;
+  const currentValue = inCompound ? ctx.value.name : props.value;
+  const filterType = inCompound ? ctx.type : props.type;
+  const list = filterByType(jobs, gangs, filterType);
+  const data = filterType === void 0 ? [
+    { group: locale("Jobs") || "Jobs", items: jobs.map((g) => ({ value: g.name, label: g.label })) },
+    { group: locale("Gangs") || "Gangs", items: gangs.map((g) => ({ value: g.name, label: g.label })) }
+  ] : list.map((g) => ({ value: g.name, label: g.label }));
+  return /* @__PURE__ */ jsx(
+    Select,
+    {
+      label: props.label,
+      description: props.description,
+      placeholder: props.placeholder ?? (locale("SelectGroup") || "Select\u2026"),
+      size: props.size ?? "xs",
+      disabled: props.disabled,
+      style: props.style,
+      data,
+      value: currentValue ?? null,
+      searchable: true,
+      onChange: (v) => {
+        const name = v ?? "";
+        if (inCompound) {
+          ctx.onChange({ name: name || void 0, grade: void 0 });
+        } else if (props.onChange) {
+          props.onChange(name);
+        }
+      },
+      allowDeselect: false
+    }
+  );
+}
+function GroupRank(props) {
+  const ctx = useContext(GroupSelectContext);
+  if (ctx === null) {
+    throw new Error("<GroupRank> must be a child of <GroupSelect>");
+  }
+  const jobs = useFrameworkGroups((s) => s.jobs);
+  const gangs = useFrameworkGroups((s) => s.gangs);
+  const all = [...jobs, ...gangs];
+  const selectedGroup = all.find((g) => g.name === ctx.value.name) ?? null;
+  const grades = selectedGroup?.grades ?? [];
+  const data = grades.map((g) => ({
+    value: String(g.grade),
+    label: `${g.grade} \u2014 ${g.label || g.name}${g.isBoss ? " (boss)" : ""}`
+  }));
+  return /* @__PURE__ */ jsx(
+    Select,
+    {
+      label: props.label,
+      description: props.description,
+      placeholder: props.placeholder ?? (locale("SelectGrade") || "Select grade\u2026"),
+      size: props.size ?? "xs",
+      style: props.style,
+      data,
+      value: ctx.value.grade != null ? String(ctx.value.grade) : null,
+      onChange: (v) => {
+        ctx.onChange({
+          ...ctx.value,
+          grade: v != null ? Number(v) : void 0
+        });
+      },
+      disabled: !selectedGroup || grades.length === 0,
+      allowDeselect: false
+    }
+  );
+}
+GroupSelect.Name = GroupName;
+GroupSelect.Rank = GroupRank;
 var KeyBindContext = createContext(null);
 function useKeyBindContext() {
   const ctx = useContext(KeyBindContext);
@@ -4537,6 +4640,6 @@ function TestBed({
   );
 }
 
-export { AdminPageTitle, AsyncSaveButton, BlipColorSelect, BlipDisplaySelect, BlipIconSelect, BorderedIcon, ConfigPanel, ConfirmModal, Counter, FiveMKeyBindInput, FloatingParticles, InfoBox, InputContainer, LevelBanner, LevelPanel, Modal, ModalContext, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, NavigationContext, NavigationProvider, PositionPicker, PromptModal, SegmentedControl, SegmentedProgress, SelectItem, TestBed, Title, useModal, useModalActions, useNavigation, useNavigationStore };
+export { AdminPageTitle, AsyncSaveButton, BlipColorSelect, BlipDisplaySelect, BlipIconSelect, BorderedIcon, ConfigPanel, ConfirmModal, Counter, FiveMKeyBindInput, FloatingParticles, GroupName, GroupRank, GroupSelect, InfoBox, InputContainer, LevelBanner, LevelPanel, Modal, ModalContext, ModalProvider, MotionFlex, MotionIcon, MotionImage, MotionText, NavBar, NavigationContext, NavigationProvider, PositionPicker, PromptModal, SegmentedControl, SegmentedProgress, SelectItem, TestBed, Title, useModal, useModalActions, useNavigation, useNavigationStore };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map