@nectary/components 5.29.0 → 5.29.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundle.js +2 -2
- package/package.json +3 -3
- package/skeleton/index.js +1 -1
- package/skeleton-item/index.js +1 -1
package/bundle.js
CHANGED
|
@@ -13019,7 +13019,7 @@ class SheetTitle extends NectaryElement {
|
|
|
13019
13019
|
};
|
|
13020
13020
|
}
|
|
13021
13021
|
defineCustomElement("sinch-sheet-title", SheetTitle);
|
|
13022
|
-
const templateHTML$e = '<style>:host{display:block;box-sizing:border-box;--sinch-local-shape-radius:var(--sinch-sys-shape-radius-m, 4px)}#content{width:100%;height:100%;min-height:100%;box-sizing:border-box;background-color:var(--sinch-
|
|
13022
|
+
const templateHTML$e = '<style>:host{display:block;box-sizing:border-box;--sinch-local-shape-radius:var(--sinch-sys-shape-radius-m, 4px)}#content{width:100%;height:100%;min-height:100%;box-sizing:border-box;background-color:var(--sinch-comp-skeleton-color-background);overflow:hidden;position:relative;border-radius:var(--sinch-local-shape-radius)}:host([size=xs]){height:var(--sinch-sys-size-xs,24px);--sinch-local-shape-radius:var(--sinch-sys-shape-radius-xs, 4px)}:host([size="s"]){height:var(--sinch-sys-size-s,32px);--sinch-local-shape-radius:var(--sinch-sys-shape-radius-s, 4px)}:host(:not([size])),:host([size="m"]){height:var(--sinch-sys-size-m,40px);--sinch-local-shape-radius:var(--sinch-sys-shape-radius-m, 4px)}:host([size="l"]){height:var(--sinch-sys-size-l,48px);--sinch-local-shape-radius:var(--sinch-sys-shape-radius-l, 4px)}</style><div id="content"></div>';
|
|
13023
13023
|
const template$e = document.createElement("template");
|
|
13024
13024
|
template$e.innerHTML = templateHTML$e;
|
|
13025
13025
|
class SkeletonItem extends NectaryElement {
|
|
@@ -13043,7 +13043,7 @@ const getUid = () => crypto.getRandomValues(new Uint8Array(21)).reduce((id, byte
|
|
|
13043
13043
|
}
|
|
13044
13044
|
return `${id}_`;
|
|
13045
13045
|
}, "");
|
|
13046
|
-
const templateHTML$d = '<style>:host{display:block;position:relative}#wrapper{position:relative;display:flex;flex-direction:column;gap:16px;overflow:hidden;box-sizing:border-box}:host([card]:not([card=false])) #wrapper{background-color:var(--sinch-sys-color-surface-primary-default);border:1px solid var(--sinch-sys-color-border-subtle);border-radius:var(--sinch-sys-shape-radius-l);padding:16px}#shimmer{position:absolute;inset:0;overflow:hidden;pointer-events:none}#shimmer-inner{position:absolute;left:0;top:0;width:400%;height:100%;background-image:linear-gradient(90deg,transparent 0,transparent
|
|
13046
|
+
const templateHTML$d = '<style>:host{display:block;position:relative}#wrapper{position:relative;display:flex;flex-direction:column;gap:16px;overflow:hidden;box-sizing:border-box}:host([card]:not([card=false])) #wrapper{background-color:var(--sinch-sys-color-surface-primary-default);border:1px solid var(--sinch-sys-color-border-subtle);border-radius:var(--sinch-sys-shape-radius-l);padding:16px}#shimmer{position:absolute;inset:0;overflow:hidden;pointer-events:none}#shimmer-inner{position:absolute;left:0;top:0;width:400%;height:100%;background-image:linear-gradient(90deg,transparent 0,transparent 30%,var(--sinch-comp-skeleton-color-shimmer) 50%,transparent 53%,transparent 100%);background-size:100% 100%}#shimmer.animated #shimmer-inner{animation:nectary-skeleton-shimmer 2s linear infinite}@media (prefers-reduced-motion:reduce){#shimmer.animated #shimmer-inner{animation:none}}@keyframes nectary-skeleton-shimmer{0%{transform:translateX(-75%)}100%{transform:translateX(0)}}#svg{display:block;width:0;height:0}</style><svg id="svg"><defs><clipPath id="clip"></clipPath></defs></svg><div id="wrapper"><slot></slot><div id="shimmer"><div id="shimmer-inner"></div></div></div>';
|
|
13047
13047
|
const template$d = document.createElement("template");
|
|
13048
13048
|
template$d.innerHTML = templateHTML$d;
|
|
13049
13049
|
const BORDER_WIDTH = 1;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nectary/components",
|
|
3
|
-
"version": "5.29.
|
|
3
|
+
"version": "5.29.1",
|
|
4
4
|
"files": [
|
|
5
5
|
"**/*/*.css",
|
|
6
6
|
"**/*/*.json",
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
26
|
"@babel/runtime": "^7.22.15",
|
|
27
|
-
"@nectary/assets": "3.6.
|
|
27
|
+
"@nectary/assets": "3.6.9"
|
|
28
28
|
},
|
|
29
29
|
"devDependencies": {
|
|
30
30
|
"@babel/cli": "^7.22.15",
|
|
@@ -40,6 +40,6 @@
|
|
|
40
40
|
"vite": "^7.0.6"
|
|
41
41
|
},
|
|
42
42
|
"peerDependencies": {
|
|
43
|
-
"@nectary/theme-base": "1.15.
|
|
43
|
+
"@nectary/theme-base": "1.15.1"
|
|
44
44
|
}
|
|
45
45
|
}
|
package/skeleton/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { isAttrTrue, shouldReduceMotion, getCssVar, attrValueToInteger } from "../utils/dom.js";
|
|
2
2
|
import { defineCustomElement, NectaryElement } from "../utils/element.js";
|
|
3
3
|
import { getUid } from "../utils/uid.js";
|
|
4
|
-
const templateHTML = '<style>:host{display:block;position:relative}#wrapper{position:relative;display:flex;flex-direction:column;gap:16px;overflow:hidden;box-sizing:border-box}:host([card]:not([card=false])) #wrapper{background-color:var(--sinch-sys-color-surface-primary-default);border:1px solid var(--sinch-sys-color-border-subtle);border-radius:var(--sinch-sys-shape-radius-l);padding:16px}#shimmer{position:absolute;inset:0;overflow:hidden;pointer-events:none}#shimmer-inner{position:absolute;left:0;top:0;width:400%;height:100%;background-image:linear-gradient(90deg,transparent 0,transparent
|
|
4
|
+
const templateHTML = '<style>:host{display:block;position:relative}#wrapper{position:relative;display:flex;flex-direction:column;gap:16px;overflow:hidden;box-sizing:border-box}:host([card]:not([card=false])) #wrapper{background-color:var(--sinch-sys-color-surface-primary-default);border:1px solid var(--sinch-sys-color-border-subtle);border-radius:var(--sinch-sys-shape-radius-l);padding:16px}#shimmer{position:absolute;inset:0;overflow:hidden;pointer-events:none}#shimmer-inner{position:absolute;left:0;top:0;width:400%;height:100%;background-image:linear-gradient(90deg,transparent 0,transparent 30%,var(--sinch-comp-skeleton-color-shimmer) 50%,transparent 53%,transparent 100%);background-size:100% 100%}#shimmer.animated #shimmer-inner{animation:nectary-skeleton-shimmer 2s linear infinite}@media (prefers-reduced-motion:reduce){#shimmer.animated #shimmer-inner{animation:none}}@keyframes nectary-skeleton-shimmer{0%{transform:translateX(-75%)}100%{transform:translateX(0)}}#svg{display:block;width:0;height:0}</style><svg id="svg"><defs><clipPath id="clip"></clipPath></defs></svg><div id="wrapper"><slot></slot><div id="shimmer"><div id="shimmer-inner"></div></div></div>';
|
|
5
5
|
const template = document.createElement("template");
|
|
6
6
|
template.innerHTML = templateHTML;
|
|
7
7
|
const BORDER_WIDTH = 1;
|
package/skeleton-item/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { defineCustomElement, NectaryElement } from "../utils/element.js";
|
|
2
|
-
const templateHTML = '<style>:host{display:block;box-sizing:border-box;--sinch-local-shape-radius:var(--sinch-sys-shape-radius-m, 4px)}#content{width:100%;height:100%;min-height:100%;box-sizing:border-box;background-color:var(--sinch-
|
|
2
|
+
const templateHTML = '<style>:host{display:block;box-sizing:border-box;--sinch-local-shape-radius:var(--sinch-sys-shape-radius-m, 4px)}#content{width:100%;height:100%;min-height:100%;box-sizing:border-box;background-color:var(--sinch-comp-skeleton-color-background);overflow:hidden;position:relative;border-radius:var(--sinch-local-shape-radius)}:host([size=xs]){height:var(--sinch-sys-size-xs,24px);--sinch-local-shape-radius:var(--sinch-sys-shape-radius-xs, 4px)}:host([size="s"]){height:var(--sinch-sys-size-s,32px);--sinch-local-shape-radius:var(--sinch-sys-shape-radius-s, 4px)}:host(:not([size])),:host([size="m"]){height:var(--sinch-sys-size-m,40px);--sinch-local-shape-radius:var(--sinch-sys-shape-radius-m, 4px)}:host([size="l"]){height:var(--sinch-sys-size-l,48px);--sinch-local-shape-radius:var(--sinch-sys-shape-radius-l, 4px)}</style><div id="content"></div>';
|
|
3
3
|
const template = document.createElement("template");
|
|
4
4
|
template.innerHTML = templateHTML;
|
|
5
5
|
class SkeletonItem extends NectaryElement {
|