@mozaic-ds/web-components 1.1.0 → 1.3.0

package/dist/components/tags/TagInteractive.svelte

@@ -1,223 +0,0 @@
-<svelte:options customElement={{ tag: 'mc-tag-interactive' }} />
-
-<script lang="ts">
-  interface Props {
-    label: string;
-    disabled?: boolean;
-    size?: 's' | 'm' | 'l';
-    [key: string]: any;
-  }
-
-  let { label, disabled = false, size = 'm', ...attrs }: Props = $props();
-</script>
-
-<button
-  class={`mc-tag mc-tag-interactive ${size !== 'm' ? `mc-tag--${size}` : ''}`}
-  {disabled}
-  {...attrs}
->
-  <span class="mc-tag__label">{label}</span>
-</button>
-
-<style>/**
- * Do not edit directly, this file was auto-generated.
- */
-.mc-tag {
-  font-size: var(--font-size-100, 0.875rem);
-  border-radius: 2rem;
-  height: 2rem;
-  padding-inline: 0.75rem;
-  box-sizing: border-box;
-  display: inline-flex;
-  align-items: center;
-  background: var(--tag-color-background-standard, #ffffff);
-  color: var(--tag-color-text-standard, #242938);
-  border: var(--border-s, 1px) solid var(--tag-color-border, #999999);
-}
-.mc-tag--s {
-  font-size: var(--font-size-50, 0.75rem);
-  border-radius: 1.5rem;
-  height: 1.5rem;
-  padding-inline: 0.5rem;
-}
-.mc-tag--l {
-  font-size: var(--font-size-100, 0.875rem);
-  border-radius: 2.5rem;
-  height: 2.5rem;
-  padding-inline: 1rem;
-}
-.mc-tag.is-disabled, .mc-tag:disabled {
-  cursor: not-allowed;
-  background: var(--color-background-disabled, #d9d9d9);
-  color: var(--color-text-disabled, #737373);
-  border-color: var(--color-background-disabled, #d9d9d9);
-  box-shadow: none;
-}
-.mc-tag.is-disabled .mc-badge, .mc-tag:disabled .mc-badge {
-  color: currentColor;
-}
-
-.mc-tag-interactive {
-  text-decoration: none;
-  outline: none;
-  cursor: pointer;
-  font-weight: var(--font-weight-semi-bold, 600);
-}
-.mc-tag-interactive:not(:disabled):hover {
-  box-shadow: inset 0 0 0 var(--border-s, 1px) var(--tag-color-border, #999999);
-}
-.mc-tag-interactive:focus-visible {
-  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));
-  outline: 0.125rem solid transparent;
-  outline-offset: 0.125rem;
-}
-
-.mc-tag-contextualised {
-  gap: 0.25rem;
-  text-decoration: none;
-  outline: none;
-  color: var(--tag-color-text-inverse, #ffffff);
-  border: none;
-  background: var(--tag-color-background-selected, #117f03);
-  cursor: pointer;
-  font-weight: var(--font-weight-semi-bold, 600);
-  padding-inline-end: 1rem;
-  padding-inline-start: 0.5rem;
-}
-.mc-tag-contextualised:not(:disabled):hover {
-  background: var(--tag-color-background-selected-hover, #006902);
-}
-.mc-tag-contextualised:focus-visible {
-  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));
-  outline: 0.125rem solid transparent;
-  outline-offset: 0.125rem;
-}
-.mc-tag-contextualised.mc-tag--s {
-  padding-inline-end: 0.5rem;
-  padding-inline-start: 0.25rem;
-}
-
-.mc-tag-removable {
-  padding: 0 0 0 1rem;
-  background: var(--tag-color-background-inverse, #242938);
-  color: var(--tag-color-text-inverse, #ffffff);
-  border: none;
-}
-.mc-tag-removable__remove {
-  width: 2rem;
-  height: 2rem;
-  background-size: 1.5rem;
-  background: transparent;
-  border: none;
-  margin: 0 0 0 0.125rem;
-  padding: 0.25rem;
-  display: block;
-  cursor: pointer;
-  border-radius: var(--radius-full, 100%);
-}
-.mc-tag-removable__remove:hover {
-  background: var(--tag-color-background-inverse-hover, #343b4c);
-}
-.mc-tag-removable__remove:focus-visible {
-  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));
-  outline: 0.125rem solid transparent;
-  outline-offset: 0.125rem;
-}
-.mc-tag-removable__icon {
-  fill: var(--tag-color-delete-icon, #c9d0de);
-  width: 1.5rem;
-  height: 1.5rem;
-}
-.mc-tag-removable__text {
-  clip-path: inset(100%);
-  clip: rect(1px, 1px, 1px, 1px);
-  height: 1px;
-  overflow: hidden;
-  position: absolute;
-  white-space: nowrap;
-  padding: 0;
-  width: 1px;
-}
-.mc-tag-removable.mc-tag--s {
-  padding: 0 0 0 0.5rem;
-}
-.mc-tag-removable.mc-tag--s .mc-tag-removable__remove {
-  width: 1.5rem;
-  height: 1.5rem;
-  padding: 0.125rem;
-}
-.mc-tag-removable.mc-tag--s .mc-tag-removable__icon {
-  width: 1.25rem;
-  height: 1.25rem;
-}
-.mc-tag-removable.mc-tag--l .mc-tag-removable__remove {
-  width: 2.5rem;
-  height: 2.5rem;
-}
-.mc-tag-removable.mc-tag--l .mc-tag-removable__icon {
-  width: 2rem;
-  height: 2rem;
-}
-
-.mc-tag-selectable {
-  gap: 0.25rem;
-  white-space: nowrap;
-  cursor: pointer;
-  padding-inline-start: 0.5rem;
-  font-weight: var(--font-weight-semi-bold, 600);
-}
-.mc-tag-selectable:hover {
-  box-shadow: inset 0 0 0 var(--border-s, 1px) var(--tag-color-border, #999999);
-}
-.mc-tag-selectable:has(:focus-visible) {
-  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));
-  outline: 0.125rem solid transparent;
-  outline-offset: 0.125rem;
-}
-.mc-tag-selectable:has(:checked) {
-  background: var(--tag-color-background-selected, #117f03);
-  color: var(--tag-color-text-inverse, #ffffff);
-  border: none;
-}
-.mc-tag-selectable:has(:checked)::before {
-  display: inline-block;
-  content: "";
-  height: 1.25rem;
-  width: 1.25rem;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--tag-color-text-inverse, %23ffffff)' viewBox='0 0 20 20'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill-rule='evenodd' d='M14.697 6.553a.75.75 0 0 1 0 1.06l-5.833 5.834a.75.75 0 0 1-1.06 0l-2.5-2.5a.75.75 0 0 1 1.06-1.06l1.97 1.97 5.303-5.304a.75.75 0 0 1 1.06 0'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
-}
-.mc-tag-selectable:has(:checked):not(:has(:disabled)):hover {
-  background: var(--tag-color-background-selected-hover, #006902);
-  border-color: var(--tag-color-background-selected-hover, #006902);
-  box-shadow: none;
-}
-.mc-tag-selectable:has(:disabled) {
-  cursor: not-allowed;
-  background: var(--color-background-disabled, #d9d9d9);
-  color: var(--color-text-disabled, #737373);
-  border-color: var(--color-background-disabled, #d9d9d9);
-  box-shadow: none;
-}
-.mc-tag-selectable:has(:disabled)::before {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--color-text-disabled, %23737373)' viewBox='0 0 20 20'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill-rule='evenodd' d='M14.697 6.553a.75.75 0 0 1 0 1.06l-5.833 5.834a.75.75 0 0 1-1.06 0l-2.5-2.5a.75.75 0 0 1 1.06-1.06l1.97 1.97 5.303-5.304a.75.75 0 0 1 1.06 0'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
-}
-.mc-tag-selectable .mc-tag__input {
-  clip-path: inset(100%);
-  clip: rect(1px, 1px, 1px, 1px);
-  height: 1px;
-  overflow: hidden;
-  position: absolute;
-  white-space: nowrap;
-  padding: 0;
-  width: 1px;
-}
-.mc-tag-selectable .mc-tag__label {
-  user-select: none;
-}
-.mc-tag-selectable.mc-tag--s {
-  padding-inline-start: 0.25rem;
-  gap: 0.125rem;
-}
-.mc-tag-selectable.mc-tag--l {
-  padding-inline-start: 0.75rem;
-}</style>

package/dist/components/tags/TagInteractive.svelte.d.ts

@@ -1,10 +0,0 @@
-interface Props {
-    label: string;
-    disabled?: boolean;
-    size?: 's' | 'm' | 'l';
-    [key: string]: any;
-}
-declare const TagInteractive: import("svelte").Component<Props, {}, "">;
-type TagInteractive = ReturnType<typeof TagInteractive>;
-export default TagInteractive;
-//# sourceMappingURL=TagInteractive.svelte.d.ts.map

package/dist/components/tags/TagInteractive.svelte.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TagInteractive.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/tags/TagInteractive.svelte.ts"],"names":[],"mappings":"AAGE,UAAU,KAAK;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAiBH,QAAA,MAAM,cAAc,2CAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/components/tags/TagRemovable.js

@@ -1,4 +0,0 @@
-import{c as j,p as _,b as l,A as R,t as k,i as C,j as E,k as s,e as B,g as F,v as H,a as A,f as D,z as S,s as p,d as g,r as m,h as w}from"../../custom-element.js";import{i as T}from"../../if.js";import{s as x,a as q,b as G}from"../../attributes.js";import{C as I}from"../../CrossCircleFilled24.js";import"../../legacy.js";var J=R('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M10 1.75a8.25 8.25 0 1 0 0 16.5 8.25 8.25 0 0 0 0-16.5M6.97 6.97a.75.75 0 0 1 1.06 0L10 8.94l1.97-1.97a.75.75 0 1 1 1.06 1.06L11.06 10l1.97 1.97a.75.75 0 1 1-1.06 1.06L10 11.06l-1.97 1.97a.75.75 0 0 1-1.06-1.06L8.94 10 6.97 8.03a.75.75 0 0 1 0-1.06"></path></svg>');function z(n,e){_(e,!1);let c=l(e,"id",12,void 0),i=l(e,"style",12,void 0),d=l(e,"className",12,void 0),o=l(e,"fill",12,void 0),v=l(e,"size",12,"1.25rem");var f={get id(){return c()},set id(a){c(a),s()},get style(){return i()},set style(a){i(a),s()},get className(){return d()},set className(a){d(a),s()},get fill(){return o()},set fill(a){o(a),s()},get size(){return v()},set size(a){v(a),s()}},r=J();return k(()=>{x(r,"id",c()),q(r,i()),B(r,0,F(d())),x(r,"fill",o())}),C(n,r),E(f)}customElements.define("cross-circle-filled-20",j(z,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));function K(n,e){dispatchEvent(new CustomEvent("remove-tag",{detail:e()}))}var O=D('<span><span class="mc-tag__label svelte-14ecgj3"> </span> <button class="mc-tag-removable__remove svelte-14ecgj3" type="button"><span class="mc-tag-removable__icon svelte-14ecgj3"><!></span> <span class="mc-tag-removable__text svelte-14ecgj3"> </span></button></span>');const Q={hash:"svelte-14ecgj3",code:`/**
- * Do not edit directly, this file was auto-generated.
- */.mc-tag.svelte-14ecgj3 {font-size:var(--font-size-100, 0.875rem);border-radius:2rem;height:2rem;padding-inline:0.75rem;box-sizing:border-box;display:inline-flex;align-items:center;background:var(--tag-color-background-standard, #ffffff);color:var(--tag-color-text-standard, #242938);border:var(--border-s, 1px) solid var(--tag-color-border, #999999);}.mc-tag--s.svelte-14ecgj3 {font-size:var(--font-size-50, 0.75rem);border-radius:1.5rem;height:1.5rem;padding-inline:0.5rem;}.mc-tag--l.svelte-14ecgj3 {font-size:var(--font-size-100, 0.875rem);border-radius:2.5rem;height:2.5rem;padding-inline:1rem;}.mc-tag.is-disabled.svelte-14ecgj3, .mc-tag.svelte-14ecgj3:disabled {cursor:not-allowed;background:var(--color-background-disabled, #d9d9d9);color:var(--color-text-disabled, #737373);border-color:var(--color-background-disabled, #d9d9d9);box-shadow:none;}.mc-tag-interactive.svelte-14ecgj3 {text-decoration:none;outline:none;cursor:pointer;font-weight:var(--font-weight-semi-bold, 600);}.mc-tag-interactive.svelte-14ecgj3:not(:disabled):hover {box-shadow:inset 0 0 0 var(--border-s, 1px) var(--tag-color-border, #999999);}.mc-tag-interactive.svelte-14ecgj3:focus-visible {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-tag-contextualised.svelte-14ecgj3 {gap:0.25rem;text-decoration:none;outline:none;color:var(--tag-color-text-inverse, #ffffff);border:none;background:var(--tag-color-background-selected, #117f03);cursor:pointer;font-weight:var(--font-weight-semi-bold, 600);padding-inline-end:1rem;padding-inline-start:0.5rem;}.mc-tag-contextualised.svelte-14ecgj3:not(:disabled):hover {background:var(--tag-color-background-selected-hover, #006902);}.mc-tag-contextualised.svelte-14ecgj3:focus-visible {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-tag-contextualised.mc-tag--s.svelte-14ecgj3 {padding-inline-end:0.5rem;padding-inline-start:0.25rem;}.mc-tag-removable.svelte-14ecgj3 {padding:0 0 0 1rem;background:var(--tag-color-background-inverse, #242938);color:var(--tag-color-text-inverse, #ffffff);border:none;}.mc-tag-removable__remove.svelte-14ecgj3 {width:2rem;height:2rem;background-size:1.5rem;background:transparent;border:none;margin:0 0 0 0.125rem;padding:0.25rem;display:block;cursor:pointer;border-radius:var(--radius-full, 100%);}.mc-tag-removable__remove.svelte-14ecgj3:hover {background:var(--tag-color-background-inverse-hover, #343b4c);}.mc-tag-removable__remove.svelte-14ecgj3:focus-visible {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-tag-removable__icon.svelte-14ecgj3 {fill:var(--tag-color-delete-icon, #c9d0de);width:1.5rem;height:1.5rem;}.mc-tag-removable__text.svelte-14ecgj3 {clip-path:inset(100%);clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;position:absolute;white-space:nowrap;padding:0;width:1px;}.mc-tag-removable.mc-tag--s.svelte-14ecgj3 {padding:0 0 0 0.5rem;}.mc-tag-removable.mc-tag--s.svelte-14ecgj3 .mc-tag-removable__remove:where(.svelte-14ecgj3) {width:1.5rem;height:1.5rem;padding:0.125rem;}.mc-tag-removable.mc-tag--s.svelte-14ecgj3 .mc-tag-removable__icon:where(.svelte-14ecgj3) {width:1.25rem;height:1.25rem;}.mc-tag-removable.mc-tag--l.svelte-14ecgj3 .mc-tag-removable__remove:where(.svelte-14ecgj3) {width:2.5rem;height:2.5rem;}.mc-tag-removable.mc-tag--l.svelte-14ecgj3 .mc-tag-removable__icon:where(.svelte-14ecgj3) {width:2rem;height:2rem;}.mc-tag-selectable.svelte-14ecgj3 {gap:0.25rem;white-space:nowrap;cursor:pointer;padding-inline-start:0.5rem;font-weight:var(--font-weight-semi-bold, 600);}.mc-tag-selectable.svelte-14ecgj3:hover {box-shadow:inset 0 0 0 var(--border-s, 1px) var(--tag-color-border, #999999);}.mc-tag-selectable.svelte-14ecgj3:has(:where(.svelte-14ecgj3):focus-visible) {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-tag-selectable.svelte-14ecgj3:has(:where(.svelte-14ecgj3):checked) {background:var(--tag-color-background-selected, #117f03);color:var(--tag-color-text-inverse, #ffffff);border:none;}.mc-tag-selectable.svelte-14ecgj3:has(:where(.svelte-14ecgj3):checked)::before {display:inline-block;content:"";height:1.25rem;width:1.25rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--tag-color-text-inverse, %23ffffff)' viewBox='0 0 20 20'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill-rule='evenodd' d='M14.697 6.553a.75.75 0 0 1 0 1.06l-5.833 5.834a.75.75 0 0 1-1.06 0l-2.5-2.5a.75.75 0 0 1 1.06-1.06l1.97 1.97 5.303-5.304a.75.75 0 0 1 1.06 0'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}.mc-tag-selectable.svelte-14ecgj3:has(:where(.svelte-14ecgj3):checked):not(:has(:disabled)):hover {background:var(--tag-color-background-selected-hover, #006902);border-color:var(--tag-color-background-selected-hover, #006902);box-shadow:none;}.mc-tag-selectable.svelte-14ecgj3:has(:where(.svelte-14ecgj3):disabled) {cursor:not-allowed;background:var(--color-background-disabled, #d9d9d9);color:var(--color-text-disabled, #737373);border-color:var(--color-background-disabled, #d9d9d9);box-shadow:none;}.mc-tag-selectable.svelte-14ecgj3:has(:where(.svelte-14ecgj3):disabled)::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--color-text-disabled, %23737373)' viewBox='0 0 20 20'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill-rule='evenodd' d='M14.697 6.553a.75.75 0 0 1 0 1.06l-5.833 5.834a.75.75 0 0 1-1.06 0l-2.5-2.5a.75.75 0 0 1 1.06-1.06l1.97 1.97 5.303-5.304a.75.75 0 0 1 1.06 0'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}.mc-tag-selectable.svelte-14ecgj3 .mc-tag__label:where(.svelte-14ecgj3) {user-select:none;}.mc-tag-selectable.mc-tag--s.svelte-14ecgj3 {padding-inline-start:0.25rem;gap:0.125rem;}.mc-tag-selectable.mc-tag--l.svelte-14ecgj3 {padding-inline-start:0.75rem;}`};function U(n,e){_(e,!0),A(n,Q);let c=l(e,"id",7),i=l(e,"label",7),d=l(e,"removableLabel",7,"Remove"),o=l(e,"size",7,"m"),v=S(e,["$$slots","$$events","$$legacy","$$host","id","label","removableLabel","size"]);var f={get id(){return c()},set id(t){c(t),s()},get label(){return i()},set label(t){i(t),s()},get removableLabel(){return d()},set removableLabel(t="Remove"){d(t),s()},get size(){return o()},set size(t="m"){o(t),s()}},r=O();G(r,()=>({class:`mc-tag mc-tag-removable  ${o()!=="m"?`mc-tag--${o()}`:""}`,id:c(),...v}),void 0,void 0,"svelte-14ecgj3");var a=g(r),y=g(a,!0);m(a);var b=p(a,2);b.__click=[K,c];var u=g(b),L=g(u);{var M=t=>{z(t,{"aria-hidden":"true"})},N=t=>{I(t,{"aria-hidden":"true"})};T(L,t=>{o()==="s"?t(M):t(N,!1)})}m(u);var h=p(u,2),P=g(h,!0);return m(h),m(b),m(r),k(()=>{w(y,i()),w(P,d())}),C(n,r),E(f)}H(["click"]);customElements.define("mc-tag-removable",j(U,{id:{},label:{},removableLabel:{},size:{}},[],[],!0));
-//# sourceMappingURL=TagRemovable.js.map

package/dist/components/tags/TagRemovable.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TagRemovable.js","sources":["../../../node_modules/@mozaic-ds/icons-svelte/dist/components/CrossCircleFilled20/CrossCircleFilled20.svelte","../../../src/components/tags/TagRemovable.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'cross-circle-filled-20', shadow: 'none' }} />\n<script>\n  export let id = undefined;\n  export let style = undefined;\n  export let className = undefined;\n  export let fill = undefined;\n  export let size = \"1.25rem\";\n</script>\n\n<svg aria-hidden=\"true\" id={id}  style={style} class={className} fill={fill} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" width=\"20px\" height=\"20px\"><path fill-rule=\"evenodd\" d=\"M10 1.75a8.25 8.25 0 1 0 0 16.5 8.25 8.25 0 0 0 0-16.5M6.97 6.97a.75.75 0 0 1 1.06 0L10 8.94l1.97-1.97a.75.75 0 1 1 1.06 1.06L11.06 10l1.97 1.97a.75.75 0 1 1-1.06 1.06L10 11.06l-1.97 1.97a.75.75 0 0 1-1.06-1.06L8.94 10 6.97 8.03a.75.75 0 0 1 0-1.06\"/></svg>","<svelte:options customElement={{ tag: 'mc-tag-removable' }} />\n\n<script lang=\"ts\">\n  import CrossCircleFilled24 from '@mozaic-ds/icons-svelte/svelte/CrossCircleFilled24/CrossCircleFilled24.svelte';\n  import CrossCircleFilled20 from '@mozaic-ds/icons-svelte/svelte/CrossCircleFilled20/CrossCircleFilled20.svelte';\n\n  interface Props {\n    id: string;\n    label: string;\n    removableLabel?: string;\n    size?: 's' | 'm' | 'l';\n    [key: string]: any;\n  }\n\n  let { id, label, removableLabel = 'Remove', size = 'm', ...attrs }: Props = $props();\n\n  function handleRemove() {\n    dispatchEvent(new CustomEvent('remove-tag', { detail: id }));\n  }\n</script>\n\n<span class={`mc-tag mc-tag-removable  ${size !== 'm' ? `mc-tag--${size}` : ''}`} {id} {...attrs}>\n  <span class=\"mc-tag__label\">{label}</span>\n  <button class=\"mc-tag-removable__remove\" type=\"button\" onclick={handleRemove}>\n    <span class=\"mc-tag-removable__icon\">\n      {#if size === 's'}\n        <CrossCircleFilled20 aria-hidden=\"true\" />\n      {:else}\n        <CrossCircleFilled24 aria-hidden=\"true\" />\n      {/if}\n    </span>\n    <span class=\"mc-tag-removable__text\">{removableLabel}</span>\n  </button>\n</span>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/tag';\n  @use '@mozaic-ds/styles/components/tag/c.tag-removable';\n</style>\n"],"names":["id","style","className","fill","size","handleRemove","_","$.prop","$$props","label","removableLabel","attrs","$.rest_props","$$render","consequent","alternate"],"mappings":"2uBAAA,SAEa,IAAAA,cAAK,MAAS,EACdC,iBAAQ,MAAS,EACjBC,qBAAY,MAAS,EACrBC,gBAAO,MAAS,EAChBC,gBAAO,SAAS,gRAGDJ,GAAE,MAAUC,GAAK,UAASC,EAAS,CAAA,CAAA,aAAQC,GAAI,eAF3E,6GCSW,SAAAE,EAAYC,EAAAN,EAAG,CACtB,kBAAkB,YAAY,aAAY,CAAI,OAAQA,EAAE,CAAA,CAAA,CAAA,CAC1D;;wjNAlBF,oBAcQA,EAAEO,EAAAC,EAAA,KAAA,CAAA,EAAEC,EAAKF,EAAAC,EAAA,QAAA,CAAA,EAAEE,yBAAiB,QAAQ,EAAEN,eAAO,GAAG,EAAKO,EAAKC,EAAAJ,EAAA,sOAA9B,SAAQ,6CAAS,IAAG,4BAOf,MAAA,4BAAAJ,EAAI,IAAK,IAAG,WAAcA,EAAI,IAAK,EAAE,aAAaO,sFAEzBN,EAAYL,CAAA,uGAEnEI,EAAI,IAAK,IAAGS,EAAAC,CAAA,EAAAD,EAAAE,EAAA,EAAA,iEAHQN,GAAK,MASMC,GAAc,eAZxD","x_google_ignoreList":[0]}

package/dist/components/tags/TagRemovable.svelte.d.ts

@@ -1,11 +0,0 @@
-interface Props {
-    id: string;
-    label: string;
-    removableLabel?: string;
-    size?: 's' | 'm' | 'l';
-    [key: string]: any;
-}
-declare const TagRemovable: import("svelte").Component<Props, {}, "">;
-type TagRemovable = ReturnType<typeof TagRemovable>;
-export default TagRemovable;
-//# sourceMappingURL=TagRemovable.svelte.d.ts.map

package/dist/components/tags/TagRemovable.svelte.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TagRemovable.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/tags/TagRemovable.svelte.ts"],"names":[],"mappings":"AAOE,UAAU,KAAK;IACb,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAiCH,QAAA,MAAM,YAAY,2CAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

package/dist/components/tags/TagSelectable.js

@@ -1,4 +0,0 @@
-import{v as x,c as w,p as y,a as k,b as t,f as _,d as f,s as C,t as E,i as M,j as P,k as o,z as B,r as b,h as H}from"../../custom-element.js";import{b as S,r as j,s as u,c as D}from"../../attributes.js";function T(l,a){a(l.target.checked)}var q=_('<label><input type="checkbox" class="mc-tag__input svelte-1myzar6"/> <span class="mc-tag__label svelte-1myzar6"> </span></label>');const A={hash:"svelte-1myzar6",code:`/**
- * Do not edit directly, this file was auto-generated.
- */.mc-tag.svelte-1myzar6 {font-size:var(--font-size-100, 0.875rem);border-radius:2rem;height:2rem;padding-inline:0.75rem;box-sizing:border-box;display:inline-flex;align-items:center;background:var(--tag-color-background-standard, #ffffff);color:var(--tag-color-text-standard, #242938);border:var(--border-s, 1px) solid var(--tag-color-border, #999999);}.mc-tag--s.svelte-1myzar6 {font-size:var(--font-size-50, 0.75rem);border-radius:1.5rem;height:1.5rem;padding-inline:0.5rem;}.mc-tag--l.svelte-1myzar6 {font-size:var(--font-size-100, 0.875rem);border-radius:2.5rem;height:2.5rem;padding-inline:1rem;}.mc-tag.is-disabled.svelte-1myzar6, .mc-tag.svelte-1myzar6:disabled {cursor:not-allowed;background:var(--color-background-disabled, #d9d9d9);color:var(--color-text-disabled, #737373);border-color:var(--color-background-disabled, #d9d9d9);box-shadow:none;}.mc-tag-interactive.svelte-1myzar6 {text-decoration:none;outline:none;cursor:pointer;font-weight:var(--font-weight-semi-bold, 600);}.mc-tag-interactive.svelte-1myzar6:not(:disabled):hover {box-shadow:inset 0 0 0 var(--border-s, 1px) var(--tag-color-border, #999999);}.mc-tag-interactive.svelte-1myzar6:focus-visible {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-tag-contextualised.svelte-1myzar6 {gap:0.25rem;text-decoration:none;outline:none;color:var(--tag-color-text-inverse, #ffffff);border:none;background:var(--tag-color-background-selected, #117f03);cursor:pointer;font-weight:var(--font-weight-semi-bold, 600);padding-inline-end:1rem;padding-inline-start:0.5rem;}.mc-tag-contextualised.svelte-1myzar6:not(:disabled):hover {background:var(--tag-color-background-selected-hover, #006902);}.mc-tag-contextualised.svelte-1myzar6:focus-visible {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-tag-contextualised.mc-tag--s.svelte-1myzar6 {padding-inline-end:0.5rem;padding-inline-start:0.25rem;}.mc-tag-removable.svelte-1myzar6 {padding:0 0 0 1rem;background:var(--tag-color-background-inverse, #242938);color:var(--tag-color-text-inverse, #ffffff);border:none;}.mc-tag-removable__remove.svelte-1myzar6 {width:2rem;height:2rem;background-size:1.5rem;background:transparent;border:none;margin:0 0 0 0.125rem;padding:0.25rem;display:block;cursor:pointer;border-radius:var(--radius-full, 100%);}.mc-tag-removable__remove.svelte-1myzar6:hover {background:var(--tag-color-background-inverse-hover, #343b4c);}.mc-tag-removable__remove.svelte-1myzar6:focus-visible {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-tag-removable__icon.svelte-1myzar6 {fill:var(--tag-color-delete-icon, #c9d0de);width:1.5rem;height:1.5rem;}.mc-tag-removable__text.svelte-1myzar6 {clip-path:inset(100%);clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;position:absolute;white-space:nowrap;padding:0;width:1px;}.mc-tag-removable.mc-tag--s.svelte-1myzar6 {padding:0 0 0 0.5rem;}.mc-tag-selectable.svelte-1myzar6 {gap:0.25rem;white-space:nowrap;cursor:pointer;padding-inline-start:0.5rem;font-weight:var(--font-weight-semi-bold, 600);}.mc-tag-selectable.svelte-1myzar6:hover {box-shadow:inset 0 0 0 var(--border-s, 1px) var(--tag-color-border, #999999);}.mc-tag-selectable.svelte-1myzar6:has(:where(.svelte-1myzar6):focus-visible) {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-tag-selectable.svelte-1myzar6:has(:where(.svelte-1myzar6):checked) {background:var(--tag-color-background-selected, #117f03);color:var(--tag-color-text-inverse, #ffffff);border:none;}.mc-tag-selectable.svelte-1myzar6:has(:where(.svelte-1myzar6):checked)::before {display:inline-block;content:"";height:1.25rem;width:1.25rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--tag-color-text-inverse, %23ffffff)' viewBox='0 0 20 20'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill-rule='evenodd' d='M14.697 6.553a.75.75 0 0 1 0 1.06l-5.833 5.834a.75.75 0 0 1-1.06 0l-2.5-2.5a.75.75 0 0 1 1.06-1.06l1.97 1.97 5.303-5.304a.75.75 0 0 1 1.06 0'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}.mc-tag-selectable.svelte-1myzar6:has(:where(.svelte-1myzar6):checked):not(:has(:disabled)):hover {background:var(--tag-color-background-selected-hover, #006902);border-color:var(--tag-color-background-selected-hover, #006902);box-shadow:none;}.mc-tag-selectable.svelte-1myzar6:has(:where(.svelte-1myzar6):disabled) {cursor:not-allowed;background:var(--color-background-disabled, #d9d9d9);color:var(--color-text-disabled, #737373);border-color:var(--color-background-disabled, #d9d9d9);box-shadow:none;}.mc-tag-selectable.svelte-1myzar6:has(:where(.svelte-1myzar6):disabled)::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--color-text-disabled, %23737373)' viewBox='0 0 20 20'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill-rule='evenodd' d='M14.697 6.553a.75.75 0 0 1 0 1.06l-5.833 5.834a.75.75 0 0 1-1.06 0l-2.5-2.5a.75.75 0 0 1 1.06-1.06l1.97 1.97 5.303-5.304a.75.75 0 0 1 1.06 0'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");}.mc-tag-selectable.svelte-1myzar6 .mc-tag__input:where(.svelte-1myzar6) {clip-path:inset(100%);clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;position:absolute;white-space:nowrap;padding:0;width:1px;}.mc-tag-selectable.svelte-1myzar6 .mc-tag__label:where(.svelte-1myzar6) {user-select:none;}.mc-tag-selectable.mc-tag--s.svelte-1myzar6 {padding-inline-start:0.25rem;gap:0.125rem;}.mc-tag-selectable.mc-tag--l.svelte-1myzar6 {padding-inline-start:0.75rem;}`};function F(l,a){y(a,!0),k(l,A);let s=t(a,"id",7),n=t(a,"name",7),m=t(a,"label",7),i=t(a,"checked",15,!1),g=t(a,"disabled",7,!1),d=t(a,"size",7,"m"),h=B(a,["$$slots","$$events","$$legacy","$$host","id","name","label","checked","disabled","size"]);var p={get id(){return s()},set id(e){s(e),o()},get name(){return n()},set name(e){n(e),o()},get label(){return m()},set label(e){m(e),o()},get checked(){return i()},set checked(e=!1){i(e),o()},get disabled(){return g()},set disabled(e=!1){g(e),o()},get size(){return d()},set size(e="m"){d(e),o()}},c=q();S(c,()=>({class:`mc-tag mc-tag-selectable ${d()!=="m"?`mc-tag--${d()}`:""}`,id:s(),...h}),void 0,void 0,"svelte-1myzar6");var r=f(c);j(r),r.__change=[T,i];var v=C(r,2),z=f(v,!0);return b(v),b(c),E(()=>{u(r,"id",s()),u(r,"name",n()),D(r,i()),r.disabled=g(),H(z,m())}),M(l,c),P(p)}x(["change"]);customElements.define("mc-tag-selectable",w(F,{id:{},name:{},label:{},checked:{},disabled:{},size:{}},[],[],!0));
-//# sourceMappingURL=TagSelectable.js.map

package/dist/components/tags/TagSelectable.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TagSelectable.js","sources":["../../../src/components/tags/TagSelectable.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'mc-tag-selectable' }} />\n\n<script lang=\"ts\">\n  interface Props {\n    id: string;\n    name?: string;\n    label: string;\n    checked?: boolean;\n    disabled?: boolean;\n    size?: 's' | 'm' | 'l';\n    [key: string]: any;\n  }\n\n  let {\n    id,\n    name,\n    label,\n    checked = $bindable(false),\n    disabled = false,\n    size = 'm',\n    ...attrs\n  }: Props = $props();\n\n  function handleChange(e: Event) {\n    checked = (e.target as HTMLInputElement).checked;\n  }\n</script>\n\n<label class={`mc-tag mc-tag-selectable ${size !== 'm' ? `mc-tag--${size}` : ''}`} {id} {...attrs}>\n  <input\n    type=\"checkbox\"\n    class=\"mc-tag__input\"\n    {id}\n    {name}\n    {checked}\n    {disabled}\n    onchange={handleChange}\n  />\n  <span class=\"mc-tag__label\">{label}</span>\n</label>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/tag';\n  @use '@mozaic-ds/styles/components/tag/c.tag-selectable';\n</style>\n"],"names":["handleChange","e","checked","id","$.prop","$$props","name","label","disabled","size","attrs","$.rest_props"],"mappings":"oNAuBWA,EAAaC,EAAQC,EAAE,CAC9BA,EAAWD,EAAE,OAA4B,OAAO,CAClD;;2xMAzBF,oBAcIE,EAAEC,EAAAC,EAAA,KAAA,CAAA,EACFC,EAAIF,EAAAC,EAAA,OAAA,CAAA,EACJE,EAAKH,EAAAC,EAAA,QAAA,CAAA,EACLH,mBAAoB,EAAK,EACzBM,mBAAW,EAAK,EAChBC,eAAO,GAAG,EACPC,EAAAC,EAAAN,EAAA,gRAHiB,GAAK,qDACd,GAAK,6CACT,IAAG,4BAS4B,MAAA,4BAAAI,EAAI,IAAK,IAAG,WAAcA,EAAI,IAAK,EAAE,aAAaC,gEAQ9EV,EAAYE,CAAA,2GAEKK,GAAK,eAZpC"}

package/dist/components/tags/TagSelectable.svelte

@@ -1,243 +0,0 @@
-<svelte:options customElement={{ tag: 'mc-tag-selectable' }} />
-
-<script lang="ts">
-  interface Props {
-    id: string;
-    name?: string;
-    label: string;
-    checked?: boolean;
-    disabled?: boolean;
-    size?: 's' | 'm' | 'l';
-    [key: string]: any;
-  }
-
-  let {
-    id,
-    name,
-    label,
-    checked = $bindable(false),
-    disabled = false,
-    size = 'm',
-    ...attrs
-  }: Props = $props();
-
-  function handleChange(e: Event) {
-    checked = (e.target as HTMLInputElement).checked;
-  }
-</script>
-
-<label class={`mc-tag mc-tag-selectable ${size !== 'm' ? `mc-tag--${size}` : ''}`} {id} {...attrs}>
-  <input
-    type="checkbox"
-    class="mc-tag__input"
-    {id}
-    {name}
-    {checked}
-    {disabled}
-    onchange={handleChange}
-  />
-  <span class="mc-tag__label">{label}</span>
-</label>
-
-<style>/**
- * Do not edit directly, this file was auto-generated.
- */
-.mc-tag {
-  font-size: var(--font-size-100, 0.875rem);
-  border-radius: 2rem;
-  height: 2rem;
-  padding-inline: 0.75rem;
-  box-sizing: border-box;
-  display: inline-flex;
-  align-items: center;
-  background: var(--tag-color-background-standard, #ffffff);
-  color: var(--tag-color-text-standard, #242938);
-  border: var(--border-s, 1px) solid var(--tag-color-border, #999999);
-}
-.mc-tag--s {
-  font-size: var(--font-size-50, 0.75rem);
-  border-radius: 1.5rem;
-  height: 1.5rem;
-  padding-inline: 0.5rem;
-}
-.mc-tag--l {
-  font-size: var(--font-size-100, 0.875rem);
-  border-radius: 2.5rem;
-  height: 2.5rem;
-  padding-inline: 1rem;
-}
-.mc-tag.is-disabled, .mc-tag:disabled {
-  cursor: not-allowed;
-  background: var(--color-background-disabled, #d9d9d9);
-  color: var(--color-text-disabled, #737373);
-  border-color: var(--color-background-disabled, #d9d9d9);
-  box-shadow: none;
-}
-.mc-tag.is-disabled .mc-badge, .mc-tag:disabled .mc-badge {
-  color: currentColor;
-}
-
-.mc-tag-interactive {
-  text-decoration: none;
-  outline: none;
-  cursor: pointer;
-  font-weight: var(--font-weight-semi-bold, 600);
-}
-.mc-tag-interactive:not(:disabled):hover {
-  box-shadow: inset 0 0 0 var(--border-s, 1px) var(--tag-color-border, #999999);
-}
-.mc-tag-interactive:focus-visible {
-  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));
-  outline: 0.125rem solid transparent;
-  outline-offset: 0.125rem;
-}
-
-.mc-tag-contextualised {
-  gap: 0.25rem;
-  text-decoration: none;
-  outline: none;
-  color: var(--tag-color-text-inverse, #ffffff);
-  border: none;
-  background: var(--tag-color-background-selected, #117f03);
-  cursor: pointer;
-  font-weight: var(--font-weight-semi-bold, 600);
-  padding-inline-end: 1rem;
-  padding-inline-start: 0.5rem;
-}
-.mc-tag-contextualised:not(:disabled):hover {
-  background: var(--tag-color-background-selected-hover, #006902);
-}
-.mc-tag-contextualised:focus-visible {
-  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));
-  outline: 0.125rem solid transparent;
-  outline-offset: 0.125rem;
-}
-.mc-tag-contextualised.mc-tag--s {
-  padding-inline-end: 0.5rem;
-  padding-inline-start: 0.25rem;
-}
-
-.mc-tag-removable {
-  padding: 0 0 0 1rem;
-  background: var(--tag-color-background-inverse, #242938);
-  color: var(--tag-color-text-inverse, #ffffff);
-  border: none;
-}
-.mc-tag-removable__remove {
-  width: 2rem;
-  height: 2rem;
-  background-size: 1.5rem;
-  background: transparent;
-  border: none;
-  margin: 0 0 0 0.125rem;
-  padding: 0.25rem;
-  display: block;
-  cursor: pointer;
-  border-radius: var(--radius-full, 100%);
-}
-.mc-tag-removable__remove:hover {
-  background: var(--tag-color-background-inverse-hover, #343b4c);
-}
-.mc-tag-removable__remove:focus-visible {
-  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));
-  outline: 0.125rem solid transparent;
-  outline-offset: 0.125rem;
-}
-.mc-tag-removable__icon {
-  fill: var(--tag-color-delete-icon, #c9d0de);
-  width: 1.5rem;
-  height: 1.5rem;
-}
-.mc-tag-removable__text {
-  clip-path: inset(100%);
-  clip: rect(1px, 1px, 1px, 1px);
-  height: 1px;
-  overflow: hidden;
-  position: absolute;
-  white-space: nowrap;
-  padding: 0;
-  width: 1px;
-}
-.mc-tag-removable.mc-tag--s {
-  padding: 0 0 0 0.5rem;
-}
-.mc-tag-removable.mc-tag--s .mc-tag-removable__remove {
-  width: 1.5rem;
-  height: 1.5rem;
-  padding: 0.125rem;
-}
-.mc-tag-removable.mc-tag--s .mc-tag-removable__icon {
-  width: 1.25rem;
-  height: 1.25rem;
-}
-.mc-tag-removable.mc-tag--l .mc-tag-removable__remove {
-  width: 2.5rem;
-  height: 2.5rem;
-}
-.mc-tag-removable.mc-tag--l .mc-tag-removable__icon {
-  width: 2rem;
-  height: 2rem;
-}
-
-.mc-tag-selectable {
-  gap: 0.25rem;
-  white-space: nowrap;
-  cursor: pointer;
-  padding-inline-start: 0.5rem;
-  font-weight: var(--font-weight-semi-bold, 600);
-}
-.mc-tag-selectable:hover {
-  box-shadow: inset 0 0 0 var(--border-s, 1px) var(--tag-color-border, #999999);
-}
-.mc-tag-selectable:has(:focus-visible) {
-  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));
-  outline: 0.125rem solid transparent;
-  outline-offset: 0.125rem;
-}
-.mc-tag-selectable:has(:checked) {
-  background: var(--tag-color-background-selected, #117f03);
-  color: var(--tag-color-text-inverse, #ffffff);
-  border: none;
-}
-.mc-tag-selectable:has(:checked)::before {
-  display: inline-block;
-  content: "";
-  height: 1.25rem;
-  width: 1.25rem;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--tag-color-text-inverse, %23ffffff)' viewBox='0 0 20 20'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill-rule='evenodd' d='M14.697 6.553a.75.75 0 0 1 0 1.06l-5.833 5.834a.75.75 0 0 1-1.06 0l-2.5-2.5a.75.75 0 0 1 1.06-1.06l1.97 1.97 5.303-5.304a.75.75 0 0 1 1.06 0'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
-}
-.mc-tag-selectable:has(:checked):not(:has(:disabled)):hover {
-  background: var(--tag-color-background-selected-hover, #006902);
-  border-color: var(--tag-color-background-selected-hover, #006902);
-  box-shadow: none;
-}
-.mc-tag-selectable:has(:disabled) {
-  cursor: not-allowed;
-  background: var(--color-background-disabled, #d9d9d9);
-  color: var(--color-text-disabled, #737373);
-  border-color: var(--color-background-disabled, #d9d9d9);
-  box-shadow: none;
-}
-.mc-tag-selectable:has(:disabled)::before {
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--color-text-disabled, %23737373)' viewBox='0 0 20 20'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill-rule='evenodd' d='M14.697 6.553a.75.75 0 0 1 0 1.06l-5.833 5.834a.75.75 0 0 1-1.06 0l-2.5-2.5a.75.75 0 0 1 1.06-1.06l1.97 1.97 5.303-5.304a.75.75 0 0 1 1.06 0'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
-}
-.mc-tag-selectable .mc-tag__input {
-  clip-path: inset(100%);
-  clip: rect(1px, 1px, 1px, 1px);
-  height: 1px;
-  overflow: hidden;
-  position: absolute;
-  white-space: nowrap;
-  padding: 0;
-  width: 1px;
-}
-.mc-tag-selectable .mc-tag__label {
-  user-select: none;
-}
-.mc-tag-selectable.mc-tag--s {
-  padding-inline-start: 0.25rem;
-  gap: 0.125rem;
-}
-.mc-tag-selectable.mc-tag--l {
-  padding-inline-start: 0.75rem;
-}</style>

package/dist/components/tags/TagSelectable.svelte.d.ts

@@ -1,13 +0,0 @@
-interface Props {
-    id: string;
-    name?: string;
-    label: string;
-    checked?: boolean;
-    disabled?: boolean;
-    size?: 's' | 'm' | 'l';
-    [key: string]: any;
-}
-declare const TagSelectable: import("svelte").Component<Props, {}, "checked">;
-type TagSelectable = ReturnType<typeof TagSelectable>;
-export default TagSelectable;
-//# sourceMappingURL=TagSelectable.svelte.d.ts.map

package/dist/components/tags/TagSelectable.svelte.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TagSelectable.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/tags/TagSelectable.svelte.ts"],"names":[],"mappings":"AAGE,UAAU,KAAK;IACb,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AA8BH,QAAA,MAAM,aAAa,kDAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/components/tags/Tags.stories.d.ts

@@ -1,5 +0,0 @@
-import type { Meta, StoryFn } from '@storybook/html-vite';
-declare const _default: Meta;
-export default _default;
-export declare const Informative: StoryFn;
-//# sourceMappingURL=Tags.stories.d.ts.map

package/dist/components/tags/Tags.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tags.stories.d.ts","sourceRoot":"","sources":["../../../src/components/tags/Tags.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;wBA2BrD,IAAI;AAzBT,wBAyBU;AAYV,eAAO,MAAM,WAAW,EAAE,OAA8C,CAAC"}

package/dist/components/tags/Tags.stories.js

@@ -1,41 +0,0 @@
-export default {
-    title: 'Indicators/Tag/Informative',
-    parameters: {
-        docs: {
-            description: {
-                component: 'A Tag is a UI element used to filter data, categorize, select or deselect an option. It can appear standalone, in a group, or embedded within other components. Depending on its use, a tag can be interactive (clickable, removable, selectable) or static (serving as a visual indicator).',
-            },
-        },
-    },
-    argTypes: {
-        label: {
-            control: 'text',
-            description: 'Text label displayed inside the tag',
-        },
-        id: {
-            control: 'text',
-            description: 'ID of the tag (optional)',
-        },
-        size: {
-            control: 'select',
-            options: ['s', 'm', 'l'],
-            description: 'Size of the tag',
-        },
-    },
-};
-const createInformativeTag = (args) => {
-    const tag = document.createElement('mc-tag');
-    if (args.label)
-        tag.setAttribute('label', args.label);
-    if (args.id)
-        tag.setAttribute('id', args.id);
-    if (args.size)
-        tag.setAttribute('size', args.size);
-    return tag;
-};
-export const Informative = (args) => createInformativeTag(args);
-Informative.args = {
-    id: 'tag-informative',
-    label: 'Static Tag',
-    size: 'm',
-};

package/dist/components/tags/TagsContextualised.stories.d.ts

@@ -1,5 +0,0 @@
-import type { Meta, StoryFn } from '@storybook/html-vite';
-declare const _default: Meta;
-export default _default;
-export declare const Contextualised: StoryFn;
-//# sourceMappingURL=TagsContextualised.stories.d.ts.map

package/dist/components/tags/TagsContextualised.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TagsContextualised.stories.d.ts","sourceRoot":"","sources":["../../../src/components/tags/TagsContextualised.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;wBAgCrD,IAAI;AA7BT,wBA6BU;AAcV,eAAO,MAAM,cAAc,EAAE,OAAiD,CAAC"}