jmapcloud-ng 1.1.14 → 1.1.16

package/readme.md

@@ -1,6 +1,6 @@
 #### The first time, install dependencies :
 
-    npm i 
+    npm i
 
 #### To start the application :
 
@@ -15,7 +15,6 @@ When code is changed, it's automatically built and the web page refresh by its o
     - https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
     - "Prettier - Code formatter" extention (Author : Esben Petersen)
 
-
 #### VPS publishing
 
 When working in a VPS environment, your personal VPS expect to find the Portal compiled sources in a local diretory inside the web hosting VPS infrascructure.

package/stories/NumberInput.stories.tsx

@@ -0,0 +1,76 @@
+import { InputAdornment, TextField, Typography } from "@mui/material"
+import type { Meta, StoryObj } from "@storybook/react"
+import { useArgs } from "storybook/internal/preview-api"
+import { PrintField } from "@/print/components/PrintComponents"
+
+const meta: Meta = {
+  title: "Form/NumberInput",
+  args: {
+    label: "Scale",
+    value: 25000,
+    min: 100,
+    max: 10000000000,
+    step: 5000
+  },
+  argTypes: {
+    label: { control: "text" },
+    value: { control: "number" },
+    min: { control: "number" },
+    max: { control: "number" },
+    step: { control: "number" }
+  }
+}
+
+export default meta
+type Story = StoryObj
+
+export const Scale: Story = {
+  render: () => {
+    const [{ label, value, min, max, step }, updateArgs] = useArgs<{ label: string; value: number; min: number; max: number; step: number }>()
+    return (
+      <PrintField label={label}>
+        <TextField
+          variant="filled"
+          type="number"
+          value={value}
+          onChange={e => updateArgs({ value: Number(e.target.value) })}
+          sx={{ "& input": { paddingLeft: 0 } }}
+          InputProps={{
+            startAdornment: (
+              <InputAdornment position="start">
+                <Typography sx={theme => ({ paddingLeft: ".9375rem", color: theme.palette.primary.main, fontSize: ".875rem" })}>
+                  1 :{" "}
+                </Typography>
+              </InputAdornment>
+            ),
+            inputProps: { min, max, step }
+          }}
+        />
+      </PrintField>
+    )
+  }
+}
+
+export const Plain: Story = {
+  args: {
+    label: "Count",
+    value: 10,
+    min: 0,
+    max: 100,
+    step: 1
+  },
+  render: () => {
+    const [{ label, value, min, max, step }, updateArgs] = useArgs<{ label: string; value: number; min: number; max: number; step: number }>()
+    return (
+      <PrintField label={label}>
+        <TextField
+          variant="filled"
+          type="number"
+          value={value}
+          onChange={e => updateArgs({ value: Number(e.target.value) })}
+          InputProps={{ inputProps: { min, max, step } }}
+        />
+      </PrintField>
+    )
+  }
+}

package/stories/RadioGroup.stories.tsx

@@ -0,0 +1,58 @@
+import { Checkbox, FormControlLabel, FormGroup, FormLabel } from "@mui/material"
+import type { Meta, StoryObj } from "@storybook/react"
+import { useArgs } from "storybook/internal/preview-api"
+import { RadioGroup } from "@/print/components/PrintComponents"
+
+const meta: Meta<typeof RadioGroup> = {
+  title: "Form/RadioGroup",
+  component: RadioGroup
+}
+
+export default meta
+type Story = StoryObj<typeof RadioGroup>
+
+export const MultipleCheckboxes: Story = {
+  render: () => {
+    const [args, updateArgs] = useArgs<{ date: boolean; north: boolean; scale: boolean; legend: boolean }>()
+    return (
+      <RadioGroup>
+        <FormLabel component="legend">Display</FormLabel>
+        <FormGroup>
+          <FormControlLabel
+            control={<Checkbox size="small" color="primary" checked={args.date ?? true} onChange={() => updateArgs({ date: !args.date })} />}
+            label="Date"
+          />
+          <FormControlLabel
+            control={<Checkbox size="small" color="primary" checked={args.north ?? true} onChange={() => updateArgs({ north: !args.north })} />}
+            label="North Arrow"
+          />
+          <FormControlLabel
+            control={<Checkbox size="small" color="primary" checked={args.scale ?? true} onChange={() => updateArgs({ scale: !args.scale })} />}
+            label="Scale"
+          />
+          <FormControlLabel
+            control={<Checkbox size="small" color="primary" checked={args.legend ?? false} onChange={() => updateArgs({ legend: !args.legend })} />}
+            label="Legend"
+          />
+        </FormGroup>
+      </RadioGroup>
+    )
+  },
+  args: { date: true, north: true, scale: true, legend: false } as any
+}
+
+export const SingleCheckbox: Story = {
+  render: () => {
+    const [{ checked }, updateArgs] = useArgs<{ checked: boolean }>()
+    return (
+      <RadioGroup>
+        <FormLabel component="legend">Resolution</FormLabel>
+        <FormControlLabel
+          control={<Checkbox size="small" color="primary" checked={checked ?? false} onChange={() => updateArgs({ checked: !checked })} />}
+          label="High resolution"
+        />
+      </RadioGroup>
+    )
+  },
+  args: { checked: false } as any
+}

package/stories/Select.stories.tsx

@@ -0,0 +1,80 @@
+import { Select } from "@mui/material"
+import type { Meta, StoryObj } from "@storybook/react"
+import { useArgs } from "storybook/internal/preview-api"
+import { PrintField } from "@/print/components/PrintComponents"
+
+const meta: Meta = {
+  title: "Form/Select",
+  args: {
+    label: "File Type",
+    value: "png"
+  },
+  argTypes: {
+    label: { control: "text" },
+    value: { control: "select", options: ["png", "jpeg", "pdf"] }
+  }
+}
+
+export default meta
+type Story = StoryObj
+
+export const FileType: Story = {
+  render: () => {
+    const [{ label, value }, updateArgs] = useArgs<{ label: string; value: string }>()
+    return (
+      <PrintField label={label}>
+        <Select native variant="filled" value={value} onChange={e => updateArgs({ value: e.target.value })}>
+          <option value="png">png</option>
+          <option value="jpeg">jpeg</option>
+          <option value="pdf">pdf</option>
+        </Select>
+      </PrintField>
+    )
+  }
+}
+
+export const PaperFormat: Story = {
+  args: {
+    label: "Paper Format",
+    value: "letter"
+  },
+  argTypes: {
+    value: { control: "select", options: ["letter", "a4", "a3", "a2", "a1", "a0"] }
+  },
+  render: () => {
+    const [{ label, value }, updateArgs] = useArgs<{ label: string; value: string }>()
+    return (
+      <PrintField label={label}>
+        <Select native variant="filled" value={value} onChange={e => updateArgs({ value: e.target.value })}>
+          <option value="letter">Letter</option>
+          <option value="a4">A4</option>
+          <option value="a3">A3</option>
+          <option value="a2">A2</option>
+          <option value="a1">A1</option>
+          <option value="a0">A0</option>
+        </Select>
+      </PrintField>
+    )
+  }
+}
+
+export const Orientation: Story = {
+  args: {
+    label: "Orientation",
+    value: "true"
+  },
+  argTypes: {
+    value: { control: "select", options: ["true", "false"] }
+  },
+  render: () => {
+    const [{ label, value }, updateArgs] = useArgs<{ label: string; value: string }>()
+    return (
+      <PrintField label={label}>
+        <Select native variant="filled" value={value} onChange={e => updateArgs({ value: e.target.value })}>
+          <option value="true">Portrait</option>
+          <option value="false">Landscape</option>
+        </Select>
+      </PrintField>
+    )
+  }
+}

package/stories/TextField.stories.tsx

@@ -0,0 +1,58 @@
+import { TextField } from "@mui/material"
+import type { Meta, StoryObj } from "@storybook/react"
+import { useArgs } from "storybook/internal/preview-api"
+import { PrintField } from "@/print/components/PrintComponents"
+
+const meta: Meta = {
+  title: "Form/TextField",
+  args: {
+    label: "Title",
+    value: "My Map Title",
+    placeholder: ""
+  },
+  argTypes: {
+    label: { control: "text" },
+    value: { control: "text" },
+    placeholder: { control: "text" }
+  }
+}
+
+export default meta
+type Story = StoryObj
+
+export const Default: Story = {
+  render: () => {
+    const [{ label, value, placeholder }, updateArgs] = useArgs<{ label: string; value: string; placeholder: string }>()
+    return (
+      <PrintField label={label}>
+        <TextField
+          variant="filled"
+          value={value}
+          placeholder={placeholder}
+          onChange={e => updateArgs({ value: e.target.value })}
+        />
+      </PrintField>
+    )
+  }
+}
+
+export const Empty: Story = {
+  args: {
+    label: "Subtitle",
+    value: "",
+    placeholder: "Enter subtitle..."
+  },
+  render: () => {
+    const [{ label, value, placeholder }, updateArgs] = useArgs<{ label: string; value: string; placeholder: string }>()
+    return (
+      <PrintField label={label}>
+        <TextField
+          variant="filled"
+          value={value}
+          placeholder={placeholder}
+          onChange={e => updateArgs({ value: e.target.value })}
+        />
+      </PrintField>
+    )
+  }
+}

package/vite.config.ts

@@ -0,0 +1,184 @@
+import react from "@vitejs/plugin-react"
+import dotenv from "dotenv"
+import { readFileSync } from "fs"
+import { resolve } from "path"
+import { defineConfig, type Plugin } from "vite"
+import mkcert from "vite-plugin-mkcert"
+
+dotenv.config({ path: resolve(__dirname, ".env") })
+
+const packageJSON = JSON.parse(readFileSync(resolve(__dirname, "package.json"), "utf8"))
+
+const getBuildNumber = () => {
+  const d = new Date()
+  const pad = (n: number) => (n < 10 ? `0${n}` : `${n}`)
+  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}.${process.env.GITHUB_BUILD_NUMBER ?? "dev"}`
+}
+
+const getRestBaseUrl = () => {
+  const env = process.env.CLOUD_ENV
+  const prefix =
+    env === "production" ? "" : env === "staging" ? "staging." : env === "QA" ? "qa." : process.env.REST_BASE_API_DEV_SERVER_PREFIX ? `${process.env.REST_BASE_API_DEV_SERVER_PREFIX}.` : "dev."
+  return `https://api.${prefix}jmapcloud.io`
+}
+
+const getHtmlInputPath = () => resolve(__dirname, process.env.BUILD_TARGET === "cloud" ? "build/index.html" : "index.html")
+
+const JMAP_OPTIONS_PLACEHOLDER = "/* __JMAP_OPTIONS_PLACEHOLDER__ */"
+
+function jmapOptionsPlugin(): Plugin {
+  return {
+    name: "jmap-options",
+    transformIndexHtml(html: string) {
+      const replacement = `window.JMAP_OPTIONS = { restBaseUrl: "${getRestBaseUrl()}", map: {}, application: {}, hideMainLayout: true }`
+      return html.replace(JMAP_OPTIONS_PLACEHOLDER, replacement)
+    }
+  }
+}
+
+function inlineCssInLegacyBuildPlugin(isLegacyProductionBuild: boolean): Plugin {
+  return {
+    name: "inline-css-in-legacy-build",
+    apply: "build",
+    enforce: "post",
+    generateBundle(_outputOptions, bundle) {
+      if (!isLegacyProductionBuild) {
+        return
+      }
+
+      const cssAssets = Object.entries(bundle).flatMap(([fileName, output]) => {
+        if (output.type !== "asset" || !output.fileName.endsWith(".css")) {
+          return []
+        }
+
+        const source = output.source
+        const cssText = typeof source === "string" ? source : Buffer.from(source).toString("utf8")
+        return [{ fileName, cssText }]
+      })
+      const combinedCss = cssAssets.map(css => css.cssText).join("\n")
+
+      for (const output of Object.values(bundle)) {
+        if (output.type !== "chunk" || !output.isEntry) {
+          continue
+        }
+
+        if (!combinedCss) {
+          continue
+        }
+
+        const styleId = `vite-inline-css-${output.fileName.replace(/[^a-zA-Z0-9_-]/g, "-")}`
+        const injectionCode = `(function(){var id=${JSON.stringify(styleId)};if(document.getElementById(id)){return;}var s=document.createElement("style");s.id=id;s.appendChild(document.createTextNode(${JSON.stringify(combinedCss)}));document.head.appendChild(s);}());`
+        output.code = `${injectionCode}\n${output.code}`
+      }
+
+      for (const css of cssAssets) {
+        const cssFileName = css.fileName
+        delete bundle[cssFileName]
+      }
+
+      for (const output of Object.values(bundle)) {
+        if (output.type !== "asset" || !output.fileName.endsWith(".html")) {
+          continue
+        }
+
+        const source = output.source
+        const html = typeof source === "string" ? source : Buffer.from(source).toString("utf8")
+
+        output.source = html
+          .replace(/<link[^>]*rel=["']stylesheet["'][^>]*>\s*/g, "")
+          // Legacy mode uses classic scripts; strip module type first.
+          .replace(/<script([^>]*?)\stype=["']module["']([^>]*)>/g, (_match: string, before: string, after: string) => `<script${before}${after}>`)
+          // Enforce defer on every script tag in legacy HTML.
+          .replace(/<script(?![^>]*\bdefer\b)([^>]*)>/g, (_match: string, attrs: string) => `<script${attrs} defer>`)
+      }
+    }
+  }
+}
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export default defineConfig(async ({ command }): Promise<any> => {
+  const postcssParentSelector = (await import("postcss-parent-selector")).default
+  const keepGlobalRootSelectorsPlugin: any = {
+    postcssPlugin: "keep-global-root-selectors",
+    Rule(rule: { selectors?: string[] }) {
+      if (!rule.selectors) {
+        return
+      }
+      rule.selectors = rule.selectors.map(selector => selector.replace(/^\.jmap_wrapper\s+(html|body|:root)(?=[\s.:#[>+~]|$)/, "$1"))
+    }
+  }
+  const isLegacyProductionBuild = command === "build" && process.env.NODE_ENV === "production"
+  const coreIndexFileUrl =
+    process.env.CORE_INDEX_FILE_URL && process.env.CORE_INDEX_FILE_URL.trim().length > 0
+      ? process.env.CORE_INDEX_FILE_URL
+      : command === "serve"
+        ? `https://localhost:${process.env.CORE_DEV_PORT ?? "8085"}/src/core.ts`
+        : "./ng-core/index.js"
+  const plugins: any[] = [react(), jmapOptionsPlugin(), inlineCssInLegacyBuildPlugin(isLegacyProductionBuild)]
+
+  if (command === "serve") {
+    const { default: checker } = await import("vite-plugin-checker")
+    plugins.push(mkcert(), checker({ typescript: true }))
+  }
+
+  return {
+    root: __dirname,
+    resolve: {
+      alias: {
+        "@": resolve(__dirname, "src")
+      }
+    },
+    define: {
+      TYPESCRIPT_APP_VERSION: JSON.stringify(getBuildNumber()),
+      APP_VERSION: process.env.BUILD_TARGET === "cloud" ? JSON.stringify(getBuildNumber()) : JSON.stringify(packageJSON.version),
+      IS_DEV: command === "serve" ? "true" : "false",
+      CORE_INDEX_FILE_URL: JSON.stringify(coreIndexFileUrl),
+      MUI_X_PRO_LICENSE: JSON.stringify(process.env.MUI_X_PRO_LICENSE ?? "")
+    },
+    css: {
+      postcss: {
+        plugins: [
+          postcssParentSelector({
+            selector: ".jmap_wrapper"
+          }),
+          keepGlobalRootSelectorsPlugin
+        ]
+      }
+    },
+    plugins,
+    server: {
+      port: Number(process.env.DEV_PORT) || 8086,
+      cors: true
+    },
+    build: {
+      outDir: process.env.BUILD_DIR || resolve(__dirname, "public"),
+      emptyOutDir: true,
+      target: isLegacyProductionBuild ? "es2015" : "esnext",
+      sourcemap: command === "serve",
+      cssCodeSplit: !isLegacyProductionBuild,
+      // TODO: feature/JMAP8-3471 - replace terser by esbuild
+      minify: "terser",
+      terserOptions: {
+        compress: {},
+        ecma: 2015,
+        keep_classnames: true,
+        keep_fnames: true,
+        toplevel: false,
+        format: {
+          comments: false,
+          beautify: false
+        }
+      },
+      rollupOptions: {
+        input: getHtmlInputPath(),
+        output: {
+          ...(isLegacyProductionBuild ? { format: "iife" as const, name: "JMapNgBundle" } : {}),
+          inlineDynamicImports: isLegacyProductionBuild,
+          entryFileNames: process.env.BUILD_TARGET === "cloud" ? "[name].[hash].js" : "[name].js",
+          chunkFileNames: "[name].[hash].js",
+          assetFileNames: "[name].[hash][extname]"
+        }
+      }
+    }
+  }
+})

package/vitest.config.ts

@@ -0,0 +1,20 @@
+/// <reference types="vitest/config" />
+import { resolve } from "path"
+import { defineConfig } from "vitest/config"
+
+export default defineConfig({
+  resolve: {
+    alias: {
+      "@": resolve(__dirname, "src"),
+      "jmapcloud-common": resolve(__dirname, "../../../packages/jmapcloud-common/src/index.ts"),
+      "jmapcloud-ng-core-types": resolve(__dirname, "../ng-core-types/index.ts"),
+      "jmapcloud-ng-types": resolve(__dirname, "../ng-types/index.ts"),
+      "jmapcloud-ng-types/all-enums": resolve(__dirname, "../ng-types/all-enums.ts")
+    }
+  },
+  test: {
+    environment: "node",
+    globals: true,
+    passWithNoTests: true
+  }
+})

package/public/119.1c53fc837017c47d1253.js

@@ -1 +0,0 @@
-"use strict";(self.webpackChunkjmapcloud_ng=self.webpackChunkjmapcloud_ng||[]).push([[119],{90119:function(e,t,n){n.r(t),n.d(t,{startSelectionPage:function(){return startSelectionPage}});var i=n(49236),a=n(36870),l=n(86326),r=n(63776),o=n(61275),s=n(68737),d=n(82432),c=(n(80742),n(8380),n(1986),n(47531)),h=n(77608),u=n(15331),b=n(31665),p=n(5535),m=n(51682),g=n(92248),A=n(9940),f=n(12945),x=n(73726),C=n(12396),S=n(42432),j=n(63010),v=n(63641),y=n(76922),N=n(72387),T=n(69626),w=n(13326),_=n(65492);const D=(0,w.Ay)(_.A)({height:"1rem",borderRadius:"0.1rem",fontSize:"0.8rem","& > .MuiChip-label":{textAlign:"center",padding:"0.2rem",paddingLeft:"0.25rem",paddingRight:"0.25rem"}},{withTheme:!0});var E=n(67110),P=void 0;const k=function getCollator(){return(0,i.A)(this,P),new Intl.Collator(JMap.Language.getLocale(),{numeric:!0,sensitivity:"base"})}.bind(void 0),M=function compare(e,t,n,a){return(0,i.A)(this,P),null==e&&null!=t?a===E.C_.ASCENDANT?1:-1:null!=e&&null==t?a===E.C_.ASCENDANT?-1:1:a===E.C_.ASCENDANT?n.compare(e,t):n.compare(t,e)}.bind(void 0);var R=n(82324),L=n(64821);function EnhancedTableHead(e){var t=this;const{order:n,orderBy:l,onRequestSort:r}=e,o=function createSortHandler(e){var n=this;return(0,i.A)(this,t),function(t){(0,i.A)(this,n),r(t,e)}.bind(this)}.bind(this);return(0,a.jsx)(f.A,{children:(0,a.jsx)(C.A,{children:e.headCells.map(function(e){return(0,i.A)(this,t),(0,a.jsx)(g.A,{id:`selection-table-header-${e.id}`,align:"left",padding:e.disablePadding?"none":"normal",sortDirection:l===e.name&&n,children:(0,a.jsxs)(S.A,{id:`selection-table-header-${e.id}-label`,sx:{textTransform:"capitalize"},active:l===e.name,direction:l===e.name?n:E.C_.ASCENDANT,onClick:o(e.name),children:[e.label,l===e.name?(0,a.jsx)(u.A,{component:"span",sx:{border:0,clip:"rect(0 0 0 0)",height:1,margin:-1,overflow:"hidden",padding:0,position:"absolute",top:20,width:1},children:n===E.C_.DESCENDANT?"sorted descending":"sorted ascending"}):null]})},e.id)}.bind(this))})})}const I=(0,d.Ng)(function(e){var t=this;(0,i.A)(this,undefined);const n=(0,N.B)(e).selection.displayedLayerId,a=e.layer.allById[n],l=a?a.attributes:[],r=a?a.name:"-";return{selection:e.map.selection,displayedLayerId:n,layerName:r,headCells:l.map(function(e){return(0,i.A)(this,t),{id:e.id,name:e.name,disablePadding:!0,label:e.label,type:e.type}}.bind(this)),containerHeight:e.map.containerHeight}}.bind(void 0))(function SelectionTableFn(e){var t=this;const[n,r]=l.useState(E.C_.ASCENDANT),[o,d]=l.useState(""),[f,S]=l.useState(0),N=function handleRequestSort(e,a){(0,i.A)(this,t);const l=o===a&&n===E.C_.ASCENDANT;r(l?E.C_.DESCENDANT:E.C_.ASCENDANT),d(a)}.bind(this),w=function handleClick(e,n){(0,i.A)(this,t),JMap.Map.fitFeatures([n.jmap_feature_buff],{paddingBottom:(0,L.N)(),maxZoom:R.nD})}.bind(this),_=function handlePageChange(e,n){return(0,i.A)(this,t),S(n)}.bind(this),P=(e.selection[e.displayedLayerId]||[]).map(function(e){return(0,i.A)(this,t),{jmap_feature_buff:e,...e.properties}}.bind(this));let I=f;f*T.l>P.length&&(I=0);const H=k();return(0,a.jsxs)(u.A,{sx:function sx(e){return(0,i.A)(this,t),{backgroundColor:e.palette.background.paper,width:"100%",height:"100%",paddingLeft:".5rem",paddingRight:".5rem",borderRadius:0}}.bind(this),children:[(0,a.jsx)(b.A,{id:"selection-table-close-button",title:(0,y.Tl)("selection.close.table"),children:(0,a.jsx)(u.A,{sx:{position:"absolute",top:".5rem",right:".5rem",zIndex:2,cursor:"pointer"},children:(0,a.jsx)(h.g,{icon:c.GR,onClick:function onClick(){(0,i.A)(this,t),JMap.Application.Selection.closeTableTab()}.bind(this)})})}),(0,a.jsxs)(j.A,{sx:{position:"relative",left:"0.5rem"},children:[(0,a.jsx)(v.A,{id:"selection-table-layer-title",variant:"h6",color:"textPrimary",children:e.layerName}),(0,a.jsxs)(v.A,{id:"selection-table-count-title",sx:{fontSize:".95rem"},color:"textSecondary",children:[" : ",(0,y.Tl)("selection.layer.count",P.length)]})]}),(0,a.jsx)(A.A,{sx:{position:"relative",left:"0.5rem",width:"calc(100% - 1rem)",overflowY:"auto",overflowX:"auto",height:"calc(100% - 4rem)"},children:(0,a.jsxs)(p.A,{"aria-labelledby":"selection-table-title",size:"small","aria-label":"Selection table",children:[(0,a.jsx)(EnhancedTableHead,{headCells:e.headCells,order:n,orderBy:o,onRequestSort:N}),(0,a.jsx)(m.A,{children:P.sort(function(e,a){return(0,i.A)(this,t),M(e[o],a[o],H,n)}.bind(this)).slice(I*T.l,I*T.l+T.l).map(function(n,l){var r=this;return(0,i.A)(this,t),(0,a.jsx)(C.A,{id:`selection-table-row-${l}`,hover:!0,onClick:function onClick(e){return(0,i.A)(this,r),w(e,n)}.bind(this),tabIndex:-1,children:e.headCells.map(function(e,t){return(0,i.A)(this,r),(0,a.jsx)(g.A,{id:`selection-table-row-${l}-cell-${e.id}`,align:"number"===e.type?"right":"left",children:(o=e.type,d=n[e.name],null==d||"null"===d?(0,a.jsx)(D,{variant:"filled",color:"secondary",label:(0,y.Tl)(`data.${String(d)}`)}):"date"===o||"datetime"===o?JMap.Util.Date.format(d,{displayTime:"datetime"===o}):"string"===o&&s._t.test(d)?(0,a.jsx)("a",{href:d,target:"_blank",children:d}):String(d))},t);var o,d}.bind(this))},l)}.bind(this))})]})}),P.length>T.l&&(0,a.jsx)(x.A,{id:"selection-table-pagination",component:"div",count:P.length,rowsPerPage:T.l,page:I,onPageChange:_,labelRowsPerPage:(0,y.Tl)("row.per.page")})]})});var H=void 0;const J=function SelectionPageFn(e){return(0,i.A)(this,H),(0,a.jsx)(o.A,{theme:e.theme,children:(0,a.jsx)(I,{})})}.bind(void 0),$=(0,d.Ng)(function(e){return(0,i.A)(this,H),{theme:e.external[s.sZ].ui.theme}}.bind(void 0))(J),z=function SelectionPage(){return(0,i.A)(this,H),(0,a.jsx)(d.Kq,{store:JMap.getDataStore(),children:(0,a.jsx)($,{})})}.bind(void 0);function startSelectionPage(){var e=this;window.addEventListener("beforeunload",function(){(0,i.A)(this,e),JMap.Application.Selection.closeTableTab()}.bind(this));r.H(document.body).render((0,a.jsx)(l.StrictMode,{children:(0,a.jsx)(z,{})}))}}}]);