@tedi-design-system/react 19.1.0-rc.2 → 19.1.0-rc.20

package/src/community/components/map-components/base-map-selection/base-map-option.es.js

@@ -1,75 +1,73 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import k from "../../../../../external/classnames/index.es.js";
-import { useRef as C, useState as w, useEffect as z } from "react";
-import { Icon as B } from "../../../../tedi/components/base/icon/icon.es.js";
-import t from "./base-map-selection.module.scss.es.js";
-import { useElementSize as D } from "../../../../tedi/helpers/hooks/use-element-size.es.js";
-import { Tooltip as s } from "../../../../tedi/components/overlays/tooltip/tooltip.es.js";
-const M = (b) => {
+import { jsxs as l, jsx as t, Fragment as B } from "react/jsx-runtime";
+import S from "../../../../../external/classnames/index.es.js";
+import { useRef as z, useState as E, useEffect as M } from "react";
+import { Icon as W } from "../../../../tedi/components/base/icon/icon.es.js";
+import { Button as j } from "../../../../tedi/components/buttons/button/button.es.js";
+import e from "./base-map-selection.module.scss.es.js";
+import { useElementSize as k } from "../../../../tedi/helpers/hooks/use-element-size.es.js";
+import { Tooltip as d } from "../../../../tedi/components/overlays/tooltip/tooltip.es.js";
+const C = (h) => {
   const {
-    title: r,
-    content: u,
-    selected: d,
-    onSelect: n,
-    type: c = "selection",
-    className: h,
-    id: y,
-    multiple: _,
-    disabled: o,
-    tooltipText: m,
+    title: o,
+    content: b,
+    selected: c,
+    onSelect: s,
+    type: m = "selection",
+    className: _,
+    id: N,
+    multiple: y,
+    disabled: r,
+    tooltipText: i,
     tooltipType: p = "info"
-  } = b, a = C(null), x = D(a), [N, T] = w(!1);
-  z(() => {
-    const i = a.current;
-    i && T(i.scrollWidth > i.clientWidth);
-  }, [x, r]);
-  const g = () => {
-    o || n == null || n();
-  }, v = (i) => {
-    o || (i.key === "Enter" || i.key === " ") && (i.preventDefault(), n == null || n());
-  }, E = k(
-    t["tedi-base-map-selection__wrapper"],
-    d && t["tedi-base-map-selection--selected"],
-    c && t[`tedi-base-map-selection--${c}`],
-    _ && t["tedi-base-map-selection--multiple"],
-    o && t["tedi-base-map-selection--disabled"],
-    h
-  ), f = /* @__PURE__ */ e("div", { ref: a, tabIndex: -1, className: t["tedi-base-map-selection__title"], children: r }), I = N ? /* @__PURE__ */ l(s, { children: [
-    /* @__PURE__ */ e(s.Trigger, { children: f }),
-    /* @__PURE__ */ e(s.Content, { children: r })
-  ] }) : f;
-  return /* @__PURE__ */ l(
-    "div",
+  } = h, n = z(null), T = k(n), [f, g] = E(!1);
+  M(() => {
+    const a = n.current;
+    a && g(a.scrollWidth > a.clientWidth);
+  }, [T, o]);
+  const v = () => {
+    r || s == null || s();
+  }, x = S(
+    e["tedi-base-map-selection__wrapper"],
+    c && e["tedi-base-map-selection--selected"],
+    m && e[`tedi-base-map-selection--${m}`],
+    y && e["tedi-base-map-selection--multiple"],
+    r && e["tedi-base-map-selection--disabled"],
+    _
+  ), u = /* @__PURE__ */ l(
+    j,
     {
-      role: "button",
-      tabIndex: o ? -1 : 0,
-      "aria-pressed": !!d,
-      "aria-disabled": o || void 0,
-      onClick: g,
-      onKeyDown: v,
-      className: E,
-      id: y,
+      noStyle: !0,
+      disabled: r && !i,
+      "aria-pressed": !!c,
+      "aria-disabled": r || void 0,
+      onClick: v,
+      className: x,
+      id: N,
       children: [
-        /* @__PURE__ */ e("div", { "aria-hidden": !0, className: t["tedi-base-map-selection__content"], children: u }),
-        m && /* @__PURE__ */ l(s, { children: [
-          /* @__PURE__ */ e(s.Trigger, { children: /* @__PURE__ */ e("span", { tabIndex: -1, className: t["tedi-base-map-selection__info"], children: /* @__PURE__ */ e(
-            B,
-            {
-              background: "brand-secondary",
-              name: p === "error" ? "error" : "info",
-              size: 16,
-              color: p === "error" ? "danger" : "brand"
-            }
-          ) }) }),
-          /* @__PURE__ */ e(s.Content, { children: m })
-        ] }),
-        I
+        /* @__PURE__ */ t("div", { "aria-hidden": !0, className: e["tedi-base-map-selection__content"], children: b }),
+        i && /* @__PURE__ */ t("span", { className: e["tedi-base-map-selection__info"], children: /* @__PURE__ */ t(
+          W,
+          {
+            background: "brand-secondary",
+            name: p === "error" ? "error" : "info",
+            size: 16,
+            color: p === "error" ? "danger" : "brand"
+          }
+        ) }),
+        /* @__PURE__ */ t("div", { ref: n, className: e["tedi-base-map-selection__title"], children: o })
       ]
     }
   );
+  return !i && !f ? u : /* @__PURE__ */ l(d, { ariaHidden: !i, openWith: "hover", children: [
+    /* @__PURE__ */ t(d.Trigger, { children: u }),
+    /* @__PURE__ */ t(d.Content, { children: i ? /* @__PURE__ */ l(B, { children: [
+      f && /* @__PURE__ */ t("div", { "aria-hidden": !0, children: o }),
+      i
+    ] }) : o })
+  ] });
 };
-M.displayName = "BaseMapOption";
+C.displayName = "BaseMapOption";
 export {
-  M as BaseMapOption,
-  M as default
+  C as BaseMapOption,
+  C as default
 };

package/src/community/components/map-components/base-map-selection/base-map-selection.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),N=require("../../../../../external/classnames/index.cjs.js"),S=require("react"),B=require("../../../../tedi/components/buttons/button/button.cjs.js"),T=require("../../../../tedi/components/form/field/field.cjs.js"),O=require("../../../../tedi/components/form/input-group/input-group.cjs.js"),C=require("../../../../tedi/components/form/slider/slider.cjs.js"),f=require("./base-map-option.cjs.js"),n=require("./base-map-selection.module.scss.cjs.js"),l=require("../../../../tedi/components/overlays/popover/popover.cjs.js"),L=require("../../../../tedi/components/form/input-group/components/input/input.cjs.js"),P=require("../../../../tedi/components/form/input-group/components/suffix/suffix.cjs.js"),c=a=>{const t=Number(a);return Number.isNaN(t)?0:Math.min(100,Math.max(0,t))};function o(a){const{title:t,content:x,children:h,multiple:y=!1,showTransparency:j=!1,transparency:d,defaultTransparency:_,onTransparencyChange:s,transparencyLabel:r="",id:i}=a,p=d!==void 0,[v,g]=S.useState(()=>c(_??0)),u=c(p?d:v),m=M=>{const b=c(M);p||g(b),s==null||s(b)},q=N.default(n.default["tedi-base-map-selection__wrapper"],n.default["tedi-base-map-selection__trigger"],n.default["tedi-base-map-selection--button"],y&&n.default["tedi-base-map-selection--multiple"]);return e.jsxs(l.Popover,{placement:"top-end",children:[e.jsx(l.Popover.Trigger,{children:e.jsxs(B.Button,{noStyle:!0,id:i,className:q,children:[e.jsx("div",{className:n.default["tedi-base-map-selection__content"],"aria-hidden":!0,children:x}),e.jsx("div",{className:n.default["tedi-base-map-selection__title"],children:t})]})}),e.jsxs(l.Popover.Content,{width:"medium",children:[e.jsx("div",{className:n.default["tedi-base-map-selection__options"],children:h}),j&&e.jsx("div",{className:n.default["tedi-base-map-selection__transparency"],children:e.jsx(C.Slider,{label:r,"aria-label":r||"Transparency",min:0,max:100,value:u,onChange:m,minLabel:"0%",maxLabel:"100%",addonRight:e.jsx("div",{className:n.default["tedi-base-map-selection__transparency-field"],children:e.jsxs(O.InputGroupBase,{id:`${i}-transparency`,label:r||"Transparency",hideLabel:!0,children:[e.jsx(L.Input,{children:e.jsx(T.Field,{type:"number",id:`${i}-transparency`,value:String(u),onChange:m})}),e.jsx(P.Suffix,{children:"%"})]})})})})]})]})}o.Option=f.BaseMapOption;o.displayName="BaseMapSelection";exports.BaseMapOption=f.BaseMapOption;exports.BaseMapSelection=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),C=require("../../../../../external/classnames/index.cjs.js"),h=require("react"),I=require("../../../../tedi/components/buttons/button/button.cjs.js"),P=require("../../../../tedi/components/form/field/field.cjs.js"),R=require("../../../../tedi/components/form/input-group/input-group.cjs.js"),k=require("../../../../tedi/components/form/slider/slider.cjs.js"),G=require("../map-button/map-button.cjs.js"),x=require("./base-map-option.cjs.js"),t=require("./base-map-selection.module.scss.cjs.js"),$=require("../../../../tedi/providers/label-provider/use-labels.cjs.js"),f=require("../../../../tedi/helpers/hooks/use-breakpoint.cjs.js"),r=require("../../../../tedi/components/overlays/popover/popover.cjs.js"),z=require("../../../../tedi/components/form/input-group/components/input/input.cjs.js"),D=require("../../../../tedi/components/form/input-group/components/suffix/suffix.cjs.js"),o=s=>{const n=Number(s);return Number.isNaN(n)?0:Math.min(100,Math.max(0,n))};function l(s){const{title:n,content:y,children:j,multiple:g=!1,showTransparency:q=!1,transparency:c,defaultTransparency:M,onTransparencyChange:i,id:a}=s,{getLabel:B}=$.useLabels(),S=f.isBreakpointBelow(f.default(),"md"),[v,_]=h.useState(!1),u=B("baseMapSelection.transparency"),d=c!==void 0,[N,L]=h.useState(()=>o(M??0)),p=o(d?c:N),m=w=>{const b=o(w);d||L(b),i==null||i(b)},O=C.default(t.default["tedi-base-map-selection__wrapper"],t.default["tedi-base-map-selection--button"],g&&t.default["tedi-base-map-selection--multiple"]),T=S?e.jsx(G.MapButton,{id:a,icon:"map",showDropdownIndicator:!0,hideLabel:!0,iconSize:24,tooltipContent:null,selected:v,children:n}):e.jsxs(I.Button,{noStyle:!0,id:a,className:O,children:[e.jsx("div",{className:t.default["tedi-base-map-selection__content"],"aria-hidden":!0,children:y}),e.jsx("div",{className:t.default["tedi-base-map-selection__title"],children:n})]});return e.jsxs(r.Popover,{placement:"top-start",onToggle:_,children:[e.jsx(r.Popover.Trigger,{children:T}),e.jsxs(r.Popover.Content,{width:"medium",children:[e.jsx("div",{className:t.default["tedi-base-map-selection__options"],children:j}),q&&e.jsx("div",{className:t.default["tedi-base-map-selection__transparency"],children:e.jsx(k.Slider,{"aria-label":u,min:0,max:100,value:p,onChange:m,minLabel:"0%",maxLabel:"100%",addonRight:e.jsx("div",{className:t.default["tedi-base-map-selection__transparency-field"],children:e.jsxs(R.InputGroupBase,{id:`${a}-transparency`,label:u,hideLabel:!0,children:[e.jsx(z.Input,{children:e.jsx(P.Field,{type:"number",id:`${a}-transparency`,value:String(p),onChange:m})}),e.jsx(D.Suffix,{children:"%"})]})})})})]})]})}l.Option=x.BaseMapOption;l.displayName="BaseMapSelection";exports.BaseMapOption=x.BaseMapOption;exports.BaseMapSelection=l;

package/src/community/components/map-components/base-map-selection/base-map-selection.d.ts

@@ -15,6 +15,7 @@ export interface BaseMapSelectionProps {
     children: React.ReactNode;
     /**
      * Renders a "stacked" trigger, indicating that multiple base maps are available.
+     * Has no effect below the `md` breakpoint, where the trigger is a `MapButton`.
      * @default false
      */
     multiple?: boolean;
@@ -37,10 +38,6 @@ export interface BaseMapSelectionProps {
      * Callback fired when the transparency value changes. The reported value is always clamped to 0-100.
      */
     onTransparencyChange?: (value: number) => void;
-    /**
-     * Label for the transparency slider.
-     */
-    transparencyLabel?: string;
     /**
      * HTML `id` attribute applied to the trigger button.
      */

package/src/community/components/map-components/base-map-selection/base-map-selection.es.js

@@ -1,80 +1,80 @@
-import { jsxs as t, jsx as e } from "react/jsx-runtime";
-import B from "../../../../../external/classnames/index.es.js";
-import { useState as M } from "react";
-import { Button as C } from "../../../../tedi/components/buttons/button/button.es.js";
-import { Field as L } from "../../../../tedi/components/form/field/field.es.js";
-import { InputGroupBase as w } from "../../../../tedi/components/form/input-group/input-group.es.js";
-import { Slider as j } from "../../../../tedi/components/form/slider/slider.es.js";
-import { BaseMapOption as I } from "./base-map-option.es.js";
-import a from "./base-map-selection.module.scss.es.js";
-import { Popover as l } from "../../../../tedi/components/overlays/popover/popover.es.js";
-import { Input as O } from "../../../../tedi/components/form/input-group/components/input/input.es.js";
-import { Suffix as $ } from "../../../../tedi/components/form/input-group/components/suffix/suffix.es.js";
-const c = (r) => {
-  const n = Number(r);
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import O from "../../../../../external/classnames/index.es.js";
+import { useState as h } from "react";
+import { Button as j } from "../../../../tedi/components/buttons/button/button.es.js";
+import { Field as k } from "../../../../tedi/components/form/field/field.es.js";
+import { InputGroupBase as $ } from "../../../../tedi/components/form/input-group/input-group.es.js";
+import { Slider as z } from "../../../../tedi/components/form/slider/slider.es.js";
+import { MapButton as D } from "../map-button/map-button.es.js";
+import { BaseMapOption as E } from "./base-map-option.es.js";
+import t from "./base-map-selection.module.scss.es.js";
+import { useLabels as F } from "../../../../tedi/providers/label-provider/use-labels.es.js";
+import G, { isBreakpointBelow as P } from "../../../../tedi/helpers/hooks/use-breakpoint.es.js";
+import { Popover as s } from "../../../../tedi/components/overlays/popover/popover.es.js";
+import { Input as R } from "../../../../tedi/components/form/input-group/components/input/input.es.js";
+import { Suffix as U } from "../../../../tedi/components/form/input-group/components/suffix/suffix.es.js";
+const l = (i) => {
+  const n = Number(i);
   return Number.isNaN(n) ? 0 : Math.min(100, Math.max(0, n));
 };
-function f(r) {
+function b(i) {
   const {
     title: n,
-    content: b,
-    children: y,
-    multiple: _ = !1,
-    showTransparency: N = !1,
-    transparency: m,
-    defaultTransparency: g,
-    onTransparencyChange: i,
-    transparencyLabel: s = "",
-    id: o
-  } = r, p = m !== void 0, [v, x] = M(
-    () => c(g ?? 0)
-  ), d = c(p ? m : v), u = (S) => {
-    const h = c(S);
-    p || x(h), i == null || i(h);
-  }, T = B(
-    a["tedi-base-map-selection__wrapper"],
-    a["tedi-base-map-selection__trigger"],
-    a["tedi-base-map-selection--button"],
-    _ && a["tedi-base-map-selection--multiple"]
-  );
-  return /* @__PURE__ */ t(l, { placement: "top-end", children: [
-    /* @__PURE__ */ e(l.Trigger, { children: /* @__PURE__ */ t(C, { noStyle: !0, id: o, className: T, children: [
-      /* @__PURE__ */ e("div", { className: a["tedi-base-map-selection__content"], "aria-hidden": !0, children: b }),
-      /* @__PURE__ */ e("div", { className: a["tedi-base-map-selection__title"], children: n })
-    ] }) }),
-    /* @__PURE__ */ t(l.Content, { width: "medium", children: [
-      /* @__PURE__ */ e("div", { className: a["tedi-base-map-selection__options"], children: y }),
-      N && /* @__PURE__ */ e("div", { className: a["tedi-base-map-selection__transparency"], children: /* @__PURE__ */ e(
-        j,
+    content: y,
+    children: g,
+    multiple: N = !1,
+    showTransparency: _ = !1,
+    transparency: c,
+    defaultTransparency: B,
+    onTransparencyChange: o,
+    id: a
+  } = i, { getLabel: v } = F(), x = P(G(), "md"), [M, S] = h(!1), p = v("baseMapSelection.transparency"), m = c !== void 0, [L, T] = h(
+    () => l(B ?? 0)
+  ), d = l(m ? c : L), u = (I) => {
+    const f = l(I);
+    m || T(f), o == null || o(f);
+  }, w = O(
+    t["tedi-base-map-selection__wrapper"],
+    t["tedi-base-map-selection--button"],
+    N && t["tedi-base-map-selection--multiple"]
+  ), C = x ? /* @__PURE__ */ e(D, { id: a, icon: "map", showDropdownIndicator: !0, hideLabel: !0, iconSize: 24, tooltipContent: null, selected: M, children: n }) : /* @__PURE__ */ r(j, { noStyle: !0, id: a, className: w, children: [
+    /* @__PURE__ */ e("div", { className: t["tedi-base-map-selection__content"], "aria-hidden": !0, children: y }),
+    /* @__PURE__ */ e("div", { className: t["tedi-base-map-selection__title"], children: n })
+  ] });
+  return /* @__PURE__ */ r(s, { placement: "top-start", onToggle: S, children: [
+    /* @__PURE__ */ e(s.Trigger, { children: C }),
+    /* @__PURE__ */ r(s.Content, { width: "medium", children: [
+      /* @__PURE__ */ e("div", { className: t["tedi-base-map-selection__options"], children: g }),
+      _ && /* @__PURE__ */ e("div", { className: t["tedi-base-map-selection__transparency"], children: /* @__PURE__ */ e(
+        z,
         {
-          label: s,
-          "aria-label": s || "Transparency",
+          "aria-label": p,
           min: 0,
           max: 100,
           value: d,
           onChange: u,
           minLabel: "0%",
           maxLabel: "100%",
-          addonRight: /* @__PURE__ */ e("div", { className: a["tedi-base-map-selection__transparency-field"], children: /* @__PURE__ */ t(w, { id: `${o}-transparency`, label: s || "Transparency", hideLabel: !0, children: [
-            /* @__PURE__ */ e(O, { children: /* @__PURE__ */ e(
-              L,
+          addonRight: /* @__PURE__ */ e("div", { className: t["tedi-base-map-selection__transparency-field"], children: /* @__PURE__ */ r($, { id: `${a}-transparency`, label: p, hideLabel: !0, children: [
+            /* @__PURE__ */ e(R, { children: /* @__PURE__ */ e(
+              k,
               {
                 type: "number",
-                id: `${o}-transparency`,
+                id: `${a}-transparency`,
                 value: String(d),
                 onChange: u
               }
             ) }),
-            /* @__PURE__ */ e($, { children: "%" })
+            /* @__PURE__ */ e(U, { children: "%" })
           ] }) })
         }
       ) })
     ] })
   ] });
 }
-f.Option = I;
-f.displayName = "BaseMapSelection";
+b.Option = E;
+b.displayName = "BaseMapSelection";
 export {
-  I as BaseMapOption,
-  f as BaseMapSelection
+  E as BaseMapOption,
+  b as BaseMapSelection
 };

package/src/community/components/map-components/carousel/carousel.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),i=require("../../../../../external/classnames/index.cjs.js"),c=require("react"),d=require("../../../../tedi/components/buttons/floating-button/floating-button.cjs.js"),e=require("./carousel.module.scss.cjs.js"),y=u=>{const{itemCountShown:l,children:_,className:f}=u,[s,n]=c.useState(0),o=c.Children.toArray(_),r=o.length,m=()=>{s+l<r&&n(a=>a+1)},x=()=>{s>0&&n(a=>a-1)},v=`translateX(-${100/l*s}%)`;return t.jsxs("div",{className:`${e.default["tedi-carousel__wrapper"]} ${f??""}`,children:[t.jsx(d.FloatingButton,{className:i.default(e.default["tedi-carousel__navigation-button"],e.default["tedi-carousel__prev"]),onClick:x,visualType:"secondary",disabled:s===0,icon:"west",children:"Prev"}),t.jsx("div",{className:e.default["tedi-carousel__viewport"],children:t.jsx("div",{className:e.default["tedi-carousel__carousel-track"],style:{transform:v},children:o.map((a,h)=>t.jsx("div",{className:e.default["tedi-carousel__item"],style:{flex:`0 0 ${100/l}%`},children:a},h))})}),t.jsx(d.FloatingButton,{className:i.default(e.default["tedi-carousel__navigation-button"],e.default["tedi-carousel__next"]),onClick:m,visualType:"secondary",disabled:s+l>=r,icon:"east",children:"Next"})]})};exports.Carousel=y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),i=require("../../../../../external/classnames/index.cjs.js"),c=require("react"),d=require("../../../../tedi/components/buttons/floating-button/floating-button.cjs.js"),y=require("../../../../tedi/helpers/warn-deprecated/warn-deprecated.cjs.js"),e=require("./carousel.module.scss.cjs.js"),p=u=>{y.warnDeprecated("Community Carousel","Use `Carousel` from `@tedi-design-system/react/tedi` instead.");const{itemCountShown:l,children:m,className:f}=u,[s,r]=c.useState(0),n=c.Children.toArray(m),o=n.length,_=()=>{s+l<o&&r(a=>a+1)},x=()=>{s>0&&r(a=>a-1)},v=`translateX(-${100/l*s}%)`;return t.jsxs("div",{className:`${e.default["tedi-carousel__wrapper"]} ${f??""}`,children:[t.jsx(d.FloatingButton,{className:i.default(e.default["tedi-carousel__navigation-button"],e.default["tedi-carousel__prev"]),onClick:x,visualType:"secondary",disabled:s===0,icon:"west",children:"Prev"}),t.jsx("div",{className:e.default["tedi-carousel__viewport"],children:t.jsx("div",{className:e.default["tedi-carousel__carousel-track"],style:{transform:v},children:n.map((a,h)=>t.jsx("div",{className:e.default["tedi-carousel__item"],style:{flex:`0 0 ${100/l}%`},children:a},h))})}),t.jsx(d.FloatingButton,{className:i.default(e.default["tedi-carousel__navigation-button"],e.default["tedi-carousel__next"]),onClick:_,visualType:"secondary",disabled:s+l>=o,icon:"east",children:"Next"})]})};exports.Carousel=p;

package/src/community/components/map-components/carousel/carousel.es.js

@@ -1,19 +1,21 @@
-import { jsxs as f, jsx as a } from "react/jsx-runtime";
-import c from "../../../../../external/classnames/index.es.js";
-import N, { useState as x } from "react";
-import { FloatingButton as n } from "../../../../tedi/components/buttons/floating-button/floating-button.es.js";
+import { jsxs as v, jsx as a } from "react/jsx-runtime";
+import n from "../../../../../external/classnames/index.es.js";
+import y, { useState as N } from "react";
+import { FloatingButton as c } from "../../../../tedi/components/buttons/floating-button/floating-button.es.js";
+import { warnDeprecated as x } from "../../../../tedi/helpers/warn-deprecated/warn-deprecated.es.js";
 import e from "./carousel.module.scss.es.js";
-const $ = (d) => {
-  const { itemCountShown: o, children: m, className: u } = d, [t, l] = x(0), r = N.Children.toArray(m), i = r.length, _ = () => {
-    t + o < i && l((s) => s + 1);
+const I = (d) => {
+  x("Community Carousel", "Use `Carousel` from `@tedi-design-system/react/tedi` instead.");
+  const { itemCountShown: r, children: m, className: u } = d, [t, o] = N(0), i = y.Children.toArray(m), l = i.length, _ = () => {
+    t + r < l && o((s) => s + 1);
   }, p = () => {
-    t > 0 && l((s) => s - 1);
-  }, h = `translateX(-${100 / o * t}%)`;
-  return /* @__PURE__ */ f("div", { className: `${e["tedi-carousel__wrapper"]} ${u ?? ""}`, children: [
+    t > 0 && o((s) => s - 1);
+  }, f = `translateX(-${100 / r * t}%)`;
+  return /* @__PURE__ */ v("div", { className: `${e["tedi-carousel__wrapper"]} ${u ?? ""}`, children: [
     /* @__PURE__ */ a(
-      n,
+      c,
       {
-        className: c(e["tedi-carousel__navigation-button"], e["tedi-carousel__prev"]),
+        className: n(e["tedi-carousel__navigation-button"], e["tedi-carousel__prev"]),
         onClick: p,
         visualType: "secondary",
         disabled: t === 0,
@@ -21,14 +23,14 @@ const $ = (d) => {
         children: "Prev"
       }
     ),
-    /* @__PURE__ */ a("div", { className: e["tedi-carousel__viewport"], children: /* @__PURE__ */ a("div", { className: e["tedi-carousel__carousel-track"], style: { transform: h }, children: r.map((s, v) => /* @__PURE__ */ a("div", { className: e["tedi-carousel__item"], style: { flex: `0 0 ${100 / o}%` }, children: s }, v)) }) }),
+    /* @__PURE__ */ a("div", { className: e["tedi-carousel__viewport"], children: /* @__PURE__ */ a("div", { className: e["tedi-carousel__carousel-track"], style: { transform: f }, children: i.map((s, h) => /* @__PURE__ */ a("div", { className: e["tedi-carousel__item"], style: { flex: `0 0 ${100 / r}%` }, children: s }, h)) }) }),
     /* @__PURE__ */ a(
-      n,
+      c,
       {
-        className: c(e["tedi-carousel__navigation-button"], e["tedi-carousel__next"]),
+        className: n(e["tedi-carousel__navigation-button"], e["tedi-carousel__next"]),
         onClick: _,
         visualType: "secondary",
-        disabled: t + o >= i,
+        disabled: t + r >= l,
         icon: "east",
         children: "Next"
       }
@@ -36,5 +38,5 @@ const $ = (d) => {
   ] });
 };
 export {
-  $ as Carousel
+  I as Carousel
 };

package/src/community/components/map-components/map-button/map-button.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),m=require("../../../../../external/classnames/index.cjs.js"),B=require("react"),S=require("../../../../tedi/components/base/icon/icon.cjs.js"),N=require("../../../../tedi/components/loaders/spinner/spinner.cjs.js"),O=require("../../../../tedi/components/buttons/button/button.cjs.js"),d=require("../map-dropdown/map-dropdown.cjs.js"),t=require("./map-button.module.scss.cjs.js"),l=require("../../../../tedi/components/overlays/tooltip/tooltip.cjs.js"),b=f=>{const{size:n="default",icon:r,selected:h=!1,className:x,children:u,hideLabel:c=!1,tooltipContent:p=u,dropdownItems:i,isActive:j,isHovered:g,underline:q,isLoading:s,...v}=f,[_,w]=B.useState(!1),D=h||_,M=m.default(t.default["tedi-map-button"],t.default[`tedi-map-button--${n}`],D&&t.default["tedi-map-button--selected"],i&&t.default["tedi-map-button--dropdown"],j&&t.default["tedi-map-button--is-active"],g&&t.default["tedi-map-button--is-hovered"],q&&t.default["tedi-map-button--underline"],s&&t.default["tedi-map-button--loading"],x),C=e.jsxs(e.Fragment,{children:[s?e.jsx(N.Spinner,{size:n==="small"?16:18,className:t.default["tedi-map-button__icon"]}):r&&e.jsx(S.Icon,{name:r,className:t.default["tedi-map-button__icon"],size:n==="small"?24:18}),!c&&e.jsx("div",{className:m.default(t.default["tedi-map-button__text"]),children:u})]}),a=e.jsx(O.Button,{noStyle:!0,isLoading:s,className:M,size:n,...v,children:C}),T=c&&p?e.jsxs(l.Tooltip,{placement:"right",children:[e.jsx(l.Tooltip.Trigger,{children:a}),e.jsx(l.Tooltip.Content,{children:p})]}):a;return i?e.jsxs(d.MapDropdown,{onOpenChange:w,placement:"right-start",children:[e.jsx(d.MapDropdown.Trigger,{children:a}),e.jsx(d.MapDropdown.Content,{items:i.map(o=>({children:o.children,onClick:o.onClick,isActive:o.isActive,isDisabled:o.isDisabled}))})]}):T};exports.MapButton=b;exports.default=b;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),b=require("../../../../../external/classnames/index.cjs.js"),h=require("react"),y=require("../../../../tedi/components/base/icon/icon.cjs.js"),O=require("../../../../tedi/components/loaders/spinner/spinner.cjs.js"),A=require("../../../../tedi/components/buttons/button/button.cjs.js"),l=require("../map-dropdown/map-dropdown.cjs.js"),t=require("./map-button.module.scss.cjs.js"),d=require("../../../../tedi/components/overlays/tooltip/tooltip.cjs.js"),u=h.forwardRef((x,j)=>{const{size:n="default",icon:c,selected:g=!1,className:w,children:i,hideLabel:p=!1,tooltipContent:m=i,dropdownItems:s,showDropdownIndicator:v=!1,isActive:q,isHovered:D,underline:M,isLoading:a,iconSize:f,..._}=x,[S,B]=h.useState(!1),C=g||S,N=b.default(t.default["tedi-map-button"],t.default[`tedi-map-button--${n}`],C&&t.default["tedi-map-button--selected"],(s||v)&&t.default["tedi-map-button--dropdown"],q&&t.default["tedi-map-button--is-active"],D&&t.default["tedi-map-button--is-hovered"],M&&t.default["tedi-map-button--underline"],a&&t.default["tedi-map-button--loading"],w),T=()=>f||(n==="small"?24:18),z=e.jsxs(e.Fragment,{children:[a?e.jsx(O.Spinner,{size:n==="small"?16:18,className:t.default["tedi-map-button__icon"]}):c&&e.jsx(y.Icon,{name:c,className:t.default["tedi-map-button__icon"],size:T()}),p?e.jsx("span",{className:"sr-only",children:i}):e.jsx("div",{className:b.default(t.default["tedi-map-button__text"]),children:i})]}),r=e.jsx(A.Button,{noStyle:!0,isLoading:a,className:N,size:n,..._,ref:j,children:z}),I=p&&m?e.jsxs(d.Tooltip,{placement:"right",children:[e.jsx(d.Tooltip.Trigger,{children:r}),e.jsx(d.Tooltip.Content,{children:m})]}):r;return s?e.jsxs(l.MapDropdown,{onOpenChange:B,placement:"right-start",children:[e.jsx(l.MapDropdown.Trigger,{children:r}),e.jsx(l.MapDropdown.Content,{items:s.map(o=>({children:o.children,onClick:o.onClick,isActive:o.isActive,isDisabled:o.isDisabled}))})]}):I});u.displayName="MapButton";exports.MapButton=u;exports.default=u;

package/src/community/components/map-components/map-button/map-button.d.ts

@@ -1,5 +1,4 @@
-import { JSX } from 'react';
-import { ButtonProps } from '../../../../tedi';
+import { ButtonProps, IconSize } from '../../../../tedi';
 import { MapDropdownItem } from '../map-dropdown/map-dropdown';
 /**
  * Button props that don't apply to MapButton because it renders `<Button noStyle>` with its own
@@ -25,7 +24,7 @@ export interface MapButtonProps extends Omit<ButtonProps, OmittedButtonProps> {
     selected?: boolean;
     /**
      * If `true`, hides the label visually (icon-only button).
-     * Label may still be available to screen readers.
+     * The label stays in the accessible name, so `children` is required for the button to be named.
      */
     hideLabel?: boolean;
     /**
@@ -38,6 +37,15 @@ export interface MapButtonProps extends Omit<ButtonProps, OmittedButtonProps> {
      * When provided, the button can toggle a dropdown menu.
      */
     dropdownItems?: MapDropdownItem[];
+    /**
+     * Renders the dropdown indicator arrow in the bottom-right corner without wiring up a dropdown.
+     * @default false
+     */
+    showDropdownIndicator?: boolean;
+    /**
+     * Size of the icon displayed on the button.
+     */
+    iconSize?: IconSize;
 }
-export declare const MapButton: (props: MapButtonProps) => JSX.Element;
+export declare const MapButton: import('react').ForwardRefExoticComponent<Omit<MapButtonProps, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
 export default MapButton;

package/src/community/components/map-components/map-button/map-button.es.js

@@ -1,50 +1,52 @@
-import { jsxs as a, Fragment as z, jsx as e } from "react/jsx-runtime";
+import { jsxs as l, Fragment as A, jsx as e } from "react/jsx-runtime";
 import b from "../../../../../external/classnames/index.es.js";
-import { useState as A } from "react";
-import { Icon as I } from "../../../../tedi/components/base/icon/icon.es.js";
-import { Spinner as M } from "../../../../tedi/components/loaders/spinner/spinner.es.js";
-import { Button as O } from "../../../../tedi/components/buttons/button/button.es.js";
-import { MapDropdown as l } from "../map-dropdown/map-dropdown.es.js";
+import { forwardRef as O, useState as j } from "react";
+import { Icon as k } from "../../../../tedi/components/base/icon/icon.es.js";
+import { Spinner as E } from "../../../../tedi/components/loaders/spinner/spinner.es.js";
+import { Button as L } from "../../../../tedi/components/buttons/button/button.es.js";
+import { MapDropdown as d } from "../map-dropdown/map-dropdown.es.js";
 import t from "./map-button.module.scss.es.js";
-import { Tooltip as d } from "../../../../tedi/components/overlays/tooltip/tooltip.es.js";
-const q = (h) => {
+import { Tooltip as m } from "../../../../tedi/components/overlays/tooltip/tooltip.es.js";
+const F = O((h, g) => {
   const {
     size: o = "default",
-    icon: m,
-    selected: f = !1,
-    className: g,
-    children: c,
+    icon: c,
+    selected: v = !1,
+    className: w,
+    children: i,
     hideLabel: p = !1,
-    tooltipContent: u = c,
-    dropdownItems: i,
-    isActive: v,
-    isHovered: C,
-    underline: N,
-    isLoading: s,
+    tooltipContent: u = i,
+    dropdownItems: s,
+    showDropdownIndicator: N = !1,
+    isActive: C,
+    isHovered: D,
+    underline: S,
+    isLoading: r,
+    iconSize: f,
     ..._
-  } = h, [w, D] = A(!1), x = f || w, B = b(
+  } = h, [z, B] = j(!1), I = v || z, x = b(
     t["tedi-map-button"],
     t[`tedi-map-button--${o}`],
-    x && t["tedi-map-button--selected"],
-    i && t["tedi-map-button--dropdown"],
-    v && t["tedi-map-button--is-active"],
-    C && t["tedi-map-button--is-hovered"],
-    N && t["tedi-map-button--underline"],
-    s && t["tedi-map-button--loading"],
-    g
-  ), S = /* @__PURE__ */ a(z, { children: [
-    s ? /* @__PURE__ */ e(M, { size: o === "small" ? 16 : 18, className: t["tedi-map-button__icon"] }) : m && /* @__PURE__ */ e(I, { name: m, className: t["tedi-map-button__icon"], size: o === "small" ? 24 : 18 }),
-    !p && /* @__PURE__ */ e("div", { className: b(t["tedi-map-button__text"]), children: c })
-  ] }), r = /* @__PURE__ */ e(O, { noStyle: !0, isLoading: s, className: B, size: o, ..._, children: S }), T = p && u ? /* @__PURE__ */ a(d, { placement: "right", children: [
-    /* @__PURE__ */ e(d.Trigger, { children: r }),
-    /* @__PURE__ */ e(d.Content, { children: u })
-  ] }) : r;
-  return i ? /* @__PURE__ */ a(l, { onOpenChange: D, placement: "right-start", children: [
-    /* @__PURE__ */ e(l.Trigger, { children: r }),
+    I && t["tedi-map-button--selected"],
+    (s || N) && t["tedi-map-button--dropdown"],
+    C && t["tedi-map-button--is-active"],
+    D && t["tedi-map-button--is-hovered"],
+    S && t["tedi-map-button--underline"],
+    r && t["tedi-map-button--loading"],
+    w
+  ), y = () => f || (o === "small" ? 24 : 18), M = /* @__PURE__ */ l(A, { children: [
+    r ? /* @__PURE__ */ e(E, { size: o === "small" ? 16 : 18, className: t["tedi-map-button__icon"] }) : c && /* @__PURE__ */ e(k, { name: c, className: t["tedi-map-button__icon"], size: y() }),
+    p ? /* @__PURE__ */ e("span", { className: "sr-only", children: i }) : /* @__PURE__ */ e("div", { className: b(t["tedi-map-button__text"]), children: i })
+  ] }), a = /* @__PURE__ */ e(L, { noStyle: !0, isLoading: r, className: x, size: o, ..._, ref: g, children: M }), T = p && u ? /* @__PURE__ */ l(m, { placement: "right", children: [
+    /* @__PURE__ */ e(m.Trigger, { children: a }),
+    /* @__PURE__ */ e(m.Content, { children: u })
+  ] }) : a;
+  return s ? /* @__PURE__ */ l(d, { onOpenChange: B, placement: "right-start", children: [
+    /* @__PURE__ */ e(d.Trigger, { children: a }),
     /* @__PURE__ */ e(
-      l.Content,
+      d.Content,
       {
-        items: i.map((n) => ({
+        items: s.map((n) => ({
           children: n.children,
           onClick: n.onClick,
           isActive: n.isActive,
@@ -53,8 +55,9 @@ const q = (h) => {
       }
     )
   ] }) : T;
-};
+});
+F.displayName = "MapButton";
 export {
-  q as MapButton,
-  q as default
+  F as MapButton,
+  F as default
 };

package/src/community/components/map-components/map-dropdown/map-dropdown.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),o=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),j=require("../../../../../external/classnames/index.cjs.js"),r=require("react"),l=require("./map-dropdown.module.scss.cjs.js"),te=require("../../../../tedi/providers/label-provider/use-labels.cjs.js"),ne=require("../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),D=require("../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),q=({children:a})=>a,E=({items:a,children:x})=>null,p=a=>{const{children:x,onItemClick:f,closeMenuOnClick:N=!0,onOpenChange:g,placement:R="bottom-start",layout:I="column",isOpen:m,sameWidth:O=!1,className:A}=a,{initialFocus:S=-1,modal:b=!1,...y}=a.focusManager??{},{getLabel:T}=te.useLabels(),{visuallyHiddenDismiss:L=b?T("close"):!1}=y??{},U=o.useFloatingNodeId(),M=r.useRef([]),[W,w]=r.useState(!1),v=m!==void 0?m:W,[_,K]=r.useState(null);let u=[],P=null,i=null;if(r.Children.forEach(x,e=>{if(r.isValidElement(e)){if(e.type===q)i=e.props.children;else if(e.type===E){const n=e.props,{items:t,children:c}=n;Array.isArray(t)&&t.every(h=>typeof h=="object"&&h!==null&&"children"in h)?u=t:c&&(P=c)}}}),!i)throw new Error("Dropdown must have a Dropdown.Trigger child");const k={name:"sameWidth",fn:({rects:e,elements:n})=>{const t=e.reference.width;return n.floating.style.width=`${t}px`,{data:{width:t}}}},{x:B,y:H,strategy:V,refs:F,placement:$,context:d}=o.useFloating({placement:R,nodeId:U,open:v,onOpenChange:e=>{m===void 0&&w(e),g==null||g(e)},middleware:[...O?[k]:[],D.flip(),D.shift(),D.offset(5)],whileElementsMounted:ne.autoUpdate}),z=u.findIndex(e=>e.isActive),{getReferenceProps:G,getFloatingProps:J,getItemProps:Q}=o.useInteractions([o.useClick(d),o.useListNavigation(d,{listRef:M,activeIndex:_,selectedIndex:z,onNavigate:K,loop:!0}),o.useRole(d,{role:"listbox"}),o.useDismiss(d,{outsidePress:e=>!(e.target instanceof Element&&e.target.closest("[data-floating-ui-portal]")),escapeKey:!1,referencePress:!1})]),X=()=>v?s.jsx(o.FloatingFocusManager,{context:d,initialFocus:S,visuallyHiddenDismiss:L,modal:b,...y,children:s.jsx("div",{...J({ref:F.setFloating,style:{position:V,left:B??0,top:H??0},className:j.default(l.default["tedi-map-dropdown"],{[l.default["tedi-map-dropdown--row"]]:I==="row",[l.default["tedi-map-dropdown--column"]]:I==="column"},A),onKeyDown(n){n.key==="Tab"&&w(!1)}}),"data-placement":$,children:u.length>0?u.map((n,t)=>Z(n,t)):P})}):null,Y=e=>j.default(l.default["tedi-map-dropdown__item"],{[l.default["tedi-map-dropdown__item--active"]]:e.isActive,[l.default["tedi-map-dropdown__item--disabled"]]:e.isDisabled}),C=(e,n,t)=>{var c;f==null||f(e,n,t),(c=e==null?void 0:e.onClick)==null||c.call(e,t),N&&w(!1)},Z=(e,n)=>s.jsx("button",{...Q({disabled:e.isDisabled,tabIndex:_===n?0:-1,role:"option",className:Y(e),onClick:t=>C(e,n,t),onKeyDown(t){t.key==="Enter"&&C(e,n,t)},ref(t){M.current[n]=t}}),children:e.children},n),ee=i?r.cloneElement(i,{...G({ref:F.setReference,tabIndex:0,...i.props})}):null;return s.jsxs(s.Fragment,{children:[ee,s.jsx(o.FloatingPortal,{children:X()})]})};p.Trigger=q;p.Content=E;exports.MapDropdown=p;exports.default=p;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),o=require("../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),F=require("../../../../../external/classnames/index.cjs.js"),l=require("react"),ne=require("../../../../tedi/helpers/get-element-ref.cjs.js"),a=require("./map-dropdown.module.scss.cjs.js"),oe=require("../../../../tedi/providers/label-provider/use-labels.cjs.js"),se=require("../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),D=require("../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),q=({children:i})=>i,C=({items:i,children:x})=>null,p=i=>{const{children:x,onItemClick:f,closeMenuOnClick:j=!0,onOpenChange:g,placement:N="bottom-start",layout:I="column",isOpen:m,sameWidth:O=!1,className:A}=i,{initialFocus:S=-1,modal:b=!1,...M}=i.focusManager??{},{getLabel:T}=oe.useLabels(),{visuallyHiddenDismiss:L=b?T("close"):!1}=M??{},U=o.useFloatingNodeId(),y=l.useRef([]),[W,w]=l.useState(!1),v=m!==void 0?m:W,[R,K]=l.useState(null);let u=[],_=null,s=null;if(l.Children.forEach(x,e=>{if(l.isValidElement(e)){if(e.type===q)s=e.props.children;else if(e.type===C){const n=e.props,{items:t,children:c}=n;Array.isArray(t)&&t.every(h=>typeof h=="object"&&h!==null&&"children"in h)?u=t:c&&(_=c)}}}),!s)throw new Error("Dropdown must have a Dropdown.Trigger child");const k={name:"sameWidth",fn:({rects:e,elements:n})=>{const t=e.reference.width;return n.floating.style.width=`${t}px`,{data:{width:t}}}},{x:B,y:H,strategy:V,refs:P,placement:$,context:d}=o.useFloating({placement:N,nodeId:U,open:v,onOpenChange:e=>{m===void 0&&w(e),g==null||g(e)},middleware:[...O?[k]:[],D.flip(),D.shift(),D.offset(5)],whileElementsMounted:se.autoUpdate}),z=u.findIndex(e=>e.isActive),{getReferenceProps:G,getFloatingProps:J,getItemProps:Q}=o.useInteractions([o.useClick(d),o.useListNavigation(d,{listRef:y,activeIndex:R,selectedIndex:z,onNavigate:K,loop:!0}),o.useRole(d,{role:"listbox"}),o.useDismiss(d,{outsidePress:e=>!(e.target instanceof Element&&e.target.closest("[data-floating-ui-portal]")),escapeKey:!1,referencePress:!1})]),X=o.useMergeRefs([P.setReference,s?ne.getElementRef(s):null]),Y=()=>v?r.jsx(o.FloatingFocusManager,{context:d,initialFocus:S,visuallyHiddenDismiss:L,modal:b,...M,children:r.jsx("div",{...J({ref:P.setFloating,style:{position:V,left:B??0,top:H??0},className:F.default(a.default["tedi-map-dropdown"],{[a.default["tedi-map-dropdown--row"]]:I==="row",[a.default["tedi-map-dropdown--column"]]:I==="column"},A),onKeyDown(n){n.key==="Tab"&&w(!1)}}),"data-placement":$,children:u.length>0?u.map((n,t)=>ee(n,t)):_})}):null,Z=e=>F.default(a.default["tedi-map-dropdown__item"],{[a.default["tedi-map-dropdown__item--active"]]:e.isActive,[a.default["tedi-map-dropdown__item--disabled"]]:e.isDisabled}),E=(e,n,t)=>{var c;f==null||f(e,n,t),(c=e==null?void 0:e.onClick)==null||c.call(e,t),j&&w(!1)},ee=(e,n)=>r.jsx("button",{...Q({disabled:e.isDisabled,tabIndex:R===n?0:-1,role:"option",className:Z(e),onClick:t=>E(e,n,t),onKeyDown(t){t.key==="Enter"&&E(e,n,t)},ref(t){y.current[n]=t}}),children:e.children},n),te=s?l.cloneElement(s,G({tabIndex:0,...s.props,ref:X})):null;return r.jsxs(r.Fragment,{children:[te,r.jsx(o.FloatingPortal,{children:Y()})]})};p.Trigger=q;p.Content=C;exports.MapDropdown=p;exports.default=p;