@apia/dashboard-controller 2.0.9 → 2.0.10

package/dist/panelsStore/usePanelSelector.js

@@ -0,0 +1,32 @@
+import { shallowEqual } from '@apia/store';
+import { useState, useRef } from 'react';
+import { panelsStore, usePanelStoreSelector } from './panelsStore.js';
+import { usePanelIdentity } from '../common/usePanelIdentity.js';
+
+const undefinedObject = {};
+function usePanelSelector(panelType, panelName, initialState, selector, comparator = shallowEqual) {
+  const { panelId } = usePanelIdentity();
+  if (!panelId)
+    throw new Error(`Cannot find panel with name ${panelName}`);
+  const storeState = panelsStore.getState().panelsSlice[panelType];
+  const [selection, setSelection] = useState(
+    initialState ? selector(storeState?.[panelId] ?? initialState) : {}
+  );
+  const previousSelected = useRef(
+    selection ?? undefinedObject
+  );
+  usePanelStoreSelector((global) => {
+    const newState = global.panelsSlice[panelType]?.[panelId];
+    if (newState !== void 0) {
+      const newSelected = selector(newState);
+      if (previousSelected.current === undefinedObject || !comparator(previousSelected.current, newSelected)) {
+        previousSelected.current = newSelected;
+        setSelection(newSelected);
+      }
+    }
+  });
+  return selection;
+}
+
+export { undefinedObject, usePanelSelector };
+//# sourceMappingURL=usePanelSelector.js.map

package/dist/panelsStore/usePanelSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePanelSelector.js","sources":["../../src/panelsStore/usePanelSelector.ts"],"sourcesContent":["import { shallowEqual } from '@apia/store';\r\nimport { useRef, useState } from 'react';\r\nimport { TPanelName, TPanelType } from '../types';\r\nimport { panelsStore, usePanelStoreSelector } from './panelsStore';\r\nimport { usePanelIdentity } from '../common';\r\n\r\nexport const undefinedObject = {};\r\n\r\n/**\r\n * Permite escuchar el store de un panel al igual que se haría con un\r\n * useSelector de redux.\r\n *\r\n * @param selector Una función selectora que recibe el estado del panel y devuelve la selección deseada\r\n * @param comparator Opcionalmente se puede pasar un comparador para determinar si el estado debe actualizarse o no, dependiendo de la selección actual y la selección previa. Por defecto se usa shallowEqual de redux.\r\n * @returns La selección determinada en el selector, siempre que haya cambiado de acuerdo al comparador.\r\n *\r\n * @example\r\n *\r\n  import { TRecordsPanelStore } from '..../recordsPanel';\r\n\r\n  // Assume TRecordsPanelStore = { peopleNames: string[] }\r\n\r\n  const firstName = usePanelSelector<TRecordsPanelStore>(\r\n    'RecordsPanel',\r\n    'RecordThisYear',\r\n    (state) => { return state.peopleNames[0] }\r\n  );\r\n */\r\nexport function usePanelSelector<StoreType, Selected>(\r\n  panelType: TPanelType,\r\n  panelName: TPanelName,\r\n  initialState: StoreType,\r\n  selector: (state: StoreType) => Selected,\r\n  comparator: (a: Selected, b: Selected) => boolean = shallowEqual,\r\n): Selected {\r\n  const { panelId } = usePanelIdentity();\r\n  if (!panelId) throw new Error(`Cannot find panel with name ${panelName}`);\r\n\r\n  const storeState = panelsStore.getState().panelsSlice[panelType];\r\n  const [selection, setSelection] = useState<Selected>(\r\n    initialState\r\n      ? selector((storeState?.[panelId] as StoreType) ?? initialState)\r\n      : ({} as Selected),\r\n  );\r\n\r\n  const previousSelected = useRef<Selected>(\r\n    selection ?? (undefinedObject as Selected),\r\n  );\r\n\r\n  usePanelStoreSelector((global) => {\r\n    const newState = global.panelsSlice[panelType]?.[panelId] as\r\n      | StoreType\r\n      | undefined;\r\n    if (newState !== undefined) {\r\n      const newSelected = selector(newState);\r\n      if (\r\n        previousSelected.current === undefinedObject ||\r\n        !comparator(previousSelected.current as Selected, newSelected)\r\n      ) {\r\n        previousSelected.current = newSelected;\r\n        setSelection(newSelected);\r\n      }\r\n    }\r\n  });\r\n\r\n  return selection;\r\n}\r\n"],"names":[],"mappings":";;;;;AAMO,MAAM,kBAAkB,GAAC;AAsBzB,SAAS,iBACd,SACA,EAAA,SAAA,EACA,YACA,EAAA,QAAA,EACA,aAAoD,YAC1C,EAAA;AACV,EAAM,MAAA,EAAE,OAAQ,EAAA,GAAI,gBAAiB,EAAA,CAAA;AACrC,EAAA,IAAI,CAAC,OAAA;AAAS,IAAA,MAAM,IAAI,KAAA,CAAM,CAA+B,4BAAA,EAAA,SAAS,CAAE,CAAA,CAAA,CAAA;AAExE,EAAA,MAAM,UAAa,GAAA,WAAA,CAAY,QAAS,EAAA,CAAE,YAAY,SAAS,CAAA,CAAA;AAC/D,EAAM,MAAA,CAAC,SAAW,EAAA,YAAY,CAAI,GAAA,QAAA;AAAA,IAChC,eACI,QAAU,CAAA,UAAA,GAAa,OAAO,CAAmB,IAAA,YAAY,IAC5D,EAAC;AAAA,GACR,CAAA;AAEA,EAAA,MAAM,gBAAmB,GAAA,MAAA;AAAA,IACvB,SAAc,IAAA,eAAA;AAAA,GAChB,CAAA;AAEA,EAAA,qBAAA,CAAsB,CAAC,MAAW,KAAA;AAChC,IAAA,MAAM,QAAW,GAAA,MAAA,CAAO,WAAY,CAAA,SAAS,IAAI,OAAO,CAAA,CAAA;AAGxD,IAAA,IAAI,aAAa,KAAW,CAAA,EAAA;AAC1B,MAAM,MAAA,WAAA,GAAc,SAAS,QAAQ,CAAA,CAAA;AACrC,MACE,IAAA,gBAAA,CAAiB,YAAY,eAC7B,IAAA,CAAC,WAAW,gBAAiB,CAAA,OAAA,EAAqB,WAAW,CAC7D,EAAA;AACA,QAAA,gBAAA,CAAiB,OAAU,GAAA,WAAA,CAAA;AAC3B,QAAA,YAAA,CAAa,WAAW,CAAA,CAAA;AAAA,OAC1B;AAAA,KACF;AAAA,GACD,CAAA,CAAA;AAED,EAAO,OAAA,SAAA,CAAA;AACT;;;;"}

package/dist/panelsUtil/usePanelChangeTitle.d.ts

@@ -0,0 +1,5 @@
+declare function changePanelTitle(panelId: string, newTitle: string): void;
+declare function usePanelChangeTitle(): (newTitle: string) => void;
+
+export { changePanelTitle, usePanelChangeTitle };
+//# sourceMappingURL=usePanelChangeTitle.d.ts.map

package/dist/panelsUtil/usePanelChangeTitle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePanelChangeTitle.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/panelsUtil/usePanelChangeTitle.js

@@ -0,0 +1,23 @@
+import { useCallback } from 'react';
+import { eventsController } from '../eventsController/eventsController.js';
+import { usePanelFireEvent } from '../eventsController/usePanelFireEvent.js';
+
+function changePanelTitle(panelId, newTitle) {
+  eventsController.fireEvent(
+    { panelId },
+    "changeTitle",
+    newTitle
+  );
+}
+function usePanelChangeTitle() {
+  const fireEvent = usePanelFireEvent();
+  return useCallback(
+    (newTitle) => {
+      fireEvent("changeTitle", newTitle);
+    },
+    [fireEvent]
+  );
+}
+
+export { changePanelTitle, usePanelChangeTitle };
+//# sourceMappingURL=usePanelChangeTitle.js.map

package/dist/panelsUtil/usePanelChangeTitle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePanelChangeTitle.js","sources":["../../src/panelsUtil/usePanelChangeTitle.ts"],"sourcesContent":["import { useCallback } from 'react';\r\nimport {\r\n  TPanelIdentifier,\r\n  eventsController,\r\n  usePanelFireEvent,\r\n} from '../eventsController';\r\n\r\nexport function changePanelTitle(panelId: string, newTitle: string) {\r\n  eventsController.fireEvent(\r\n    { panelId } as TPanelIdentifier,\r\n    'changeTitle',\r\n    newTitle,\r\n  );\r\n}\r\n\r\nexport function usePanelChangeTitle() {\r\n  const fireEvent = usePanelFireEvent();\r\n\r\n  return useCallback(\r\n    (newTitle: string) => {\r\n      fireEvent('changeTitle', newTitle);\r\n    },\r\n    [fireEvent],\r\n  );\r\n}\r\n"],"names":[],"mappings":";;;;AAOgB,SAAA,gBAAA,CAAiB,SAAiB,QAAkB,EAAA;AAClE,EAAiB,gBAAA,CAAA,SAAA;AAAA,IACf,EAAE,OAAQ,EAAA;AAAA,IACV,aAAA;AAAA,IACA,QAAA;AAAA,GACF,CAAA;AACF,CAAA;AAEO,SAAS,mBAAsB,GAAA;AACpC,EAAA,MAAM,YAAY,iBAAkB,EAAA,CAAA;AAEpC,EAAO,OAAA,WAAA;AAAA,IACL,CAAC,QAAqB,KAAA;AACpB,MAAA,SAAA,CAAU,eAAe,QAAQ,CAAA,CAAA;AAAA,KACnC;AAAA,IACA,CAAC,SAAS,CAAA;AAAA,GACZ,CAAA;AACF;;;;"}

package/dist/panelsUtil/usePanelTitleAction.js

@@ -0,0 +1,34 @@
+import { usePanelParametersSelector } from '../config/usePanelParametersSelector.js';
+import { parametersStore as store, parametersActions } from '../config/parametersStore.js';
+
+const panelActionParameterName = "__panelTitleAction";
+const panelDescriptionParameterName = "__panelTitleDescription";
+function setPanelTitleAction(panelId, newAction) {
+  store.dispatch(
+    parametersActions.udpate({
+      panelId,
+      parameters: { [panelActionParameterName]: newAction }
+    })
+  );
+}
+function setPanelTitleDescritpion(panelId, newDescription) {
+  store.dispatch(
+    parametersActions.udpate({
+      panelId,
+      parameters: { [panelDescriptionParameterName]: newDescription }
+    })
+  );
+}
+function usePanelTitleAction() {
+  return usePanelParametersSelector(
+    (current) => current[panelActionParameterName]
+  );
+}
+function usePanelTitleDescription() {
+  return usePanelParametersSelector(
+    (current) => current[panelDescriptionParameterName]
+  );
+}
+
+export { setPanelTitleAction, setPanelTitleDescritpion, usePanelTitleAction, usePanelTitleDescription };
+//# sourceMappingURL=usePanelTitleAction.js.map

package/dist/panelsUtil/usePanelTitleAction.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePanelTitleAction.js","sources":["../../src/panelsUtil/usePanelTitleAction.ts"],"sourcesContent":["import { parametersStore, usePanelParametersSelector } from '../config';\r\nimport { parametersActions } from '../config/parametersStore';\r\n\r\nconst panelActionParameterName = '__panelTitleAction';\r\nconst panelDescriptionParameterName = '__panelTitleDescription';\r\n\r\nexport function setPanelTitleAction(panelId: string, newAction: string) {\r\n  parametersStore.dispatch(\r\n    parametersActions.udpate({\r\n      panelId,\r\n      parameters: { [panelActionParameterName]: newAction },\r\n    }),\r\n  );\r\n}\r\nexport function setPanelTitleDescritpion(\r\n  panelId: string,\r\n  newDescription: string,\r\n) {\r\n  parametersStore.dispatch(\r\n    parametersActions.udpate({\r\n      panelId,\r\n      parameters: { [panelDescriptionParameterName]: newDescription },\r\n    }),\r\n  );\r\n}\r\n\r\nexport function usePanelTitleAction() {\r\n  return usePanelParametersSelector(\r\n    (current) => current[panelActionParameterName] as string,\r\n  );\r\n}\r\n\r\nexport function usePanelTitleDescription() {\r\n  return usePanelParametersSelector(\r\n    (current) => current[panelDescriptionParameterName] as string,\r\n  );\r\n}\r\n"],"names":["parametersStore"],"mappings":";;;AAGA,MAAM,wBAA2B,GAAA,oBAAA,CAAA;AACjC,MAAM,6BAAgC,GAAA,yBAAA,CAAA;AAEtB,SAAA,mBAAA,CAAoB,SAAiB,SAAmB,EAAA;AACtE,EAAgBA,KAAA,CAAA,QAAA;AAAA,IACd,kBAAkB,MAAO,CAAA;AAAA,MACvB,OAAA;AAAA,MACA,UAAY,EAAA,EAAE,CAAC,wBAAwB,GAAG,SAAU,EAAA;AAAA,KACrD,CAAA;AAAA,GACH,CAAA;AACF,CAAA;AACgB,SAAA,wBAAA,CACd,SACA,cACA,EAAA;AACA,EAAgBA,KAAA,CAAA,QAAA;AAAA,IACd,kBAAkB,MAAO,CAAA;AAAA,MACvB,OAAA;AAAA,MACA,UAAY,EAAA,EAAE,CAAC,6BAA6B,GAAG,cAAe,EAAA;AAAA,KAC/D,CAAA;AAAA,GACH,CAAA;AACF,CAAA;AAEO,SAAS,mBAAsB,GAAA;AACpC,EAAO,OAAA,0BAAA;AAAA,IACL,CAAC,OAAY,KAAA,OAAA,CAAQ,wBAAwB,CAAA;AAAA,GAC/C,CAAA;AACF,CAAA;AAEO,SAAS,wBAA2B,GAAA;AACzC,EAAO,OAAA,0BAAA;AAAA,IACL,CAAC,OAAY,KAAA,OAAA,CAAQ,6BAA6B,CAAA;AAAA,GACpD,CAAA;AACF;;;;"}

package/dist/position/usePanelPosition.d.ts

@@ -0,0 +1,13 @@
+import { TId } from '@apia/util';
+
+/**
+ * Permite conocer la posición del panel, se actualiza automáticamente cuando
+ * ésta cambia provocando un renderizado en el padre
+ */
+declare function usePanelPosition(): {
+    containerId: TId;
+    position: number;
+} | undefined;
+
+export { usePanelPosition };
+//# sourceMappingURL=usePanelPosition.d.ts.map

package/dist/position/usePanelPosition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePanelPosition.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/position/usePanelPosition.js

@@ -0,0 +1,40 @@
+import { ApiaApi, makeApiaUrl } from '@apia/api';
+import { EventEmitter } from '@apia/util';
+import { usePanelIdentity } from '../common/usePanelIdentity.js';
+import { useState, useEffect } from 'react';
+
+class PanelPositionEmitter extends EventEmitter {
+}
+const panelPositionEmitter = new PanelPositionEmitter();
+function usePanelPosition() {
+  const { panelId } = usePanelIdentity();
+  const [position, setPosition] = useState();
+  useEffect(() => {
+    return panelPositionEmitter.on("panelUpdate", (ev) => {
+      if (ev.panelId === panelId)
+        setPosition({ containerId: ev.containerId, position: ev.newPosition });
+    });
+  }, [panelId]);
+  return position;
+}
+async function updatePanelPosition(panelId, containerId, newPosition) {
+  const result = await ApiaApi.post(
+    makeApiaUrl({
+      action: "panelMove",
+      pnlId: panelId,
+      containerId,
+      newPosition
+    })
+  );
+  const hasUpdated = result?.data && !result.hasError && !result.hasMessages;
+  if (hasUpdated)
+    panelPositionEmitter.emit("panelUpdate", {
+      panelId,
+      containerId,
+      newPosition
+    });
+  return hasUpdated;
+}
+
+export { panelPositionEmitter, updatePanelPosition, usePanelPosition };
+//# sourceMappingURL=usePanelPosition.js.map

package/dist/position/usePanelPosition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePanelPosition.js","sources":["../../src/position/usePanelPosition.ts"],"sourcesContent":["import { ApiaApi, makeApiaUrl } from '@apia/api';\r\nimport { EventEmitter, TId } from '@apia/util';\r\nimport { usePanelIdentity } from '../common';\r\nimport { useEffect, useState } from 'react';\r\n\r\nclass PanelPositionEmitter extends EventEmitter<{\r\n  panelUpdate: {\r\n    panelId: TId;\r\n    containerId: TId;\r\n    newPosition: number;\r\n  };\r\n}> {}\r\n\r\nexport const panelPositionEmitter = new PanelPositionEmitter();\r\n\r\n/**\r\n * Permite conocer la posición del panel, se actualiza automáticamente cuando\r\n * ésta cambia provocando un renderizado en el padre\r\n */\r\nexport function usePanelPosition() {\r\n  const { panelId } = usePanelIdentity();\r\n\r\n  const [position, setPosition] = useState<{\r\n    containerId: TId;\r\n    position: number;\r\n  }>();\r\n\r\n  useEffect(() => {\r\n    return panelPositionEmitter.on('panelUpdate', (ev) => {\r\n      if (ev.panelId === panelId)\r\n        setPosition({ containerId: ev.containerId, position: ev.newPosition });\r\n    });\r\n  }, [panelId]);\r\n\r\n  return position;\r\n}\r\n\r\nexport async function updatePanelPosition(\r\n  panelId: TId,\r\n  containerId: TId,\r\n  newPosition: number,\r\n) {\r\n  const result = await ApiaApi.post(\r\n    makeApiaUrl({\r\n      action: 'panelMove',\r\n      pnlId: panelId,\r\n      containerId,\r\n      newPosition,\r\n    }),\r\n  );\r\n\r\n  const hasUpdated = result?.data && !result.hasError && !result.hasMessages;\r\n\r\n  if (hasUpdated)\r\n    panelPositionEmitter.emit('panelUpdate', {\r\n      panelId,\r\n      containerId,\r\n      newPosition,\r\n    });\r\n\r\n  return hasUpdated;\r\n}\r\n\r\nexport function useUpdatePanelPosition() {\r\n  const { panelId } = usePanelIdentity();\r\n  return async function updatePosition(containerId: TId, newPosition: number) {\r\n    return updatePanelPosition(panelId, containerId, newPosition);\r\n  };\r\n}\r\n"],"names":[],"mappings":";;;;;AAKA,MAAM,6BAA6B,YAMhC,CAAA;AAAC,CAAA;AAES,MAAA,oBAAA,GAAuB,IAAI,oBAAqB,GAAA;AAMtD,SAAS,gBAAmB,GAAA;AACjC,EAAM,MAAA,EAAE,OAAQ,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAErC,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,QAG7B,EAAA,CAAA;AAEH,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,OAAO,oBAAqB,CAAA,EAAA,CAAG,aAAe,EAAA,CAAC,EAAO,KAAA;AACpD,MAAA,IAAI,GAAG,OAAY,KAAA,OAAA;AACjB,QAAA,WAAA,CAAY,EAAE,WAAa,EAAA,EAAA,CAAG,aAAa,QAAU,EAAA,EAAA,CAAG,aAAa,CAAA,CAAA;AAAA,KACxE,CAAA,CAAA;AAAA,GACH,EAAG,CAAC,OAAO,CAAC,CAAA,CAAA;AAEZ,EAAO,OAAA,QAAA,CAAA;AACT,CAAA;AAEsB,eAAA,mBAAA,CACpB,OACA,EAAA,WAAA,EACA,WACA,EAAA;AACA,EAAM,MAAA,MAAA,GAAS,MAAM,OAAQ,CAAA,IAAA;AAAA,IAC3B,WAAY,CAAA;AAAA,MACV,MAAQ,EAAA,WAAA;AAAA,MACR,KAAO,EAAA,OAAA;AAAA,MACP,WAAA;AAAA,MACA,WAAA;AAAA,KACD,CAAA;AAAA,GACH,CAAA;AAEA,EAAA,MAAM,aAAa,MAAQ,EAAA,IAAA,IAAQ,CAAC,MAAO,CAAA,QAAA,IAAY,CAAC,MAAO,CAAA,WAAA,CAAA;AAE/D,EAAI,IAAA,UAAA;AACF,IAAA,oBAAA,CAAqB,KAAK,aAAe,EAAA;AAAA,MACvC,OAAA;AAAA,MACA,WAAA;AAAA,MACA,WAAA;AAAA,KACD,CAAA,CAAA;AAEH,EAAO,OAAA,UAAA,CAAA;AACT;;;;"}

package/dist/splash/events/Dragleave.js

@@ -0,0 +1,15 @@
+import { isChild } from '@apia/util';
+
+function dragleave(_ev, DragAndDrop2) {
+  const ev = _ev;
+  if (ev.relatedTarget === null || isChild(ev.relatedTarget, (current) => {
+    return current.parentElement === null && current === document.getRootNode() && current.dataset.splash === void 0;
+  })) {
+    const shadows = document.querySelectorAll(".apia_panel_falseDiv");
+    shadows.forEach((el) => el.remove());
+    DragAndDrop2.draggingPanel?.setAttribute("style", "");
+  }
+}
+
+export { dragleave };
+//# sourceMappingURL=Dragleave.js.map

package/dist/splash/events/Dragleave.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dragleave.js","sources":["../../../src/splash/events/Dragleave.ts"],"sourcesContent":["import { isChild } from '@apia/util';\r\nimport { DragAndDrop } from '../util/DragAndDrop';\r\n\r\nexport function dragleave(_ev: Event, DragAndDrop: DragAndDrop) {\r\n  const ev = _ev as DragEvent;\r\n\r\n  if (\r\n    ev.relatedTarget === null ||\r\n    isChild(ev.relatedTarget as HTMLElement, (current) => {\r\n      return (\r\n        current.parentElement === null &&\r\n        current === document.getRootNode() &&\r\n        current.dataset.splash === undefined\r\n      );\r\n    })\r\n  ) {\r\n    const shadows = document.querySelectorAll('.apia_panel_falseDiv');\r\n\r\n    shadows.forEach((el) => el.remove());\r\n    DragAndDrop.draggingPanel?.setAttribute('style', '');\r\n  }\r\n}\r\n"],"names":["DragAndDrop"],"mappings":";;AAGgB,SAAA,SAAA,CAAU,KAAYA,YAA0B,EAAA;AAC9D,EAAA,MAAM,EAAK,GAAA,GAAA,CAAA;AAEX,EAAA,IACE,GAAG,aAAkB,KAAA,IAAA,IACrB,QAAQ,EAAG,CAAA,aAAA,EAA8B,CAAC,OAAY,KAAA;AACpD,IACE,OAAA,OAAA,CAAQ,kBAAkB,IAC1B,IAAA,OAAA,KAAY,SAAS,WAAY,EAAA,IACjC,OAAQ,CAAA,OAAA,CAAQ,MAAW,KAAA,KAAA,CAAA,CAAA;AAAA,GAE9B,CACD,EAAA;AACA,IAAM,MAAA,OAAA,GAAU,QAAS,CAAA,gBAAA,CAAiB,sBAAsB,CAAA,CAAA;AAEhE,IAAA,OAAA,CAAQ,OAAQ,CAAA,CAAC,EAAO,KAAA,EAAA,CAAG,QAAQ,CAAA,CAAA;AACnC,IAAAA,YAAY,CAAA,aAAA,EAAe,YAAa,CAAA,OAAA,EAAS,EAAE,CAAA,CAAA;AAAA,GACrD;AACF;;;;"}

package/dist/splash/events/Dragover.js

@@ -0,0 +1,120 @@
+import { isCursorInArea } from '../util/isCursorInArea.js';
+import { getColumnAreas } from '../util/getColumnAreas.js';
+
+function dragover(event, DragAndDrop2) {
+  const ev = event;
+  ev.preventDefault();
+  DragAndDrop2.timeout = -1;
+  if ((ev.clientX !== DragAndDrop2.dragoverPosition.x || ev.clientY !== DragAndDrop2.dragoverPosition.y) && DragAndDrop2.draggingPanelId !== "" && DragAndDrop2.shadowDiv) {
+    DragAndDrop2.clearTimeout();
+    DragAndDrop2.currentBottomPanel = DragAndDrop2.findBottomPanel(
+      ev.clientX,
+      ev.clientY + DragAndDrop2.currentScroll
+    );
+    DragAndDrop2.dragoverPosition.x = ev.clientX;
+    DragAndDrop2.dragoverPosition.y = ev.clientY;
+    const snapshotSection = DragAndDrop2.findBottomSection(
+      ev.clientX,
+      ev.clientY + DragAndDrop2.currentScroll
+    );
+    if (DragAndDrop2.shadowDivData && isCursorInArea({
+      cursorX: ev.clientX,
+      cursorY: ev.clientY + DragAndDrop2.currentScroll,
+      bottom: DragAndDrop2.shadowDivData?.panelBottom,
+      top: DragAndDrop2.shadowDivData?.panelTop,
+      left: DragAndDrop2.shadowDivData?.panelLeft,
+      right: DragAndDrop2.shadowDivData?.panelRight
+    })) {
+      return;
+    }
+    if (DragAndDrop2.currentBottomPanel && snapshotSection) {
+      const bottomPanel = DragAndDrop2.splash.querySelector(
+        `[data-panel][data-id='${DragAndDrop2.currentBottomPanel.id}']`
+      );
+      const draggingPanel = DragAndDrop2.splash.querySelector(
+        `[data-panel][data-id='${DragAndDrop2.draggingPanelId}']`
+      );
+      const bottomSection = DragAndDrop2.splash.querySelector(
+        `[data-locationid='${snapshotSection.sectionId}']`
+      );
+      if (bottomSection) {
+        if (isCursorInArea({
+          cursorX: ev.clientX,
+          cursorY: ev.clientY + DragAndDrop2.currentScroll,
+          ...getColumnAreas({
+            ...DragAndDrop2.currentBottomPanel,
+            panelLeft: bottomSection?.getBoundingClientRect().left ?? 0,
+            panelRight: bottomSection?.getBoundingClientRect().right ?? 0
+          }).top
+        })) {
+          if (draggingPanel) {
+            draggingPanel.setAttribute("style", "display: none; height: 0;");
+          }
+          if (bottomPanel && snapshotSection) {
+            if (bottomSection) {
+              DragAndDrop2.shadowDiv.setAttribute("style", "opacity: 50%;");
+              DragAndDrop2.debounceBefore(
+                bottomPanel,
+                DragAndDrop2.shadowDiv,
+                bottomSection
+              );
+              DragAndDrop2.snapshot();
+              DragAndDrop2.clearTimeout();
+            }
+          }
+        } else if (isCursorInArea({
+          cursorX: ev.clientX,
+          cursorY: ev.clientY + DragAndDrop2.currentScroll,
+          ...getColumnAreas({
+            ...DragAndDrop2.currentBottomPanel,
+            panelLeft: bottomSection?.getBoundingClientRect().left ?? 0,
+            panelRight: bottomSection?.getBoundingClientRect().right ?? 0
+          }).bottom
+        })) {
+          const bottomPanel2 = DragAndDrop2.splash.querySelector(
+            `[data-panel][data-id='${DragAndDrop2.currentBottomPanel.id}']`
+          );
+          const draggingPanel2 = DragAndDrop2.splash.querySelector(
+            `[data-panel][data-id='${DragAndDrop2.draggingPanelId}']`
+          );
+          if (draggingPanel2) {
+            draggingPanel2.setAttribute("style", "display: none;");
+          }
+          if (bottomPanel2 && snapshotSection) {
+            const bottomSection2 = DragAndDrop2.splash.querySelector(
+              `[data-locationid='${snapshotSection.sectionId}']`
+            );
+            if (bottomSection2) {
+              DragAndDrop2.shadowDiv.setAttribute("style", "opacity: 50%;");
+              DragAndDrop2.debounceAfter(DragAndDrop2.shadowDiv, bottomPanel2);
+              DragAndDrop2.snapshot();
+              DragAndDrop2.clearTimeout();
+            }
+          }
+        }
+      }
+    } else if (!DragAndDrop2.currentBottomPanel && snapshotSection) {
+      const bottomSection = DragAndDrop2.splash.querySelector(
+        `[data-locationid='${snapshotSection.sectionId}']`
+      );
+      if (bottomSection) {
+        const draggingPanel = DragAndDrop2.splash.querySelector(
+          `[data-panel][data-id='${DragAndDrop2.draggingPanelId}']`
+        );
+        if (draggingPanel) {
+          draggingPanel.setAttribute("style", "display: none;");
+        }
+        DragAndDrop2.shadowDiv.setAttribute("style", "opacity: 50%;");
+        DragAndDrop2.debounceAppend(
+          bottomSection,
+          DragAndDrop2.shadowDiv
+        );
+        DragAndDrop2.snapshot();
+        DragAndDrop2.clearTimeout();
+      }
+    }
+  }
+}
+
+export { dragover };
+//# sourceMappingURL=Dragover.js.map

package/dist/splash/events/Dragover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dragover.js","sources":["../../../src/splash/events/Dragover.ts"],"sourcesContent":["/* eslint-disable no-param-reassign */\r\nimport { isCursorInArea } from '../util/isCursorInArea';\r\nimport { getColumnAreas } from '../util/getColumnAreas';\r\nimport { DragAndDrop } from '../util/DragAndDrop';\r\n\r\nexport function dragover(event: Event, DragAndDrop: DragAndDrop) {\r\n  const ev = event as DragEvent;\r\n  ev.preventDefault();\r\n\r\n  DragAndDrop.timeout = -1;\r\n  if (\r\n    (ev.clientX !== DragAndDrop.dragoverPosition.x ||\r\n      ev.clientY !== DragAndDrop.dragoverPosition.y) &&\r\n    DragAndDrop.draggingPanelId !== '' &&\r\n    DragAndDrop.shadowDiv\r\n  ) {\r\n    DragAndDrop.clearTimeout();\r\n    DragAndDrop.currentBottomPanel = DragAndDrop.findBottomPanel(\r\n      ev.clientX,\r\n      ev.clientY + DragAndDrop.currentScroll,\r\n    );\r\n\r\n    DragAndDrop.dragoverPosition.x = ev.clientX;\r\n    DragAndDrop.dragoverPosition.y = ev.clientY;\r\n\r\n    const snapshotSection = DragAndDrop.findBottomSection(\r\n      ev.clientX,\r\n      ev.clientY + DragAndDrop.currentScroll,\r\n    );\r\n\r\n    if (\r\n      DragAndDrop.shadowDivData &&\r\n      isCursorInArea({\r\n        cursorX: ev.clientX,\r\n        cursorY: ev.clientY + DragAndDrop.currentScroll,\r\n        bottom: DragAndDrop.shadowDivData?.panelBottom,\r\n        top: DragAndDrop.shadowDivData?.panelTop,\r\n        left: DragAndDrop.shadowDivData?.panelLeft,\r\n        right: DragAndDrop.shadowDivData?.panelRight,\r\n      })\r\n    ) {\r\n      return;\r\n    }\r\n\r\n    if (DragAndDrop.currentBottomPanel && snapshotSection) {\r\n      const bottomPanel = DragAndDrop.splash.querySelector(\r\n        `[data-panel][data-id='${DragAndDrop.currentBottomPanel.id}']`,\r\n      );\r\n      const draggingPanel = DragAndDrop.splash.querySelector(\r\n        `[data-panel][data-id='${DragAndDrop.draggingPanelId}']`,\r\n      );\r\n      const bottomSection = DragAndDrop.splash.querySelector(\r\n        `[data-locationid='${snapshotSection.sectionId}']`,\r\n      );\r\n\r\n      if (bottomSection) {\r\n        if (\r\n          isCursorInArea({\r\n            cursorX: ev.clientX,\r\n            cursorY: ev.clientY + DragAndDrop.currentScroll,\r\n            ...getColumnAreas({\r\n              ...DragAndDrop.currentBottomPanel,\r\n              panelLeft: bottomSection?.getBoundingClientRect().left ?? 0,\r\n              panelRight: bottomSection?.getBoundingClientRect().right ?? 0,\r\n            }).top,\r\n          })\r\n        ) {\r\n          if (draggingPanel) {\r\n            draggingPanel.setAttribute('style', 'display: none; height: 0;');\r\n          }\r\n          if (bottomPanel && snapshotSection) {\r\n            if (bottomSection) {\r\n              DragAndDrop.shadowDiv.setAttribute('style', 'opacity: 50%;');\r\n              DragAndDrop.debounceBefore(\r\n                bottomPanel,\r\n                DragAndDrop.shadowDiv,\r\n                bottomSection as HTMLElement,\r\n              );\r\n              DragAndDrop.snapshot();\r\n              DragAndDrop.clearTimeout();\r\n            }\r\n          }\r\n        } else if (\r\n          isCursorInArea({\r\n            cursorX: ev.clientX,\r\n            cursorY: ev.clientY + DragAndDrop.currentScroll,\r\n            ...getColumnAreas({\r\n              ...DragAndDrop.currentBottomPanel,\r\n              panelLeft: bottomSection?.getBoundingClientRect().left ?? 0,\r\n              panelRight: bottomSection?.getBoundingClientRect().right ?? 0,\r\n            }).bottom,\r\n          })\r\n        ) {\r\n          const bottomPanel = DragAndDrop.splash.querySelector(\r\n            `[data-panel][data-id='${DragAndDrop.currentBottomPanel.id}']`,\r\n          );\r\n          const draggingPanel = DragAndDrop.splash.querySelector(\r\n            `[data-panel][data-id='${DragAndDrop.draggingPanelId}']`,\r\n          );\r\n          if (draggingPanel) {\r\n            draggingPanel.setAttribute('style', 'display: none;');\r\n          }\r\n          if (bottomPanel && snapshotSection) {\r\n            const bottomSection = DragAndDrop.splash.querySelector(\r\n              `[data-locationid='${snapshotSection.sectionId}']`,\r\n            );\r\n            if (bottomSection) {\r\n              DragAndDrop.shadowDiv.setAttribute('style', 'opacity: 50%;');\r\n              DragAndDrop.debounceAfter(DragAndDrop.shadowDiv, bottomPanel);\r\n              DragAndDrop.snapshot();\r\n              DragAndDrop.clearTimeout();\r\n            }\r\n          }\r\n        }\r\n      }\r\n    } else if (!DragAndDrop.currentBottomPanel && snapshotSection) {\r\n      const bottomSection = DragAndDrop.splash.querySelector(\r\n        `[data-locationid='${snapshotSection.sectionId}']`,\r\n      );\r\n      if (bottomSection) {\r\n        const draggingPanel = DragAndDrop.splash.querySelector(\r\n          `[data-panel][data-id='${DragAndDrop.draggingPanelId}']`,\r\n        );\r\n        if (draggingPanel) {\r\n          draggingPanel.setAttribute('style', 'display: none;');\r\n        }\r\n        DragAndDrop.shadowDiv.setAttribute('style', 'opacity: 50%;');\r\n        DragAndDrop.debounceAppend(\r\n          bottomSection as HTMLElement,\r\n          DragAndDrop.shadowDiv,\r\n        );\r\n        DragAndDrop.snapshot();\r\n        DragAndDrop.clearTimeout();\r\n      }\r\n    }\r\n  }\r\n}\r\n"],"names":["DragAndDrop","bottomPanel","draggingPanel","bottomSection"],"mappings":"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"}

package/dist/splash/events/Dragstart.js

@@ -0,0 +1,65 @@
+import { getSpecificParent } from '@apia/util';
+
+function dragstart(ev, el, DragAndDrop2) {
+  if (!(el instanceof HTMLElement))
+    return;
+  DragAndDrop2.drawMinimap();
+  DragAndDrop2.sectionData = [];
+  const targetPanel = getSpecificParent(
+    ev.target,
+    (current) => !!current.dataset?.id && !!current.dataset?.panel
+  );
+  ev?.dataTransfer?.setData("text", targetPanel?.dataset.id);
+  if (targetPanel) {
+    DragAndDrop2.placeholderImage = targetPanel.cloneNode(true);
+    DragAndDrop2.placeholderImage.style.position = "fixed";
+    DragAndDrop2.placeholderImage.style.top = "-10000000.45px";
+    const children = DragAndDrop2.placeholderImage.querySelectorAll("*");
+    children.forEach((current) => current.style.overflow = "hidden");
+    document.body.append(DragAndDrop2.placeholderImage);
+    ev?.dataTransfer?.setDragImage(DragAndDrop2.placeholderImage, 0, 0);
+  }
+  if (ev.dataTransfer) {
+    ev.dataTransfer.effectAllowed = "move";
+  }
+  setTimeout(() => {
+    const targetSection = getSpecificParent(
+      ev.target,
+      (current) => !!current.dataset?.locationid
+    );
+    const sections = DragAndDrop2.body?.querySelectorAll("[data-locationid]");
+    const emptySectionsId = [];
+    sections?.forEach((sec) => {
+      if (sec.children.length === 0) {
+        emptySectionsId.push(sec.dataset.locationid ?? "");
+      }
+    });
+    emptySectionsId.forEach((emptySecId) => {
+      const section = DragAndDrop2.body?.querySelector(
+        `[data-locationid="${emptySecId}"]`
+      );
+      if (section) {
+        section.setAttribute("style", "padding: 10px; border:2px dashed #ccc");
+      }
+    });
+    DragAndDrop2.snapshot();
+    if (targetPanel) {
+      DragAndDrop2.draggingPanelSectionId = targetSection?.dataset.locationid ?? "";
+      DragAndDrop2.draggingPanelId = targetPanel.dataset.id;
+      DragAndDrop2.draggingPanel = targetPanel;
+    }
+    if (DragAndDrop2.draggingPanelId === "") {
+      return;
+    }
+    const falseDiv = targetPanel?.cloneNode(true);
+    falseDiv.style.opacity = `50%`;
+    falseDiv.style.width = `100%`;
+    falseDiv.style.height = `auto`;
+    falseDiv.style.backgroundColor = `rgba(0,0,0,0.1)`;
+    falseDiv.className = "apia_panel_falseDiv";
+    DragAndDrop2.shadowDiv = falseDiv;
+  }, 0);
+}
+
+export { dragstart };
+//# sourceMappingURL=Dragstart.js.map

package/dist/splash/events/Dragstart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dragstart.js","sources":["../../../src/splash/events/Dragstart.ts"],"sourcesContent":["/* eslint-disable no-param-reassign */\r\nimport { getSpecificParent } from '@apia/util';\r\nimport { DragAndDrop } from '../util/DragAndDrop';\r\n\r\nexport function dragstart(\r\n  ev: DragEvent,\r\n  el: Element,\r\n  DragAndDrop: DragAndDrop,\r\n) {\r\n  if (!(el instanceof HTMLElement)) return;\r\n  DragAndDrop.drawMinimap();\r\n  DragAndDrop.sectionData = [];\r\n\r\n  const targetPanel = getSpecificParent(\r\n    ev.target as HTMLElement,\r\n    (current) => !!current.dataset?.id && !!current.dataset?.panel,\r\n  );\r\n\r\n  ev?.dataTransfer?.setData('text', targetPanel?.dataset.id as string);\r\n  if (targetPanel) {\r\n    DragAndDrop.placeholderImage = targetPanel.cloneNode(true) as HTMLElement;\r\n    DragAndDrop.placeholderImage.style.position = 'fixed';\r\n    DragAndDrop.placeholderImage.style.top = '-10000000.45px';\r\n\r\n    const children =\r\n      DragAndDrop.placeholderImage.querySelectorAll<HTMLElement>('*');\r\n    children.forEach((current) => (current.style.overflow = 'hidden'));\r\n    document.body.append(DragAndDrop.placeholderImage);\r\n    ev?.dataTransfer?.setDragImage(DragAndDrop.placeholderImage, 0, 0);\r\n  }\r\n  if (ev.dataTransfer) {\r\n    // eslint-disable-next-line no-param-reassign\r\n    ev.dataTransfer.effectAllowed = 'move';\r\n  }\r\n\r\n  setTimeout(() => {\r\n    const targetSection = getSpecificParent(\r\n      ev.target as HTMLElement,\r\n      (current) => !!current.dataset?.locationid,\r\n    );\r\n\r\n    const sections = DragAndDrop.body?.querySelectorAll('[data-locationid]');\r\n\r\n    const emptySectionsId: string[] = [];\r\n\r\n    sections?.forEach((sec) => {\r\n      if (sec.children.length === 0) {\r\n        emptySectionsId.push((sec as HTMLElement).dataset.locationid ?? '');\r\n      }\r\n    });\r\n\r\n    emptySectionsId.forEach((emptySecId) => {\r\n      const section = DragAndDrop.body?.querySelector(\r\n        `[data-locationid=\"${emptySecId}\"]`,\r\n      );\r\n      if (section) {\r\n        section.setAttribute('style', 'padding: 10px; border:2px dashed #ccc');\r\n      }\r\n    });\r\n\r\n    DragAndDrop.snapshot();\r\n\r\n    if (targetPanel) {\r\n      DragAndDrop.draggingPanelSectionId =\r\n        targetSection?.dataset.locationid ?? '';\r\n      DragAndDrop.draggingPanelId = targetPanel.dataset.id as string;\r\n      DragAndDrop.draggingPanel = targetPanel;\r\n    }\r\n    if (DragAndDrop.draggingPanelId === '') {\r\n      return;\r\n    }\r\n    const falseDiv = targetPanel?.cloneNode(true) as HTMLDivElement;\r\n    falseDiv.style.opacity = `50%`;\r\n    falseDiv.style.width = `100%`;\r\n    falseDiv.style.height = `auto`;\r\n    falseDiv.style.backgroundColor = `rgba(0,0,0,0.1)`;\r\n    falseDiv.className = 'apia_panel_falseDiv';\r\n    DragAndDrop.shadowDiv = falseDiv;\r\n  }, 0);\r\n}\r\n"],"names":["DragAndDrop"],"mappings":"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"}

package/dist/splash/events/Drop.js

@@ -0,0 +1,60 @@
+import { getSpecificParent } from '@apia/util';
+import { updatePanelPosition } from '../../position/usePanelPosition.js';
+
+function Drop(event, DragAndDrop2) {
+  if (DragAndDrop2.body) {
+    const ev = event;
+    const data = ev?.dataTransfer?.getData("text");
+    const sections = DragAndDrop2.body?.querySelectorAll("[data-locationid]");
+    sections.forEach((sec) => {
+      sec.setAttribute("style", "");
+    });
+    const draggingPanel = DragAndDrop2.body.querySelector(
+      `[data-panel][data-id="${DragAndDrop2.draggingPanelId}"]:not(.apia_panel_falseDiv)`
+    );
+    if (draggingPanel) {
+      draggingPanel.setAttribute("style", "");
+    }
+    const falseDiv = document.querySelector(".apia_panel_falseDiv");
+    if (data) {
+      const child = document.querySelector(
+        `[data-panel][data-id="${data}"]:not(.apia_panel_falseDiv)`
+      );
+      sections.forEach((sec) => {
+        if (sec.children.length === 1) {
+          sec.setAttribute("style", "");
+        }
+      });
+      if (falseDiv) {
+        const newSection = getSpecificParent(
+          falseDiv,
+          (current) => !!current.dataset.locationid
+        );
+        if (newSection) {
+          const panelsArray = Array.from(newSection.children);
+          const childId = child.dataset.id;
+          if (childId) {
+            const index = panelsArray.findIndex(
+              (panel) => panel.dataset.id === childId
+            );
+            if (typeof index === "number" && newSection.dataset.locationid) {
+              void updatePanelPosition(
+                childId,
+                newSection.dataset.locationid,
+                index + 1
+              );
+            }
+          }
+        }
+        falseDiv.replaceWith(child);
+      }
+    }
+    DragAndDrop2.draggingPanelId = "";
+    DragAndDrop2.panelData = [];
+    DragAndDrop2.drawMinimap();
+    DragAndDrop2.removePlaceholder();
+  }
+}
+
+export { Drop };
+//# sourceMappingURL=Drop.js.map

package/dist/splash/events/Drop.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drop.js","sources":["../../../src/splash/events/Drop.ts"],"sourcesContent":["/* eslint-disable no-param-reassign */\r\nimport { getSpecificParent } from '@apia/util';\r\nimport { updatePanelPosition } from '../../position/usePanelPosition';\r\nimport { DragAndDrop } from '../util/DragAndDrop';\r\n\r\nexport function Drop(event: Event, DragAndDrop: DragAndDrop) {\r\n  if (DragAndDrop.body) {\r\n    const ev = event as DragEvent;\r\n    const data = ev?.dataTransfer?.getData('text');\r\n\r\n    const sections = DragAndDrop.body?.querySelectorAll('[data-locationid]');\r\n\r\n    sections.forEach((sec) => {\r\n      sec.setAttribute('style', '');\r\n    });\r\n\r\n    const draggingPanel = DragAndDrop.body.querySelector(\r\n      `[data-panel][data-id=\"${DragAndDrop.draggingPanelId}\"]:not(.apia_panel_falseDiv)`,\r\n    );\r\n\r\n    if (draggingPanel) {\r\n      draggingPanel.setAttribute('style', '');\r\n    }\r\n    const falseDiv = document.querySelector('.apia_panel_falseDiv');\r\n\r\n    if (data) {\r\n      const child = document.querySelector(\r\n        `[data-panel][data-id=\"${data}\"]:not(.apia_panel_falseDiv)`,\r\n      );\r\n      sections.forEach((sec) => {\r\n        if (sec.children.length === 1) {\r\n          sec.setAttribute('style', '');\r\n        }\r\n      });\r\n      if (falseDiv) {\r\n        const newSection = getSpecificParent(\r\n          falseDiv as HTMLElement,\r\n          (current) => !!current.dataset.locationid,\r\n        );\r\n\r\n        if (newSection) {\r\n          const panelsArray = Array.from(newSection.children);\r\n          const childId = (child as HTMLElement).dataset.id;\r\n\r\n          if (childId) {\r\n            const index = panelsArray.findIndex(\r\n              (panel) => (panel as HTMLElement).dataset.id === childId,\r\n            );\r\n\r\n            if (typeof index === 'number' && newSection.dataset.locationid) {\r\n              void updatePanelPosition(\r\n                childId,\r\n                newSection.dataset.locationid,\r\n                index + 1,\r\n              );\r\n            }\r\n          }\r\n        }\r\n        falseDiv.replaceWith(child as Node);\r\n      }\r\n    }\r\n\r\n    DragAndDrop.draggingPanelId = '';\r\n    DragAndDrop.panelData = [];\r\n    DragAndDrop.drawMinimap();\r\n\r\n    DragAndDrop.removePlaceholder();\r\n  }\r\n}\r\n"],"names":["DragAndDrop"],"mappings":";;;AAKgB,SAAA,IAAA,CAAK,OAAcA,YAA0B,EAAA;AAC3D,EAAA,IAAIA,aAAY,IAAM,EAAA;AACpB,IAAA,MAAM,EAAK,GAAA,KAAA,CAAA;AACX,IAAA,MAAM,IAAO,GAAA,EAAA,EAAI,YAAc,EAAA,OAAA,CAAQ,MAAM,CAAA,CAAA;AAE7C,IAAA,MAAM,QAAWA,GAAAA,YAAAA,CAAY,IAAM,EAAA,gBAAA,CAAiB,mBAAmB,CAAA,CAAA;AAEvE,IAAS,QAAA,CAAA,OAAA,CAAQ,CAAC,GAAQ,KAAA;AACxB,MAAI,GAAA,CAAA,YAAA,CAAa,SAAS,EAAE,CAAA,CAAA;AAAA,KAC7B,CAAA,CAAA;AAED,IAAM,MAAA,aAAA,GAAgBA,aAAY,IAAK,CAAA,aAAA;AAAA,MACrC,CAAA,sBAAA,EAAyBA,aAAY,eAAe,CAAA,4BAAA,CAAA;AAAA,KACtD,CAAA;AAEA,IAAA,IAAI,aAAe,EAAA;AACjB,MAAc,aAAA,CAAA,YAAA,CAAa,SAAS,EAAE,CAAA,CAAA;AAAA,KACxC;AACA,IAAM,MAAA,QAAA,GAAW,QAAS,CAAA,aAAA,CAAc,sBAAsB,CAAA,CAAA;AAE9D,IAAA,IAAI,IAAM,EAAA;AACR,MAAA,MAAM,QAAQ,QAAS,CAAA,aAAA;AAAA,QACrB,yBAAyB,IAAI,CAAA,4BAAA,CAAA;AAAA,OAC/B,CAAA;AACA,MAAS,QAAA,CAAA,OAAA,CAAQ,CAAC,GAAQ,KAAA;AACxB,QAAI,IAAA,GAAA,CAAI,QAAS,CAAA,MAAA,KAAW,CAAG,EAAA;AAC7B,UAAI,GAAA,CAAA,YAAA,CAAa,SAAS,EAAE,CAAA,CAAA;AAAA,SAC9B;AAAA,OACD,CAAA,CAAA;AACD,MAAA,IAAI,QAAU,EAAA;AACZ,QAAA,MAAM,UAAa,GAAA,iBAAA;AAAA,UACjB,QAAA;AAAA,UACA,CAAC,OAAA,KAAY,CAAC,CAAC,QAAQ,OAAQ,CAAA,UAAA;AAAA,SACjC,CAAA;AAEA,QAAA,IAAI,UAAY,EAAA;AACd,UAAA,MAAM,WAAc,GAAA,KAAA,CAAM,IAAK,CAAA,UAAA,CAAW,QAAQ,CAAA,CAAA;AAClD,UAAM,MAAA,OAAA,GAAW,MAAsB,OAAQ,CAAA,EAAA,CAAA;AAE/C,UAAA,IAAI,OAAS,EAAA;AACX,YAAA,MAAM,QAAQ,WAAY,CAAA,SAAA;AAAA,cACxB,CAAC,KAAA,KAAW,KAAsB,CAAA,OAAA,CAAQ,EAAO,KAAA,OAAA;AAAA,aACnD,CAAA;AAEA,YAAA,IAAI,OAAO,KAAA,KAAU,QAAY,IAAA,UAAA,CAAW,QAAQ,UAAY,EAAA;AAC9D,cAAK,KAAA,mBAAA;AAAA,gBACH,OAAA;AAAA,gBACA,WAAW,OAAQ,CAAA,UAAA;AAAA,gBACnB,KAAQ,GAAA,CAAA;AAAA,eACV,CAAA;AAAA,aACF;AAAA,WACF;AAAA,SACF;AACA,QAAA,QAAA,CAAS,YAAY,KAAa,CAAA,CAAA;AAAA,OACpC;AAAA,KACF;AAEA,IAAAA,aAAY,eAAkB,GAAA,EAAA,CAAA;AAC9B,IAAAA,YAAAA,CAAY,YAAY,EAAC,CAAA;AACzB,IAAAA,aAAY,WAAY,EAAA,CAAA;AAExB,IAAAA,aAAY,iBAAkB,EAAA,CAAA;AAAA,GAChC;AACF;;;;"}

package/dist/splash/panels/DefaultPanelWrapper/NetworkState.js

@@ -0,0 +1,28 @@
+import { jsx, Fragment } from '@apia/theme/jsx-runtime';
+import { Icon } from '@apia/icons';
+import { getLabel } from '@apia/util';
+import { usePanelNetworkState } from '../../../actions/usePanelNetworkState.js';
+
+const NetworkState = ({ title }) => {
+  const isConnected = usePanelNetworkState();
+  return /* @__PURE__ */ jsx(Fragment, { children: !isConnected && /* @__PURE__ */ jsx(
+    Icon,
+    {
+      tabIndex: 0,
+      title: getLabel("lblTestDBNoOk", {
+        text: {
+          TOK1: title
+        }
+      }).text,
+      "aria-label": getLabel("lblTestDBNoOk", {
+        text: {
+          TOK1: title
+        }
+      }).text,
+      name: "Alert"
+    }
+  ) });
+};
+
+export { NetworkState };
+//# sourceMappingURL=NetworkState.js.map

package/dist/splash/panels/DefaultPanelWrapper/NetworkState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NetworkState.js","sources":["../../../../src/splash/panels/DefaultPanelWrapper/NetworkState.tsx"],"sourcesContent":["import { Icon } from '@apia/icons';\r\nimport { getLabel } from '@apia/util';\r\nimport { usePanelNetworkState } from '../../../actions';\r\n\r\nexport const NetworkState = ({ title }: { title: string }) => {\r\n  const isConnected = usePanelNetworkState();\r\n  return (\r\n    <>\r\n      {!isConnected && (\r\n        <Icon\r\n          tabIndex={0}\r\n          title={\r\n            getLabel('lblTestDBNoOk', {\r\n              text: {\r\n                TOK1: title,\r\n              },\r\n            }).text\r\n          }\r\n          aria-label={\r\n            getLabel('lblTestDBNoOk', {\r\n              text: {\r\n                TOK1: title,\r\n              },\r\n            }).text\r\n          }\r\n          name=\"Alert\"\r\n        />\r\n      )}\r\n    </>\r\n  );\r\n};\r\n"],"names":[],"mappings":";;;;;AAIO,MAAM,YAAe,GAAA,CAAC,EAAE,KAAA,EAA+B,KAAA;AAC5D,EAAA,MAAM,cAAc,oBAAqB,EAAA,CAAA;AACzC,EACE,uBAAA,GAAA,CAAA,QAAA,EAAA,EACG,WAAC,WACA,oBAAA,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,QAAU,EAAA,CAAA;AAAA,MACV,KAAA,EACE,SAAS,eAAiB,EAAA;AAAA,QACxB,IAAM,EAAA;AAAA,UACJ,IAAM,EAAA,KAAA;AAAA,SACR;AAAA,OACD,CAAE,CAAA,IAAA;AAAA,MAEL,YAAA,EACE,SAAS,eAAiB,EAAA;AAAA,QACxB,IAAM,EAAA;AAAA,UACJ,IAAM,EAAA,KAAA;AAAA,SACR;AAAA,OACD,CAAE,CAAA,IAAA;AAAA,MAEL,IAAK,EAAA,OAAA;AAAA,KAAA;AAAA,GAGX,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/dist/splash/panels/DefaultPanelWrapper/PanelButtons.js

@@ -0,0 +1,16 @@
+import { jsxs, Fragment, jsx } from '@apia/theme/jsx-runtime';
+import { makeImperativeComponent } from '@apia/util';
+import { RefreshButton } from './RefreshButton.js';
+import { SettingsButton } from './SettingsButton.js';
+
+const [, panelButtonsActions, PanelButtons] = makeImperativeComponent()({
+  Component: (props) => {
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      props.isRefreshable && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(RefreshButton, { ...props }) }),
+      props.isConfigurable && /* @__PURE__ */ jsx(SettingsButton, { title: props.title })
+    ] });
+  }
+});
+
+export { PanelButtons, panelButtonsActions };
+//# sourceMappingURL=PanelButtons.js.map

package/dist/splash/panels/DefaultPanelWrapper/PanelButtons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PanelButtons.js","sources":["../../../../src/splash/panels/DefaultPanelWrapper/PanelButtons.tsx"],"sourcesContent":["import { makeImperativeComponent } from '@apia/util';\r\nimport { RefreshButton } from './RefreshButton';\r\nimport { SettingsButton } from './SettingsButton';\r\nimport { TPanelProps } from '../../../types';\r\n\r\nexport const [, panelButtonsActions, PanelButtons] = makeImperativeComponent<\r\n  Omit<TPanelProps, 'initialData' | 'children'>,\r\n  {\r\n    disable: boolean;\r\n  }\r\n>()({\r\n  Component: (props) => {\r\n    return (\r\n      <>\r\n        {props.isRefreshable && (\r\n          <>\r\n            <RefreshButton {...props} />\r\n          </>\r\n        )}\r\n        {props.isConfigurable && <SettingsButton title={props.title} />}\r\n      </>\r\n    );\r\n  },\r\n});\r\n"],"names":[],"mappings":";;;;;AAKO,MAAM,GAAG,mBAAA,EAAqB,YAAY,CAAA,GAAI,yBAKjD,CAAA;AAAA,EACF,SAAA,EAAW,CAAC,KAAU,KAAA;AACpB,IAAA,uBAEK,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,MAAA,KAAA,CAAM,iCAEH,GAAA,CAAA,QAAA,EAAA,EAAA,QAAA,kBAAA,GAAA,CAAC,aAAe,EAAA,EAAA,GAAG,OAAO,CAC5B,EAAA,CAAA;AAAA,MAED,MAAM,cAAkB,oBAAA,GAAA,CAAC,cAAe,EAAA,EAAA,KAAA,EAAO,MAAM,KAAO,EAAA,CAAA;AAAA,KAC/D,EAAA,CAAA,CAAA;AAAA,GAEJ;AACF,CAAC;;;;"}

package/dist/splash/panels/DefaultPanelWrapper/RefreshButton.js

@@ -0,0 +1,35 @@
+import { jsx } from '@apia/theme/jsx-runtime';
+import { IconButton } from '@apia/components';
+import { useImperativeComponentEvents, getLabel } from '@apia/util';
+import { useState, useCallback } from 'react';
+import { usePanelActions } from '../../../actions/usePanelActions.js';
+import { usePanelIsLoading } from '../../../actions/usePanelIsLoading.js';
+
+const RefreshButton = (props) => {
+  const [isDisabled, setIsDisabled] = useState(false);
+  const isLoading = usePanelIsLoading();
+  const dispatch = usePanelActions();
+  useImperativeComponentEvents({
+    disable(newDisabledValue) {
+      setIsDisabled(newDisabledValue);
+    }
+  });
+  return /* @__PURE__ */ jsx(
+    IconButton,
+    {
+      icon: "Refresh",
+      variant: "buttons.icon-outline",
+      className: "panel__iconButton",
+      size: "Md",
+      onClick: useCallback(() => {
+        void dispatch({ action: "refresh" });
+      }, [dispatch]),
+      title: getLabel("lblRefreshPnl", { text: { TOK1: props.title } }).text,
+      isLoading,
+      disabled: isDisabled
+    }
+  );
+};
+
+export { RefreshButton };
+//# sourceMappingURL=RefreshButton.js.map

package/dist/splash/panels/DefaultPanelWrapper/RefreshButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RefreshButton.js","sources":["../../../../src/splash/panels/DefaultPanelWrapper/RefreshButton.tsx"],"sourcesContent":["import { IconButton } from '@apia/components';\r\nimport { getLabel, useImperativeComponentEvents } from '@apia/util';\r\nimport { useCallback, useState } from 'react';\r\nimport { usePanelActions, usePanelIsLoading } from '../../../actions';\r\n\r\nexport const RefreshButton = (props: {\r\n  refreshOnStart: boolean;\r\n  refreshOnHome: boolean;\r\n  title: string;\r\n}) => {\r\n  const [isDisabled, setIsDisabled] = useState(false);\r\n\r\n  const isLoading = usePanelIsLoading();\r\n  const dispatch = usePanelActions();\r\n\r\n  useImperativeComponentEvents({\r\n    disable(newDisabledValue: boolean) {\r\n      setIsDisabled(newDisabledValue);\r\n    },\r\n  });\r\n\r\n  return (\r\n    <IconButton\r\n      icon=\"Refresh\"\r\n      variant=\"buttons.icon-outline\"\r\n      className=\"panel__iconButton\"\r\n      size=\"Md\"\r\n      onClick={useCallback(() => {\r\n        void dispatch({ action: 'refresh' });\r\n      }, [dispatch])}\r\n      title={getLabel('lblRefreshPnl', { text: { TOK1: props.title } }).text}\r\n      isLoading={isLoading}\r\n      disabled={isDisabled}\r\n    />\r\n  );\r\n};\r\n"],"names":[],"mappings":";;;;;;;AAKa,MAAA,aAAA,GAAgB,CAAC,KAIxB,KAAA;AACJ,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAElD,EAAA,MAAM,YAAY,iBAAkB,EAAA,CAAA;AACpC,EAAA,MAAM,WAAW,eAAgB,EAAA,CAAA;AAEjC,EAA6B,4BAAA,CAAA;AAAA,IAC3B,QAAQ,gBAA2B,EAAA;AACjC,MAAA,aAAA,CAAc,gBAAgB,CAAA,CAAA;AAAA,KAChC;AAAA,GACD,CAAA,CAAA;AAED,EACE,uBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,SAAA;AAAA,MACL,OAAQ,EAAA,sBAAA;AAAA,MACR,SAAU,EAAA,mBAAA;AAAA,MACV,IAAK,EAAA,IAAA;AAAA,MACL,OAAA,EAAS,YAAY,MAAM;AACzB,QAAA,KAAK,QAAS,CAAA,EAAE,MAAQ,EAAA,SAAA,EAAW,CAAA,CAAA;AAAA,OACrC,EAAG,CAAC,QAAQ,CAAC,CAAA;AAAA,MACb,KAAA,EAAO,QAAS,CAAA,eAAA,EAAiB,EAAE,IAAA,EAAM,EAAE,IAAA,EAAM,KAAM,CAAA,KAAA,EAAQ,EAAC,CAAE,CAAA,IAAA;AAAA,MAClE,SAAA;AAAA,MACA,QAAU,EAAA,UAAA;AAAA,KAAA;AAAA,GACZ,CAAA;AAEJ;;;;"}