skateui - npm Package Compare versions

Comparing version 0.1.113 to 0.1.114

dist/cjs/sui-button_8.cjs.entry.js

@@ -649,3 +649,3 @@ 'use strict';
   render() {
-    return (index.h(index.Host, null, index.h("svg", { version: "1.1", x: "0px", y: "0px", viewBox: "0 0 24 24", fill: "currentColor" }, index.h("path", { d: "M9.31,18.6L3,12.29l1.54-1.51l4.77,4.77L19.46,5.4L21,6.91L9.31,18.6z" })), index.h("slot", { name: this.slotName }), index.h("slot", { name: 'value' })));
+    return (index.h(index.Host, null, index.h("svg", { version: "1.1", x: "0px", y: "0px", viewBox: "0 0 24 24", fill: "currentColor" }, index.h("polygon", { points: "9.32,19.57 2.22,12.48 4.91,9.79 9.32,14.2 19.09,4.43 21.78,7.11     " })), index.h("slot", { name: this.slotName }), index.h("slot", { name: 'value' })));
   }
@@ -1132,3 +1132,3 @@ get host() { return index.getElement(this); }
 
-const suiTextareaCss = ":host{height:auto;display:inline-block;vertical-align:top;position:relative;max-width:100%;padding:0.6em 0.66em;width:12em;border-radius:4px;box-shadow:-1px -1px 2px -1px rgba(0, 0, 0, 0.5), 1px 1px 1px rgba(255, 255, 255, 0.33), inset 0 0 0 1px rgba(0, 0, 0, 0.25);overflow-y:auto}div{position:relative;display:block;width:100%;height:100%;min-height:1em}div::before{content:attr(data-value) \" \";display:block;white-space:pre-wrap;word-break:break-word;color:rgba(0, 0, 0, 0)}::slotted([slot]){resize:none;overflow:hidden;border:none;box-sizing:border-box;background-color:transparent;color:inherit;white-space:pre-wrap;word-break:break-word;display:block;outline:none;inset:0;padding:0;margin:0;width:100%;position:absolute;min-height:1em}";
+const suiTextareaCss = ":host{height:auto;display:inline-block;vertical-align:top;position:relative;max-width:100%;padding:0.6em 0.66em;width:12em;border-radius:4px;box-shadow:-1px -1px 2px -1px rgba(0, 0, 0, 0.5), 1px 1px 1px rgba(255, 255, 255, 0.33), inset 0 0 0 1px rgba(0, 0, 0, 0.25);overflow-y:auto;white-space:pre-wrap;word-break:break-word}span.nested-value{display:none}div{position:relative;display:block;width:100%;min-height:1em;white-space:inherit;word-break:inherit}div::before{content:attr(data-value) \" \";display:block;white-space:inherit;word-break:inherit;color:rgba(0, 0, 0, 0)}::slotted([slot]){resize:none;overflow:hidden;border:none;box-sizing:border-box;background-color:transparent;color:inherit;display:block;outline:none;inset:0;padding:0;margin:0;width:100%;min-height:1em;position:absolute}";
 
@@ -1156,3 +1156,2 @@ const SuiTextarea = class {
       }
-      // textarea.setAttribute('rows', '1');
       textarea.setAttribute('slot', this.slotName);
@@ -1162,2 +1161,12 @@ textarea.addEventListener('input', e => {
       });
+      for (let key of [
+        'font-size',
+        'line-height',
+        'font-family',
+        'font-weight',
+        'white-space',
+        'word-break'
+      ]) {
+        textarea.style.setProperty(key, 'inherit', 'important'); //hostCss.getPropertyValue(key)
+      }
       this.host.prepend(textarea);
@@ -1173,2 +1182,12 @@ return textarea;
   componentDidLoad() {
+    let nestedValue = this.host.childNodes;
+    for (let idx = 0; idx < nestedValue.length; idx++) {
+      let el = nestedValue[idx];
+      console.log(el.nodeType);
+      console.log(el.tagName);
+      console.log(el.tagName === undefined);
+      if (el.nodeType === 3 && el.tagName === undefined) {
+        this.el.append(el);
+      }
+    }
     dummyHandler.bind(this)({
@@ -1178,10 +1197,2 @@ computedStyle: window.getComputedStyle(this.host),
       copyStyle: (hostCss) => {
-        for (let key of [
-          'font-size',
-          'line-height',
-          'font-family',
-          'font-weight'
-        ]) {
-          this.el.style.setProperty(key, hostCss.getPropertyValue(key), 'important');
-        }
         // make text input fill the host
@@ -1215,3 +1226,3 @@ let needAdjustment = false;
       // },
-      excludeAttribute: ['value'],
+      excludeAttribute: ['value', 'rows', 'cols'],
       appendIdToSlotElement: true
@@ -1226,3 +1237,3 @@ });
   render() {
-    return (index.h(index.Host, null, index.h("div", { "data-value": this.value }, index.h("slot", { name: this.slotName }))));
+    return (index.h(index.Host, null, index.h("div", { "data-value": this.value }, index.h("slot", { name: this.slotName }), index.h("span", { class: 'nested-value' }, index.h("slot", null)))));
   }
@@ -1229,0 +1240,0 @@ get host() { return index.getElement(this); }

dist/collection/components/sui-input/sui-input.js

@@ -227,3 +227,3 @@ import { Host, h } from '@stencil/core'; //Method,
   render() {
-    return (h(Host, null, h("svg", { version: "1.1", x: "0px", y: "0px", viewBox: "0 0 24 24", fill: "currentColor" }, h("path", { d: "M9.31,18.6L3,12.29l1.54-1.51l4.77,4.77L19.46,5.4L21,6.91L9.31,18.6z" })), h("slot", { name: this.slotName }), h("slot", { name: 'value' })));
+    return (h(Host, null, h("svg", { version: "1.1", x: "0px", y: "0px", viewBox: "0 0 24 24", fill: "currentColor" }, h("polygon", { points: "9.32,19.57 2.22,12.48 4.91,9.79 9.32,14.2 19.09,4.43 21.78,7.11     " })), h("slot", { name: this.slotName }), h("slot", { name: 'value' })));
   }
@@ -230,0 +230,0 @@ static get is() { return "sui-input"; }

dist/collection/components/sui-textarea/sui-textarea.js

@@ -23,3 +23,2 @@ import { Host, h } from '@stencil/core';
       }
-      // textarea.setAttribute('rows', '1');
       textarea.setAttribute('slot', this.slotName);
@@ -29,2 +28,12 @@ textarea.addEventListener('input', e => {
       });
+      for (let key of [
+        'font-size',
+        'line-height',
+        'font-family',
+        'font-weight',
+        'white-space',
+        'word-break'
+      ]) {
+        textarea.style.setProperty(key, 'inherit', 'important'); //hostCss.getPropertyValue(key)
+      }
       this.host.prepend(textarea);
@@ -40,2 +49,12 @@ return textarea;
   componentDidLoad() {
+    let nestedValue = this.host.childNodes;
+    for (let idx = 0; idx < nestedValue.length; idx++) {
+      let el = nestedValue[idx];
+      console.log(el.nodeType);
+      console.log(el.tagName);
+      console.log(el.tagName === undefined);
+      if (el.nodeType === 3 && el.tagName === undefined) {
+        this.el.append(el);
+      }
+    }
     dummyHandler.bind(this)({
@@ -45,10 +64,2 @@ computedStyle: window.getComputedStyle(this.host),
       copyStyle: (hostCss) => {
-        for (let key of [
-          'font-size',
-          'line-height',
-          'font-family',
-          'font-weight'
-        ]) {
-          this.el.style.setProperty(key, hostCss.getPropertyValue(key), 'important');
-        }
         // make text input fill the host
@@ -82,3 +93,3 @@ let needAdjustment = false;
       // },
-      excludeAttribute: ['value'],
+      excludeAttribute: ['value', 'rows', 'cols'],
       appendIdToSlotElement: true
@@ -93,3 +104,3 @@ });
   render() {
-    return (h(Host, null, h("div", { "data-value": this.value }, h("slot", { name: this.slotName }))));
+    return (h(Host, null, h("div", { "data-value": this.value }, h("slot", { name: this.slotName }), h("span", { class: 'nested-value' }, h("slot", null)))));
   }
@@ -145,3 +156,3 @@ static get is() { return "sui-textarea"; }
         },
-        "defaultValue": "(() => {\n    let value = this.value;\n\n    const previousInput = this.host.getElementsByTagName('textarea')?.[0];\n    if (previousInput && previousInput.hasAttribute('slot')) {\n      // if element already exists, return\n      // element can already exist when working on hot reloads\n\n      // setup new slot name\n      previousInput.setAttribute('slot', this.slotName);\n      return previousInput;\n    }\n\n    // create new element\n    const textarea = document.createElement('textarea');\n    if (value) {\n      textarea.value = value.toString();\n    }\n    // textarea.setAttribute('rows', '1');\n    textarea.setAttribute('slot', this.slotName);\n\n    textarea.addEventListener('input', e => {\n      this.value = (e.target as HTMLTextAreaElement).value;\n    });\n\n    this.host.prepend(textarea);\n    return textarea;\n  })()"
+        "defaultValue": "(() => {\n    let value = this.value;\n\n    const previousInput = this.host.getElementsByTagName('textarea')?.[0];\n    if (previousInput && previousInput.hasAttribute('slot')) {\n      // if element already exists, return\n      // element can already exist when working on hot reloads\n\n      // setup new slot name\n      previousInput.setAttribute('slot', this.slotName);\n      return previousInput;\n    }\n\n    // create new element\n    const textarea = document.createElement('textarea');\n    if (value) {\n      textarea.value = value.toString();\n    }\n\n    textarea.setAttribute('slot', this.slotName);\n\n    textarea.addEventListener('input', e => {\n      this.value = (e.target as HTMLTextAreaElement).value;\n    });\n\n    for (let key of [\n      'font-size',\n      'line-height',\n      'font-family',\n      'font-weight',\n      'white-space',\n      'word-break'\n    ]) {\n      textarea.style.setProperty(key, 'inherit', 'important');//hostCss.getPropertyValue(key)\n    }\n\n    this.host.prepend(textarea);\n    return textarea;\n\n  })()"
       }
@@ -148,0 +159,0 @@ };

dist/esm/sui-button_8.entry.js

@@ -645,3 +645,3 @@ import { r as registerInstance, h, H as Host, g as getElement } from './index-d4102470.js';
   render() {
-    return (h(Host, null, h("svg", { version: "1.1", x: "0px", y: "0px", viewBox: "0 0 24 24", fill: "currentColor" }, h("path", { d: "M9.31,18.6L3,12.29l1.54-1.51l4.77,4.77L19.46,5.4L21,6.91L9.31,18.6z" })), h("slot", { name: this.slotName }), h("slot", { name: 'value' })));
+    return (h(Host, null, h("svg", { version: "1.1", x: "0px", y: "0px", viewBox: "0 0 24 24", fill: "currentColor" }, h("polygon", { points: "9.32,19.57 2.22,12.48 4.91,9.79 9.32,14.2 19.09,4.43 21.78,7.11     " })), h("slot", { name: this.slotName }), h("slot", { name: 'value' })));
   }
@@ -1128,3 +1128,3 @@ get host() { return getElement(this); }
 
-const suiTextareaCss = ":host{height:auto;display:inline-block;vertical-align:top;position:relative;max-width:100%;padding:0.6em 0.66em;width:12em;border-radius:4px;box-shadow:-1px -1px 2px -1px rgba(0, 0, 0, 0.5), 1px 1px 1px rgba(255, 255, 255, 0.33), inset 0 0 0 1px rgba(0, 0, 0, 0.25);overflow-y:auto}div{position:relative;display:block;width:100%;height:100%;min-height:1em}div::before{content:attr(data-value) \" \";display:block;white-space:pre-wrap;word-break:break-word;color:rgba(0, 0, 0, 0)}::slotted([slot]){resize:none;overflow:hidden;border:none;box-sizing:border-box;background-color:transparent;color:inherit;white-space:pre-wrap;word-break:break-word;display:block;outline:none;inset:0;padding:0;margin:0;width:100%;position:absolute;min-height:1em}";
+const suiTextareaCss = ":host{height:auto;display:inline-block;vertical-align:top;position:relative;max-width:100%;padding:0.6em 0.66em;width:12em;border-radius:4px;box-shadow:-1px -1px 2px -1px rgba(0, 0, 0, 0.5), 1px 1px 1px rgba(255, 255, 255, 0.33), inset 0 0 0 1px rgba(0, 0, 0, 0.25);overflow-y:auto;white-space:pre-wrap;word-break:break-word}span.nested-value{display:none}div{position:relative;display:block;width:100%;min-height:1em;white-space:inherit;word-break:inherit}div::before{content:attr(data-value) \" \";display:block;white-space:inherit;word-break:inherit;color:rgba(0, 0, 0, 0)}::slotted([slot]){resize:none;overflow:hidden;border:none;box-sizing:border-box;background-color:transparent;color:inherit;display:block;outline:none;inset:0;padding:0;margin:0;width:100%;min-height:1em;position:absolute}";
 
@@ -1152,3 +1152,2 @@ const SuiTextarea = class {
       }
-      // textarea.setAttribute('rows', '1');
       textarea.setAttribute('slot', this.slotName);
@@ -1158,2 +1157,12 @@ textarea.addEventListener('input', e => {
       });
+      for (let key of [
+        'font-size',
+        'line-height',
+        'font-family',
+        'font-weight',
+        'white-space',
+        'word-break'
+      ]) {
+        textarea.style.setProperty(key, 'inherit', 'important'); //hostCss.getPropertyValue(key)
+      }
       this.host.prepend(textarea);
@@ -1169,2 +1178,12 @@ return textarea;
   componentDidLoad() {
+    let nestedValue = this.host.childNodes;
+    for (let idx = 0; idx < nestedValue.length; idx++) {
+      let el = nestedValue[idx];
+      console.log(el.nodeType);
+      console.log(el.tagName);
+      console.log(el.tagName === undefined);
+      if (el.nodeType === 3 && el.tagName === undefined) {
+        this.el.append(el);
+      }
+    }
     dummyHandler.bind(this)({
@@ -1174,10 +1193,2 @@ computedStyle: window.getComputedStyle(this.host),
       copyStyle: (hostCss) => {
-        for (let key of [
-          'font-size',
-          'line-height',
-          'font-family',
-          'font-weight'
-        ]) {
-          this.el.style.setProperty(key, hostCss.getPropertyValue(key), 'important');
-        }
         // make text input fill the host
@@ -1211,3 +1222,3 @@ let needAdjustment = false;
       // },
-      excludeAttribute: ['value'],
+      excludeAttribute: ['value', 'rows', 'cols'],
       appendIdToSlotElement: true
@@ -1222,3 +1233,3 @@ });
   render() {
-    return (h(Host, null, h("div", { "data-value": this.value }, h("slot", { name: this.slotName }))));
+    return (h(Host, null, h("div", { "data-value": this.value }, h("slot", { name: this.slotName }), h("span", { class: 'nested-value' }, h("slot", null)))));
   }
@@ -1225,0 +1236,0 @@ get host() { return getElement(this); }

dist/skateui/skateui.esm.js

@@ -1,1 +0,1 @@
-import{p as e,b as i}from"./p-453d08b3.js";(()=>{const i=import.meta.url,t={};return""!==i&&(t.resourcesUrl=new URL(".",i).href),e(t)})().then((e=>i([["p-869cf6ed",[[1,"sui-button",null,[[0,"click","clickEventHandler"],[0,"keyup","keyEventHandler"]]],[1,"sui-flextext",{minSize:[1026,"min-size"],maxSize:[1026,"max-size"]}],[1,"sui-input",{value:[8],el:[16]}],[1,"sui-nav",{autoHide:[2,"auto-hide"]}],[1,"sui-overlay",{position:[1],transitionTime:[1,"transition-time"],close:[64],open:[64]}],[1,"sui-select",{value:[8],el:[16],leftPadding:[32],rightPadding:[32],topPadding:[32],valueDisplay:[32]}],[1,"sui-textarea",{value:[8],el:[16]}],[1,"sui-tooltip",{classNames:[32],tipBackgroundColor:[32]},[[1,"mouseenter","setPosition"]]]]]],e)));
+import{p as e,b as i}from"./p-453d08b3.js";(()=>{const i=import.meta.url,t={};return""!==i&&(t.resourcesUrl=new URL(".",i).href),e(t)})().then((e=>i([["p-3fb1f760",[[1,"sui-button",null,[[0,"click","clickEventHandler"],[0,"keyup","keyEventHandler"]]],[1,"sui-flextext",{minSize:[1026,"min-size"],maxSize:[1026,"max-size"]}],[1,"sui-input",{value:[8],el:[16]}],[1,"sui-nav",{autoHide:[2,"auto-hide"]}],[1,"sui-overlay",{position:[1],transitionTime:[1,"transition-time"],close:[64],open:[64]}],[1,"sui-select",{value:[8],el:[16],leftPadding:[32],rightPadding:[32],topPadding:[32],valueDisplay:[32]}],[1,"sui-textarea",{value:[8],el:[16]}],[1,"sui-tooltip",{classNames:[32],tipBackgroundColor:[32]},[[1,"mouseenter","setPosition"]]]]]],e)));

package.json

 {
   "name": "skateui",
-  "version": "0.1.113",
+  "version": "0.1.114",
   "description": "Stencil Component Starter",
@@ -5,0 +5,0 @@ "main": "dist/index.cjs.js",

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

528292

increased by0.38%

Lines of code

9960

increased by0.4%

Worsened metrics

Number of low supply chain risk alerts

13

increased by8.33%

No dependency changes