@solid-design-system/components 4.4.2 → 4.5.0

package/cdn/chunks/chunk.YBNWPLWL.js

@@ -0,0 +1 @@
+import{a as i}from"./chunk.HE2LNCWW.js";import{a as l,b as m}from"./chunk.5ZILM4TA.js";import{a as n}from"./chunk.26V4EXHB.js";import{a as h,b as a,h as c}from"./chunk.5AILWWY2.js";import{b as v,f as s}from"./chunk.IRWHG2Q4.js";import{e}from"./chunk.TJOCV4DC.js";var t=class extends c{constructor(){super(...arguments);this.variant="main";this.state="default";this.animated=!1;this.notInteractive=!1;this.href="";this.label="";this.marker={cluster:s`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50"><circle cx="25" cy="25" opacity="1" r="20"/><circle cx="25" cy="25" opacity=".3" r="25"/></svg>`,main:s`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 75"><path d="M51 49A29 29 0 0 0 30 0 29 29 0 0 0 9 49l21 22 21-22Z"/><circle cx="30" cy="28" r="10" fill="#fff"/></svg>`,place:s`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 75"><path fill-rule="evenodd" d="M51 49A29 29 0 0 0 30 0 29 29 0 0 0 9 49l21 22 21-22Z" clip-rule="evenodd"/></svg>`}}handleBlur(){this.emit("sd-blur")}handleFocus(){this.emit("sd-focus")}isLink(){return!!this.href}render(){let r=this.isLink(),o=this.notInteractive?l`div`:r?l`a`:l`button`;return m`<${o} part="base" class="${n("flex justify-center",!this.notInteractive&&"focus:outline focus:outline-2 focus:outline-primary focus:outline-offset-2")}" href="${i(r?this.href:void 0)}" target="${i(r?this.target:void 0)}" @blur="${this.handleBlur}" @focus="${this.handleFocus}" role="${i(this.notInteractive||r?void 0:"button")}" aria-label="${i(!this.notInteractive&&this.label?this.label:void 0)}" aria-labelledby="${i(!this.notInteractive&&!this.label?"content":void 0)}"><div part="marker" class="${n("inline-flex",this.animated&&(this.variant==="main"||this.variant==="place")&&"animate-bounce-once",this.variant==="cluster"&&this.state==="hover"&&"scale-110 fill-primary-500",this.variant==="cluster"&&!this.notInteractive&&"transition-all duration-200 ease-in-out hover:scale-110 hover:fill-primary-500",this.variant==="main"&&this.state==="hover"&&"fill-accent-550",this.variant==="main"&&this.state==="active"&&"fill-accent-700",this.variant==="main"&&!this.notInteractive&&"hover:fill-accent-550 active:fill-accent-700",this.variant==="place"&&this.state==="default"&&"fill-white",this.variant==="place"&&this.state==="hover"&&"fill-primary-100",this.variant==="place"&&this.state==="active"&&"fill-primary-200",this.variant==="place"&&!this.notInteractive&&"hover:fill-primary-100",{cluster:"fill-primary",main:"fill-accent",place:""}[this.variant])}">${this.marker[this.variant]}</div><div id="content" part="content" class="${n("absolute self-center pointer-events-none",this.variant==="cluster"&&"font-bold text-white")}"><slot></slot></div></${o}>`}};t.styles=[...c.styles,v`:host{display:block}:host([variant=cluster]) [part=base],svg{width:calc(var(--sd-spacing-12,3rem)*var(--map-marker-scaling,1))}:host([variant=cluster]) [part=base]{height:calc(var(--sd-spacing-12,3rem)*var(--map-marker-scaling,1))}:host(:not([variant=cluster])) [part=base]{height:calc(var(--sd-spacing-16,4rem)*var(--map-marker-scaling,1))}:host([variant=cluster]) [part=content]{font-size:calc(var(--sd-font-size-sm,.875rem)*var(--map-marker-scaling,1))}:host([variant=place]) [part=content]{font-size:calc(var(--sd-font-size-3xl,2rem)*var(--map-marker-scaling,1));margin-top:calc(var(--sd-spacing-2,.5rem)*-1)}:host([variant=main]) [part=marker],:host([variant=place]) [part=marker]{--tw-drop-shadow:drop-shadow(var(--sd-shadow,0px 1px 3px #515151));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}`],e([a({reflect:!0})],t.prototype,"variant",2),e([a({reflect:!0})],t.prototype,"state",2),e([a({type:Boolean,reflect:!0})],t.prototype,"animated",2),e([a({type:Boolean,reflect:!0,attribute:"not-interactive"})],t.prototype,"notInteractive",2),e([a()],t.prototype,"href",2),e([a()],t.prototype,"target",2),e([a()],t.prototype,"label",2),t=e([h("sd-map-marker")],t);export{t as a};

package/cdn/components/map-marker/map-marker.d.ts

@@ -7,6 +7,7 @@ export default class SdMapMarker extends SolidElement {
     notInteractive: boolean;
     href: string;
     target: '_blank' | '_parent' | '_self' | '_top';
+    label: string;
     private handleBlur;
     private handleFocus;
     private isLink;

package/cdn/components/map-marker/map-marker.js

@@ -1 +1 @@
-import{a}from"../../chunks/chunk.4QAJB6AU.js";import"../../chunks/chunk.HE2LNCWW.js";import"../../chunks/chunk.5ZILM4TA.js";import"../../chunks/chunk.26V4EXHB.js";import"../../chunks/chunk.5AILWWY2.js";import"../../chunks/chunk.IRWHG2Q4.js";import"../../chunks/chunk.TJOCV4DC.js";export{a as default};
+import{a}from"../../chunks/chunk.YBNWPLWL.js";import"../../chunks/chunk.HE2LNCWW.js";import"../../chunks/chunk.5ZILM4TA.js";import"../../chunks/chunk.26V4EXHB.js";import"../../chunks/chunk.5AILWWY2.js";import"../../chunks/chunk.IRWHG2Q4.js";import"../../chunks/chunk.TJOCV4DC.js";export{a as default};

package/cdn/custom-elements.json

@@ -8862,6 +8862,16 @@
               "description": "Tells the browser where to open the link. Only used when `href` is present.",
               "attribute": "target"
             },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Only relevant when map-marker is interactive.\nWhen set, it will be used to announce the name of the map-marker to screenreaders,\notherwise, screenreaders will announce the content inside the default slot.",
+              "attribute": "label"
+            },
             {
               "kind": "field",
               "name": "dir",
@@ -8977,6 +8987,15 @@
               "description": "Tells the browser where to open the link. Only used when `href` is present.",
               "fieldName": "target"
             },
+            {
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Only relevant when map-marker is interactive.\nWhen set, it will be used to announce the name of the map-marker to screenreaders,\notherwise, screenreaders will announce the content inside the default slot.",
+              "fieldName": "label"
+            },
             {
               "name": "dir",
               "type": {
@@ -17010,7 +17029,7 @@
   "package": {
     "name": "@solid-design-system/components",
     "description": "Solid Design System: Components",
-    "version": "4.4.2",
+    "version": "4.5.0",
     "author": "Union Investment",
     "homepage": "https://solid-design-system.fe.union-investment.de/docs/",
     "license": "MIT"