@geops/rvf-mobility-web-component 0.1.62 → 0.1.64

package/CHANGELOG.md

@@ -2,6 +2,51 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.1.64](https://github.com/geops/rvf-mobility-web-component/compare/v0.1.63...v0.1.64) (2025-10-14)
+
+
+### Bug Fixes
+
+* use pixels to keep the size big ([32f42d9](https://github.com/geops/rvf-mobility-web-component/commit/32f42d9b61fb8f4fd988f8b994318106ad3d7c01))
+
+### [0.1.63](https://github.com/geops/rvf-mobility-web-component/compare/v0.1.61...v0.1.63) (2025-10-13)
+
+
+### Features
+
+* add lnp highlight and link component ([5cd87b6](https://github.com/geops/rvf-mobility-web-component/commit/5cd87b6f424f1440ffcc2c747e7ae6f89d1cfe0e))
+* add notifications web component ([#34](https://github.com/geops/rvf-mobility-web-component/issues/34)) ([4fdf9d8](https://github.com/geops/rvf-mobility-web-component/commit/4fdf9d8b5351053b241b976477de1ab587191580)), closes [#28](https://github.com/geops/rvf-mobility-web-component/issues/28)
+* clear properly the state ([718dec6](https://github.com/geops/rvf-mobility-web-component/commit/718dec62f4db3ff6a9d03a6be6f5e03522c09a1d))
+* **MapsetLayer:** add parameters to add a mapset layer ([35b9a67](https://github.com/geops/rvf-mobility-web-component/commit/35b9a67a2955099707db733170bee83521c0ecb1))
+* **MapsetLayer:** add parameters to add a mapset layer ([0651c0e](https://github.com/geops/rvf-mobility-web-component/commit/0651c0e591a8460587dc8a127b4ff96c98a64a19))
+
+
+### Bug Fixes
+
+* activate use of graph bbox parameter ([#25](https://github.com/geops/rvf-mobility-web-component/issues/25)) ([56960a1](https://github.com/geops/rvf-mobility-web-component/commit/56960a18c672e3ad7a7e76096222d4547a5d5ad2))
+* add highlight lnp features ([93ed570](https://github.com/geops/rvf-mobility-web-component/commit/93ed5702733379c4059e45a63d23eb78fc11021a))
+* avoid empty array ([3732bbe](https://github.com/geops/rvf-mobility-web-component/commit/3732bbee22064135ef01866ea9870a0cf15f0fc3))
+* avoid undefined layer comparaison ([60652b1](https://github.com/geops/rvf-mobility-web-component/commit/60652b196c3798e3a9fad049b6a9bade4ad31401))
+* deactivate graphs ([24c96d0](https://github.com/geops/rvf-mobility-web-component/commit/24c96d0861c462508cc13e1c7f819059b9433ee7))
+* fix click on features ([529b71c](https://github.com/geops/rvf-mobility-web-component/commit/529b71c799e6016b815cd2d1f3aeb6a36b3198b2))
+* fix css ([6cec249](https://github.com/geops/rvf-mobility-web-component/commit/6cec249106447ba2095f1049edd0499e827f5d5f))
+* fix highlight von mobility point ([4d7616c](https://github.com/geops/rvf-mobility-web-component/commit/4d7616c56dcbd4d759f626418bc7a20bf7b9c755))
+* fix pointer events on menus ([f83ba3c](https://github.com/geops/rvf-mobility-web-component/commit/f83ba3c1674fa23515b68b4e6044623b5e902e41))
+* fix pointer-events ([a81a1fc](https://github.com/geops/rvf-mobility-web-component/commit/a81a1fc18ae0b21238e726452f9a81488fecfaac))
+* get more infos about station and cluster ([18cd22c](https://github.com/geops/rvf-mobility-web-component/commit/18cd22cdde580ba22c5a54a13d6644ae8a3ab497))
+* load mor feature infos only when necessary ([1b7b4cb](https://github.com/geops/rvf-mobility-web-component/commit/1b7b4cb63fc9142ed873c9f3301e4fc05dd7396e))
+* **MapsetLayer:** only fetch kmls if layer is visible ([d1272c0](https://github.com/geops/rvf-mobility-web-component/commit/d1272c054174ced5c6203d5e3ec43b6a1596bf82))
+* **MapsetLayer:** reload plans on pan/zoom ([0a45a0c](https://github.com/geops/rvf-mobility-web-component/commit/0a45a0c93242450c9d5ec9d44ca7199f9f49dd9a))
+* merge upstream and add tests for default values ([7cf94f1](https://github.com/geops/rvf-mobility-web-component/commit/7cf94f1d9a46d8d38a25bb1b4294bc0e530adcff))
+* ordered the layer tree ([fbefac7](https://github.com/geops/rvf-mobility-web-component/commit/fbefac70df808b992f144b875e09a8d7ae8a6266))
+* reduc copyright font size ([a0fa433](https://github.com/geops/rvf-mobility-web-component/commit/a0fa433d4c77786d26dbbdb446c5811a0ae004a8))
+* reduc copyright font size ([8b3875c](https://github.com/geops/rvf-mobility-web-component/commit/8b3875c72c65251981dafb0293f6a61c2aabce67))
+* use a fix layer order in layertree ([4a5fe10](https://github.com/geops/rvf-mobility-web-component/commit/4a5fe10f3dc8fb8bcb7d862b30199fb0a2634025))
+* use good filter ([66840ef](https://github.com/geops/rvf-mobility-web-component/commit/66840efb733435dbc421fb7420d2761654b4d8e6))
+* use proper filter ([ee26cb4](https://github.com/geops/rvf-mobility-web-component/commit/ee26cb46e785e279e51112f0361d0f54351b4fbb))
+* use proper filter ([543d682](https://github.com/geops/rvf-mobility-web-component/commit/543d682436e42ea4b788b73b1634fe823b144d22))
+* use proper template ([c5ea26b](https://github.com/geops/rvf-mobility-web-component/commit/c5ea26b7d0300fa26f24ace8ba146683bb471fa6))
+
 ### [0.1.62](https://github.com/geops/rvf-mobility-web-component/compare/v0.1.61...v0.1.62) (2025-10-13)
 
 

package/index.js

@@ -3087,14 +3087,14 @@ ${String(r)}`)}catch(t){return t}},T$=r=>{if(typeof r!="object"||r===null)throw
       display: none;
     }
   }
-  .\\@lg\\:min-w-64 {
+  .\\@lg\\:min-w-80 {
     @container (min-width: 32rem) {
-      min-width: calc(var(--spacing) * 64);
+      min-width: calc(var(--spacing) * 80);
     }
   }
-  .\\@lg\\:min-w-80 {
+  .\\@lg\\:min-w-\\[320px\\] {
     @container (min-width: 32rem) {
-      min-width: calc(var(--spacing) * 80);
+      min-width: 320px;
     }
   }
   .\\@lg\\/main\\:flex-row-reverse {
@@ -3514,7 +3514,7 @@ html {
             --tw-drop-shadow: initial;
             --tw-duration: initial;
             --tw-ease: initial;
-        }`}),W("style",{children:_A}),W("style",{children:MX}),W(jM.Provider,{value:O5,children:W(PF.Provider,{value:Z5,children:[W(aB,{}),W(BF,{replaceState:r1}),W(uB,{node:t.current,wcAttributes:r}),W(iP,{eventNode:t.current}),W(jF,{}),W(eB,{}),W("div",{className:"@container/main relative size-full overflow-hidden font-sans",ref:t,style:zp1,children:W("div",{className:"relative flex size-full flex-col text-base @lg/main:flex-row-reverse",children:[W(lB,{className:"relative flex-1 overflow-visible",children:[W(qM,{...Rp1}),d&&W(YM,{}),J&&W(pB,{}),W(zF,{}),g1&&W(EF,{...Dp1}),W(qF,{minZoom:10,...Ie}),W(UF,{}),W(DF,{}),E&&W(sB,{}),V&&W(AB,{}),W(RF,{}),W(NF,{}),Ze&&W(FF,{className:"absolute inset-x-2 bottom-8 z-10"}),W("div",{className:"pointer-events-none absolute inset-x-2 bottom-2 z-10 flex items-end justify-between gap-2 text-[10px]",children:[W(QF,{className:"bg-slate-50/70"}),W(KM,{className:"pointer-events-auto bg-slate-50/70",options:vt})]}),W("div",{className:"absolute top-2 right-2 z-10 flex",children:C&&W(mg,{title:"Geolokalisierung"})}),W("div",{className:"absolute right-2 bottom-10 z-10 flex flex-col justify-between gap-2",children:W(aP,{})}),!G1&&z1&&W("div",{className:Pe("absolute top-2 right-2 left-2 z-10 max-w-96",H2&&"@lg:left-68"),children:W(Gc,{})})]}),W("div",{className:"pointer-events-none absolute top-2 bottom-2 left-2 z-10 flex flex-col gap-2",children:[G1&&W("div",{className:"pointer-events-none relative z-10 w-fit rounded-2xl bg-black/10 p-0 backdrop-blur-sm *:pointer-events-auto",children:[z1&&W("div",{className:Pe("absolute top-12 left-0 w-0 p-0 opacity-0 transition-all @sm:top-0 @sm:left-[calc(100%-43px)] @md:left-[calc(100%-47px)]",P2?"w-64 opacity-100":""),children:W(Gc,{className:"border-grey @container m-0 h-[40px] rounded-2xl border p-2 px-4 text-base @sm/main:h-[44px] @sm/main:rounded-l-none @sm/main:rounded-r-2xl @md/main:h-[48px]",inputClassName:"h-6 text-base",inputContainerClassName:"border-none",resultClassName:"text-base  **:hover:cursor-pointer hover:text-red-500 p-2",resultsContainerClassName:"@container rounded-b-2xl max-h-[200px] overflow-y-auto border border-grey border-t-0 ",withResultsClassName:"text-base !rounded-b-none"})}),W("div",{className:Pe("border-grey relative flex gap-[1px] overflow-hidden rounded-2xl border @sm/main:h-[44px] @md/main:h-[48px]","*:size-[38px] *:rounded-none *:border-none *:@sm/main:size-[42px] *:@md/main:!size-[46px]","*:first:!rounded-l-2xl","*:last:!rounded-r-2xl",P2?"@sm:rounded-r-none @sm:border-r-0 @sm:*:last:!rounded-r-none @sm:*:last:border-r-0":""),children:[b1&&W(tB,{}),p2&&W(GF,{}),j1&&W(oB,{}),z1&&W(HF,{})]})]}),W("div",{className:Pe("pointer-events-none flex w-0 flex-1 flex-col overflow-hidden rounded-2xl",H2?"@lg:min-w-64":"p-0"),style:{containerType:"normal"},children:W(Bg,{className:"border-grey @container/overlay pointer-events-auto relative hidden flex-col overflow-hidden rounded-2xl border bg-white text-base shadow-lg @lg:flex",ScrollableHandlerProps:SX,children:W(Py,{hasDetails:N,hasLayerTree:j1,hasPrint:b1,hasRealtime:g1,hasSearch:!1,hasShare:p2})})})]}),W(Bg,{className:H2?"absolute bottom-0 z-20 flex max-h-[70%] min-h-[75px] w-full flex-col border-t bg-white @lg:hidden":"@lg:hidden",ScrollableHandlerProps:SX,children:W(Py,{hasDetails:N,hasLayerTree:j1,hasPrint:b1,hasRealtime:g1,hasSearch:!1,hasShare:p2})})]})})]})})]})}var sP={};Object.entries(bh).forEach(([r])=>{sP[r]=bh[r].defaultValue||null});function Op1(r){let{permalinktemplate:t}=r,{permalinktemplate:e}=sP,i=LX(t||e);return W(kp1,{...sP,...r,...i})}var Oy=Ct(Op1);var Zp1='<a href="https://developer.geops.io/">geOps API key</a>',EX='<a href="https://geops.com/en/solution/disruption-information">geOps MOCO API</a>',Np1={apikey:{defaultValue:"5cc87b12d7c5370001c1d655820abcc37dfd4d968d7bab5b2a74a935",description:`Your ${Zp1}`,public:!1},lang:{defaultValue:"de",description:"The language to use for the notifications.",public:!1},notificationat:{description:"An ISO date string used to display active notification at this date in the notification layer. If not defined the current date will be used.<br/>Ex: 2025-08-01T00:00:00Z .",public:!1},notificationtenant:{defaultValue:"rvf",description:`The ${EX} tenant to get the notification from.`,public:!1},notificationurl:{defaultValue:"https://moco.geops.io/api/v2/",description:`The ${EX} url to use.`,public:!1}},xA=Np1;function Up1({apikey:r,lang:t,notificationtenant:e,notificationurl:i}){let[o,n]=Pt([]);return it(()=>{new Ld({apiKey:r||void 0,tenant:e,url:i}).export({contentMedium:!0,graph:"np_topo4,np_topo5,np_topo6,np_topo7,np_topo8,np_topo9,np_topo10,np_topo11,np_topo12,np_topo13,np_topo14,np_topo15,osm",hasGeoms:!0,publicAt:"2025-10-10T10:03:31.650Z"}).then(l=>{l?.paginatedSituations?.results&&n(l.paginatedSituations.results)}).catch(l=>{console.error(l)})},[r,i,e]),it(()=>{cl.locale(t)},[t]),W(fc.Provider,{value:cl,children:[W("style",{children:_A}),W("div",{className:"flex w-full flex-col gap-6",children:o?.map(l=>W(Qp,{canToggle:!0,headerClassName:"text-rvf-h3 font-semibold",iconClassName:"w-8 h-8 text-red",reasonClassName:"hidden",situation:l,timeIntervalClassName:"pl-1 text-base py-3 font-semibold text-balance",useShortMonth:!1},l.id))})]})}var TX={};Object.entries(xA).forEach(([r])=>{TX[r]=xA[r].defaultValue||null});function Qp1(r){return W(Up1,{...TX,...r})}var lP=Ct(Qp1);var Hp1='<a href="https://developer.geops.io/">geOps API key</a>',ul='<a href="https://developer.geops.io/apis/stops">geOps Stops API</a>',Vp1={apikey:{description:`Your ${Hp1}`},bbox:{description:`The extent where to search the stops (minx,miny,maxx,maxy). See the ${ul} documentation.`},countrycode:{description:"The country code to filter the results (IT, DE, CH ...)"},event:{defaultValue:"mwc:stopssearchselect",description:"The event's name to listen to when a stop is selected."},field:{description:`Which field to look up, default all of them, Possible values:id, name, coords. See the ${ul} documentation.`},limit:{defaultValue:"5",description:`The number of suggestions to show. See the ${ul} documentation.`},mots:{description:`Commas separated list of mots used to filter the results (rail, bus, coach, foot, tram, subway, gondola, funicular, ferry, car). See the ${ul} documentation.`},onselect:{description:null},params:{description:`JSON string with additional parameters to pass to the request to the API. Ex: {"{ 'key': 'value' }"}. See the ${ul} documentation.`},prefagencies:{description:`comma seperated list, order chooses which agency will be preferred as
+        }`}),W("style",{children:_A}),W("style",{children:MX}),W(jM.Provider,{value:O5,children:W(PF.Provider,{value:Z5,children:[W(aB,{}),W(BF,{replaceState:r1}),W(uB,{node:t.current,wcAttributes:r}),W(iP,{eventNode:t.current}),W(jF,{}),W(eB,{}),W("div",{className:"@container/main relative size-full overflow-hidden font-sans",ref:t,style:zp1,children:W("div",{className:"relative flex size-full flex-col text-base @lg/main:flex-row-reverse",children:[W(lB,{className:"relative flex-1 overflow-visible",children:[W(qM,{...Rp1}),d&&W(YM,{}),J&&W(pB,{}),W(zF,{}),g1&&W(EF,{...Dp1}),W(qF,{minZoom:10,...Ie}),W(UF,{}),W(DF,{}),E&&W(sB,{}),V&&W(AB,{}),W(RF,{}),W(NF,{}),Ze&&W(FF,{className:"absolute inset-x-2 bottom-8 z-10"}),W("div",{className:"pointer-events-none absolute inset-x-2 bottom-2 z-10 flex items-end justify-between gap-2 text-[10px]",children:[W(QF,{className:"bg-slate-50/70"}),W(KM,{className:"pointer-events-auto bg-slate-50/70",options:vt})]}),W("div",{className:"absolute top-2 right-2 z-10 flex",children:C&&W(mg,{title:"Geolokalisierung"})}),W("div",{className:"absolute right-2 bottom-10 z-10 flex flex-col justify-between gap-2",children:W(aP,{})}),!G1&&z1&&W("div",{className:Pe("absolute top-2 right-2 left-2 z-10 max-w-96",H2&&"@lg:left-68"),children:W(Gc,{})})]}),W("div",{className:"pointer-events-none absolute top-2 bottom-2 left-2 z-10 flex flex-col gap-2",children:[G1&&W("div",{className:"pointer-events-none relative z-10 w-fit rounded-2xl bg-black/10 p-0 backdrop-blur-sm *:pointer-events-auto",children:[z1&&W("div",{className:Pe("absolute top-12 left-0 w-0 p-0 opacity-0 transition-all @sm:top-0 @sm:left-[calc(100%-43px)] @md:left-[calc(100%-47px)]",P2?"w-64 opacity-100":""),children:W(Gc,{className:"border-grey @container m-0 h-[40px] rounded-2xl border p-2 px-4 text-base @sm/main:h-[44px] @sm/main:rounded-l-none @sm/main:rounded-r-2xl @md/main:h-[48px]",inputClassName:"h-6 text-base",inputContainerClassName:"border-none",resultClassName:"text-base  **:hover:cursor-pointer hover:text-red-500 p-2",resultsContainerClassName:"@container rounded-b-2xl max-h-[200px] overflow-y-auto border border-grey border-t-0 ",withResultsClassName:"text-base !rounded-b-none"})}),W("div",{className:Pe("border-grey relative flex gap-[1px] overflow-hidden rounded-2xl border @sm/main:h-[44px] @md/main:h-[48px]","*:size-[38px] *:rounded-none *:border-none *:@sm/main:size-[42px] *:@md/main:!size-[46px]","*:first:!rounded-l-2xl","*:last:!rounded-r-2xl",P2?"@sm:rounded-r-none @sm:border-r-0 @sm:*:last:!rounded-r-none @sm:*:last:border-r-0":""),children:[b1&&W(tB,{}),p2&&W(GF,{}),j1&&W(oB,{}),z1&&W(HF,{})]})]}),W("div",{className:Pe("pointer-events-none flex w-0 flex-1 flex-col overflow-hidden rounded-2xl",H2?"@lg:min-w-[320px]":"p-0"),style:{containerType:"normal"},children:W(Bg,{className:"border-grey @container/overlay pointer-events-auto relative hidden flex-col overflow-hidden rounded-2xl border bg-white text-base shadow-lg @lg:flex",ScrollableHandlerProps:SX,children:W(Py,{hasDetails:N,hasLayerTree:j1,hasPrint:b1,hasRealtime:g1,hasSearch:!1,hasShare:p2})})})]}),W(Bg,{className:H2?"absolute bottom-0 z-20 flex max-h-[70%] min-h-[75px] w-full flex-col border-t bg-white @lg:hidden":"@lg:hidden",ScrollableHandlerProps:SX,children:W(Py,{hasDetails:N,hasLayerTree:j1,hasPrint:b1,hasRealtime:g1,hasSearch:!1,hasShare:p2})})]})})]})})]})}var sP={};Object.entries(bh).forEach(([r])=>{sP[r]=bh[r].defaultValue||null});function Op1(r){let{permalinktemplate:t}=r,{permalinktemplate:e}=sP,i=LX(t||e);return W(kp1,{...sP,...r,...i})}var Oy=Ct(Op1);var Zp1='<a href="https://developer.geops.io/">geOps API key</a>',EX='<a href="https://geops.com/en/solution/disruption-information">geOps MOCO API</a>',Np1={apikey:{defaultValue:"5cc87b12d7c5370001c1d655820abcc37dfd4d968d7bab5b2a74a935",description:`Your ${Zp1}`,public:!1},lang:{defaultValue:"de",description:"The language to use for the notifications.",public:!1},notificationat:{description:"An ISO date string used to display active notification at this date in the notification layer. If not defined the current date will be used.<br/>Ex: 2025-08-01T00:00:00Z .",public:!1},notificationtenant:{defaultValue:"rvf",description:`The ${EX} tenant to get the notification from.`,public:!1},notificationurl:{defaultValue:"https://moco.geops.io/api/v2/",description:`The ${EX} url to use.`,public:!1}},xA=Np1;function Up1({apikey:r,lang:t,notificationtenant:e,notificationurl:i}){let[o,n]=Pt([]);return it(()=>{new Ld({apiKey:r||void 0,tenant:e,url:i}).export({contentMedium:!0,graph:"np_topo4,np_topo5,np_topo6,np_topo7,np_topo8,np_topo9,np_topo10,np_topo11,np_topo12,np_topo13,np_topo14,np_topo15,osm",hasGeoms:!0,publicAt:"2025-10-10T10:03:31.650Z"}).then(l=>{l?.paginatedSituations?.results&&n(l.paginatedSituations.results)}).catch(l=>{console.error(l)})},[r,i,e]),it(()=>{cl.locale(t)},[t]),W(fc.Provider,{value:cl,children:[W("style",{children:_A}),W("div",{className:"flex w-full flex-col gap-6",children:o?.map(l=>W(Qp,{canToggle:!0,headerClassName:"text-rvf-h3 font-semibold",iconClassName:"w-8 h-8 text-red",reasonClassName:"hidden",situation:l,timeIntervalClassName:"pl-1 text-base py-3 font-semibold text-balance",useShortMonth:!1},l.id))})]})}var TX={};Object.entries(xA).forEach(([r])=>{TX[r]=xA[r].defaultValue||null});function Qp1(r){return W(Up1,{...TX,...r})}var lP=Ct(Qp1);var Hp1='<a href="https://developer.geops.io/">geOps API key</a>',ul='<a href="https://developer.geops.io/apis/stops">geOps Stops API</a>',Vp1={apikey:{description:`Your ${Hp1}`},bbox:{description:`The extent where to search the stops (minx,miny,maxx,maxy). See the ${ul} documentation.`},countrycode:{description:"The country code to filter the results (IT, DE, CH ...)"},event:{defaultValue:"mwc:stopssearchselect",description:"The event's name to listen to when a stop is selected."},field:{description:`Which field to look up, default all of them, Possible values:id, name, coords. See the ${ul} documentation.`},limit:{defaultValue:"5",description:`The number of suggestions to show. See the ${ul} documentation.`},mots:{description:`Commas separated list of mots used to filter the results (rail, bus, coach, foot, tram, subway, gondola, funicular, ferry, car). See the ${ul} documentation.`},onselect:{description:null},params:{description:`JSON string with additional parameters to pass to the request to the API. Ex: {"{ 'key': 'value' }"}. See the ${ul} documentation.`},prefagencies:{description:`comma seperated list, order chooses which agency will be preferred as
         ident_source (for id and code fields). Possible values: sbb, db. See the ${ul} documentation.`},reflocation:{description:`Coordinates in WGS84 (in lat,lon order) used to rank stops close to this position higher. See the ${ul} documentation.`},url:{defaultValue:"https://api.geops.io/stops/v1/",description:`The URL to the ${ul}.`}},wA=Vp1;function Gp1(r){return W(fc.Provider,{value:cl,children:[W("style",{children:_A}),W(aL,{...r})]})}var IX={};Object.entries(wA).forEach(([r])=>{IX[r]=wA[r].defaultValue||null});function jp1(r){return W(Gp1,{...IX,...r})}var cP=Ct(jp1);NL(Oy,"geops-mobility",Object.keys(bh),{mode:"open",shadow:!0});NL(cP,"geops-mobility-search",Object.keys(wA),{mode:"open",shadow:!0});NL(lP,"geops-mobility-notifications",Object.keys(xA),{mode:"open",shadow:!0});})();
 /*! Bundled license information:
 

package/package.json

@@ -2,7 +2,7 @@
   "name": "@geops/rvf-mobility-web-component",
   "license": "UNLICENSED",
   "description": "Web components for rvf in the domains of mobility and logistics.",
-  "version": "0.1.62",
+  "version": "0.1.64",
   "homepage": "https://rvf-mobility-web-component-geops.vercel.app/",
   "type": "module",
   "main": "index.js",

package/src/RvfMobilityMap/RvfMobilityMap.tsx

@@ -559,7 +559,7 @@ function RvfMobilityMap(props: RvfMobilityMapProps) {
                 <div
                   className={twMerge(
                     "pointer-events-none flex w-0 flex-1 flex-col overflow-hidden rounded-2xl",
-                    isOverlayOpen ? "@lg:min-w-64" : "p-0",
+                    isOverlayOpen ? "@lg:min-w-[320px]" : "p-0",
                   )}
                   style={{ containerType: "normal" }}
                 >