@justeattakeaway/pie-tag 0.22.9 → 0.22.11

package/custom-elements.json

@@ -16,9 +16,9 @@
           "kind": "variable",
           "name": "variants",
           "type": {
-            "text": "[\n    'neutral',\n    'neutral-alternative',\n    'ghost',\n    'outline',\n    'translucent',\n    'information',\n    'success',\n    'error',\n    'warning',\n    'brand-02',\n    'brand-03',\n    'brand-04',\n    'brand-05',\n    'brand-06',\n    'brand-08'\n]"
+            "text": "[\r\n    'neutral',\r\n    'neutral-alternative',\r\n    'ghost',\r\n    'outline',\r\n    'translucent',\r\n    'information',\r\n    'success',\r\n    'error',\r\n    'warning',\r\n    'brand-02',\r\n    'brand-03',\r\n    'brand-04',\r\n    'brand-05',\r\n    'brand-06',\r\n    'brand-08'\r\n]"
           },
-          "default": "[\n    'neutral',\n    'neutral-alternative',\n    'ghost',\n    'outline',\n    'translucent',\n    'information',\n    'success',\n    'error',\n    'warning',\n    'brand-02',\n    'brand-03',\n    'brand-04',\n    'brand-05',\n    'brand-06',\n    'brand-08'\n]"
+          "default": "[\r\n    'neutral',\r\n    'neutral-alternative',\r\n    'ghost',\r\n    'outline',\r\n    'translucent',\r\n    'information',\r\n    'success',\r\n    'error',\r\n    'warning',\r\n    'brand-02',\r\n    'brand-03',\r\n    'brand-04',\r\n    'brand-05',\r\n    'brand-06',\r\n    'brand-08'\r\n]"
         },
         {
           "kind": "variable",
@@ -34,7 +34,7 @@
           "type": {
             "text": "DefaultProps"
           },
-          "default": "{\n    variant: 'neutral',\n    isStrong: false,\n    isDimmed: false,\n    size: 'large',\n    isIconOnly: false,\n    hasLeadingIcon: false,\n}"
+          "default": "{\r\n    variant: 'neutral',\r\n    isStrong: false,\r\n    isDimmed: false,\r\n    size: 'large',\r\n    isIconOnly: false,\r\n    hasLeadingIcon: false,\r\n}"
         }
       ],
       "exports": [

package/dist/index.js

@@ -7,7 +7,7 @@ const s = class s extends u {
     this.getAttribute("v") || this.setAttribute("v", s.v);
   }
 };
-s.v = "0.22.9";
+s.v = "0.22.11";
 let v = s;
 const w = '*,*:after,*:before{box-sizing:inherit}:host{display:inline-block}.c-tag{--tag-bg-color: var(--dt-color-container-strong);--tag-icon-bg-color: var(--dt-color-container-inverse);--tag-icon-color: var(--dt-color-content-inverse);--tag-color: var(--dt-color-content-default);--tag-transparent-bg-color: transparent;--tag-border-width: 1px;--tag-border-color: var(--tag-bg-color);border:var(--tag-border-width) solid var(--tag-border-color);border-radius:var(--tag-border-radius);width:100%;font-family:var(--tag-font-family);font-weight:var(--tag-font-weight);font-size:var(--tag-font-size);line-height:var(--tag-line-height);color:var(--tag-color);display:flex;align-items:center;justify-content:center;background-color:var(--tag-bg-color);padding-inline-start:var(--tag-padding-inline-start);padding-inline-end:var(--tag-padding-inline-end);padding-block-start:var(--tag-padding-block-start);padding-block-end:var(--tag-padding-block-end)}.c-tag slot[name=icon]{color:var(--tag-icon-color)}.c-tag slot[name=icon]::slotted(svg){display:block;height:var(--icon-size-override);width:var(--icon-size-override)}.c-tag slot:not([name=icon]){display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.c-tag.c-tag--large{--tag-font-family: var(--dt-font-body-s-family);--tag-font-weight: var(--dt-font-body-s-weight);--tag-font-size: calc(var(--dt-font-body-s-size) * 1px);--tag-line-height: calc(var(--dt-font-body-s-line-height) * 1px);--tag-border-radius: var(--dt-radius-rounded-e);--icon-size-override: 16px;--tag-padding-block-start: calc(var(--dt-spacing-a-small) - var(--tag-border-width));--tag-padding-block-end: calc(var(--dt-spacing-a-small) - var(--tag-border-width));--tag-padding-inline-start: calc(var(--dt-spacing-b) - var(--tag-border-width));--tag-padding-inline-end: calc(var(--dt-spacing-b) - var(--tag-border-width));--tag-gap: var(--dt-spacing-a)}.c-tag.c-tag--small{--tag-font-family: var(--dt-font-caption-family);--tag-font-weight: var(--dt-font-caption-weight);--tag-font-size: calc(var(--dt-font-caption-size) * 1px);--tag-line-height: calc(var(--dt-font-caption-line-height) * 1px);--tag-border-radius: var(--dt-radius-rounded-c);--icon-size-override: 12px;--tag-padding-block-start: 0;--tag-padding-block-end: 0;--tag-padding-inline-start: calc(var(--dt-spacing-a) - var(--tag-border-width));--tag-padding-inline-end: calc(var(--dt-spacing-a) - var(--tag-border-width));--tag-gap: var(--dt-spacing-a-small)}.c-tag.c-tag--icon-only.c-tag--large,.c-tag.c-tag--icon-only.c-tag--small{--tag-padding-block-start: calc(var(--dt-spacing-a) - var(--tag-border-width));--tag-padding-block-end: calc(var(--dt-spacing-a) - var(--tag-border-width))}.c-tag.c-tag--icon-only.c-tag--small{--tag-border-radius: var(--dt-radius-rounded-e);--icon-size-override: 16px;--tag-padding-inline-start: calc(var(--dt-spacing-b) - var(--tag-border-width));--tag-padding-inline-end: calc(var(--dt-spacing-b) - var(--tag-border-width));--tag-gap: var(--dt-spacing-a)}.c-tag.c-tag--has-icon:not(.c-tag--icon-only){--tag-padding-inline-start: 0;--tag-padding-block-start: 0;--tag-padding-block-end: 0;gap:var(--tag-gap)}.c-tag.c-tag--has-icon:not(.c-tag--icon-only).c-tag--large{--tag-padding-inline-end: calc(var(--dt-spacing-b) - var(--tag-border-width));--tag-icon-container-size: 22px}.c-tag.c-tag--has-icon:not(.c-tag--icon-only).c-tag--small{--tag-padding-inline-end: calc(var(--dt-spacing-a) - var(--tag-border-width));--tag-icon-container-size: 16px}.c-tag.c-tag--has-icon:not(.c-tag--icon-only) slot[name=icon]{background-color:var(--tag-icon-bg-color);display:grid;place-items:center;border-radius:inherit;height:var(--tag-icon-container-size);aspect-ratio:1/1}.c-tag.c-tag--is-dimmed{opacity:.5}.c-tag.c-tag--neutral.c-tag--icon-only{--tag-bg-color: var(--dt-color-container-strong);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--neutral.c-tag--icon-only.c-tag--strong{--tag-bg-color: var(--dt-color-container-inverse);--tag-icon-color: var(--dt-color-content-inverse)}.c-tag.c-tag--neutral.c-tag--strong:not(.c-tag--icon-only){--tag-bg-color: var(--dt-color-container-inverse);--tag-icon-bg-color: var(--dt-color-container-strong);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-inverse)}.c-tag.c-tag--neutral-alternative{--tag-bg-color: var(--dt-color-container-default);--tag-icon-bg-color: var(--dt-color-container-strong);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--neutral-alternative.c-tag--icon-only{--tag-bg-color: var(--dt-color-container-default);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--information{--tag-bg-color: var(--dt-color-support-info-02);--tag-icon-bg-color: var(--dt-color-support-info);--tag-icon-color: var(--dt-color-content-inverse);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--information.c-tag--icon-only{--tag-bg-color: var(--dt-color-support-info-02);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--information.c-tag--icon-only.c-tag--strong{--tag-bg-color: var(--dt-color-support-info);--tag-icon-color: var(--dt-color-content-inverse)}.c-tag.c-tag--information.c-tag--strong:not(.c-tag--icon-only){--tag-bg-color: var(--dt-color-support-info);--tag-icon-bg-color: var(--dt-color-support-info-02);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-inverse)}.c-tag.c-tag--success{--tag-bg-color: var(--dt-color-support-positive-02);--tag-icon-bg-color: var(--dt-color-support-positive);--tag-icon-color: var(--dt-color-content-inverse);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--success.c-tag--icon-only{--tag-bg-color: var(--dt-color-support-positive-02);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--success.c-tag--icon-only.c-tag--strong{--tag-bg-color: var(--dt-color-support-positive);--tag-icon-color: var(--dt-color-content-inverse)}.c-tag.c-tag--success.c-tag--strong:not(.c-tag--icon-only){--tag-bg-color: var(--dt-color-support-positive);--tag-icon-bg-color: var(--dt-color-support-positive-02);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-inverse)}.c-tag.c-tag--error{--tag-bg-color: var(--dt-color-support-error-02);--tag-icon-bg-color: var(--dt-color-support-error);--tag-icon-color: var(--dt-color-content-inverse);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--error.c-tag--icon-only{--tag-bg-color: var(--dt-color-support-error-02);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--error.c-tag--icon-only.c-tag--strong{--tag-bg-color: var(--dt-color-support-error);--tag-icon-color: var(--dt-color-content-light)}.c-tag.c-tag--error.c-tag--strong:not(.c-tag--icon-only){--tag-bg-color: var(--dt-color-support-error);--tag-icon-bg-color: var(--dt-color-support-error-02);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-light)}.c-tag.c-tag--warning{--tag-bg-color: var(--dt-color-support-warning-02);--tag-icon-bg-color: var(--dt-color-support-warning);--tag-icon-color: var(--dt-color-content-dark);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--warning.c-tag--icon-only{--tag-bg-color: var(--dt-color-support-warning-02);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--warning.c-tag--icon-only.c-tag--strong{--tag-bg-color: var(--dt-color-support-warning);--tag-icon-color: var(--dt-color-content-dark)}.c-tag.c-tag--warning.c-tag--strong:not(.c-tag--icon-only){--tag-bg-color: var(--dt-color-support-warning);--tag-icon-bg-color: var(--dt-color-support-warning-tonal);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-dark)}.c-tag.c-tag--brand-02{--tag-bg-color: var(--dt-color-support-brand-02);--tag-icon-bg-color: var(--dt-color-support-brand-01);--tag-icon-color: var(--dt-color-content-dark);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-02.c-tag--icon-only{--tag-bg-color: var(--dt-color-support-brand-02);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-03{--tag-bg-color: var(--dt-color-support-brand-03-subtle);--tag-icon-bg-color: var(--dt-color-support-brand-03);--tag-icon-color: var(--dt-color-content-dark);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-03.c-tag--icon-only{--tag-bg-color: var(--dt-color-support-brand-03-subtle);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-03.c-tag--icon-only.c-tag--strong{--tag-bg-color: var(--dt-color-support-brand-03);--tag-icon-color: var(--dt-color-content-dark)}.c-tag.c-tag--brand-03.c-tag--strong:not(.c-tag--icon-only){--tag-bg-color: var(--dt-color-support-brand-03);--tag-icon-bg-color: var(--dt-color-support-brand-03-tonal);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-dark)}.c-tag.c-tag--brand-04{--tag-bg-color: var(--dt-color-support-brand-04-subtle);--tag-icon-bg-color: var(--dt-color-support-brand-04);--tag-icon-color: var(--dt-color-content-dark);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-04.c-tag--icon-only{--tag-bg-color: var(--dt-color-support-brand-04-subtle);--tag-icon-color: var(--dt-color-content-dark)}.c-tag.c-tag--brand-04.c-tag--icon-only.c-tag--strong{--tag-bg-color: var(--dt-color-support-brand-04);--tag-icon-color: var(--dt-color-content-dark)}.c-tag.c-tag--brand-04.c-tag--strong:not(.c-tag--icon-only){--tag-bg-color: var(--dt-color-support-brand-04);--tag-icon-bg-color: var(--dt-color-support-brand-04-tonal);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-dark)}.c-tag.c-tag--brand-05{--tag-bg-color: var(--dt-color-support-brand-05-subtle);--tag-icon-bg-color: var(--dt-color-support-brand-05);--tag-icon-color: var(--dt-color-content-dark);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-05.c-tag--icon-only{--tag-bg-color: var(--dt-color-support-brand-05-subtle);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-05.c-tag--icon-only.c-tag--strong{--tag-bg-color: var(--dt-color-support-brand-05);--tag-icon-color: var(--dt-color-content-dark)}.c-tag.c-tag--brand-05.c-tag--strong:not(.c-tag--icon-only){--tag-bg-color: var(--dt-color-support-brand-05);--tag-icon-bg-color: var(--dt-color-support-brand-05-tonal);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-dark)}.c-tag.c-tag--brand-06{--tag-bg-color: var(--dt-color-support-brand-06-subtle);--tag-icon-bg-color: var(--dt-color-support-brand-06);--tag-icon-color: var(--dt-color-content-light);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-06.c-tag--icon-only{--tag-bg-color: var(--dt-color-support-brand-06-subtle);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-06.c-tag--icon-only.c-tag--strong{--tag-bg-color: var(--dt-color-support-brand-06);--tag-icon-color: var(--dt-color-content-light)}.c-tag.c-tag--brand-06.c-tag--strong:not(.c-tag--icon-only){--tag-bg-color: var(--dt-color-support-brand-06);--tag-icon-bg-color: var(--dt-color-support-brand-06-subtle);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-light)}.c-tag.c-tag--brand-08{--tag-bg-color: var(--dt-color-support-brand-08-subtle);--tag-icon-bg-color: var(--dt-color-support-brand-08);--tag-icon-color: var(--dt-color-content-dark);--tag-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-08.c-tag--icon-only{--tag-bg-color: var(--dt-color-support-brand-08-subtle);--tag-icon-color: var(--dt-color-content-default)}.c-tag.c-tag--brand-08.c-tag--icon-only.c-tag--strong{--tag-bg-color: var(--dt-color-support-brand-08);--tag-icon-color: var(--dt-color-content-dark)}.c-tag.c-tag--brand-08.c-tag--strong:not(.c-tag--icon-only){--tag-bg-color: var(--dt-color-support-brand-08);--tag-icon-bg-color: var(--dt-color-support-brand-08-tonal);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-dark)}.c-tag.c-tag--ghost{--tag-bg-color: var(--dt-color-transparent);--tag-icon-bg-color: var(--dt-color-transparent);--tag-icon-color: var(--dt-color-content-default-solid);--tag-color: var(--dt-color-content-default-solid)}.c-tag.c-tag--ghost.c-tag--icon-only{--tag-bg-color: var(--dt-color-transparent);--tag-icon-color: var(--dt-color-content-default-solid)}.c-tag.c-tag--translucent{--tag-bg-color: var(--dt-color-container-prominent);--tag-icon-bg-color: var(--dt-color-container-neutral);--tag-icon-color: var(--dt-color-content-default-solid);--tag-color: var(--dt-color-content-default-solid);--tag-border-color: var(--dt-color-border-neutral);-webkit-backdrop-filter:blur(var(--dt-blur-prominent));backdrop-filter:blur(var(--dt-blur-prominent))}.c-tag.c-tag--translucent.c-tag--icon-only{--tag-bg-color: var(--dt-color-container-prominent);--tag-icon-color: var(--dt-color-content-default-solid);--tag-border-color: var(--dt-color-border-neutral)}.c-tag.c-tag--outline{--tag-bg-color: var(--dt-color-transparent);--tag-border-color: var(--dt-color-border-strong);--tag-icon-bg-color: var(--dt-color-container-strong);--tag-icon-color: var(--dt-color-content-default);--tag-color: var(--dt-color-content-default-solid)}.c-tag.c-tag--outline.c-tag--icon-only{--tag-icon-color: var(--dt-color-content-default-solid)}.c-tag.c-tag--outline.c-tag--has-icon:not(.c-tag--icon-only) slot[name=icon]{position:relative}.c-tag.c-tag--outline.c-tag--has-icon:not(.c-tag--icon-only) slot[name=icon]:before{content:"";position:absolute;left:-.25px;height:var(--tag-icon-container-size);aspect-ratio:1;z-index:-1;border-radius:inherit;box-shadow:inset 5px 0 0 0 var(--tag-icon-bg-color)}', k = [
   "neutral",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@justeattakeaway/pie-tag",
   "description": "PIE Design System Tag built using Web Components",
-  "version": "0.22.9",
+  "version": "0.22.11",
   "repository": {
     "type": "git",
     "url": "https://github.com/justeattakeaway/pie",
@@ -45,14 +45,14 @@
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "0.9.0",
     "@justeattakeaway/pie-components-config": "0.21.0",
-    "@justeattakeaway/pie-css": "0.29.0",
-    "@justeattakeaway/pie-icons-webc": "1.20.5",
+    "@justeattakeaway/pie-css": "0.31.0",
+    "@justeattakeaway/pie-icons-webc": "1.20.7",
     "@justeattakeaway/pie-monorepo-utils": "0.7.0",
     "@justeattakeaway/pie-wrapper-react": "0.14.3",
     "cem-plugin-module-file-extensions": "0.0.5"
   },
   "dependencies": {
-    "@justeattakeaway/pie-webc-core": "9.0.0"
+    "@justeattakeaway/pie-webc-core": "11.0.0"
   },
   "volta": {
     "extends": "../../../package.json"