New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

skateui

Package Overview
Dependencies
Maintainers
1
Versions
96
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

skateui - npm Package Compare versions

Comparing version 0.1.106 to 0.1.107

dist/skateui/p-6efec2e2.entry.js

17

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

@@ -328,2 +328,4 @@ 'use strict';

dummyHandler.bind(this)({ computedStyle: window.getComputedStyle(this.host) });
// dispatch mounted event when finished loading
this.el.dispatchEvent(new CustomEvent('mounted'));
}

@@ -507,3 +509,3 @@ disconnectedCallback() {

}
this.host.addEventListener('keyup', (e) => {
this.host.addEventListener('keydown', (e) => {
if (e.key === 'Enter') {

@@ -537,5 +539,5 @@ // checkbox, radio should be able to trigger click on enter key

};
this.host.addEventListener('keyup', (e) => {
this.host.addEventListener('keydown', (e) => {
if (e.key === 'Enter') {
// checkbox, radio should be able to trigger click on enter key
// checkbox, radio should be able to trigger click on enter | space key
clicker();

@@ -657,3 +659,3 @@ }

const suiNavCss = ":host{display:block;width:100%;padding:8px;transform:translateY(var(--nav-top));position:var(--nav-position);top:0;z-index:1}";
const suiNavCss = ":host{display:block;width:100%;transform:translateY(var(--nav-top));position:var(--nav-position);top:0;z-index:1}";

@@ -1027,3 +1029,3 @@ const SuiNav = class {

if (this.value) {
select.setAttribute('value', this.value);
select.value = this.value;
}

@@ -1053,3 +1055,3 @@ this.valueDisplay = ((_a = select.getElementsByTagName('option')[select.selectedIndex || 0]) === null || _a === void 0 ? void 0 : _a.textContent) || select.value || '';

if (!this.isMultiple) {
select.style.setProperty('opacity', '0');
select.style.setProperty('color', 'rgba(0 0 0 / 0%)');
}

@@ -1062,2 +1064,3 @@ this.host.append(select);

var _a;
// console.log({n,o});
if (n !== o) {

@@ -1112,2 +1115,4 @@ this.el.value = n;

cloneEvents.bind(this)(this.el);
// dispatch mounted event when finished loading
this.el.dispatchEvent(new CustomEvent('mounted'));
}

@@ -1114,0 +1119,0 @@ disconnectedCallback() {

2

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

@@ -42,2 +42,4 @@ import { h, Host } from '@stencil/core';

dummyHandler.bind(this)({ computedStyle: window.getComputedStyle(this.host) });
// dispatch mounted event when finished loading
this.el.dispatchEvent(new CustomEvent('mounted'));
}

@@ -44,0 +46,0 @@ disconnectedCallback() {

8

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

@@ -86,3 +86,3 @@ import { Host, h } from '@stencil/core'; //Method,

}
this.host.addEventListener('keyup', (e) => {
this.host.addEventListener('keydown', (e) => {
if (e.key === 'Enter') {

@@ -116,5 +116,5 @@ // checkbox, radio should be able to trigger click on enter key

};
this.host.addEventListener('keyup', (e) => {
this.host.addEventListener('keydown', (e) => {
if (e.key === 'Enter') {
// checkbox, radio should be able to trigger click on enter key
// checkbox, radio should be able to trigger click on enter | space key
clicker();

@@ -274,3 +274,3 @@ }

},
"defaultValue": "(() => {\n // add input element manually because shadow dom input is not recognized by forms\n let inputType = this.host.getAttribute('type'); // always use getAttribute() for proper casing\n // let value = this.host.getAttribute('value');\n let value = this.value;\n if (!inputType || !this.availableTypes.includes(inputType)) {\n this.host.setAttribute('type', 'text');\n inputType = 'text';\n }\n\n this.isButton = inputType === 'reset' || inputType === 'submit';\n this.isChecker = inputType === 'checkbox' || inputType === 'radio';\n\n const previousInput = this.host.getElementsByTagName('input')?.[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\n // button input use additional span to display text\n const previousSpan = this.host.getElementsByTagName('span')?.[0];\n if (previousSpan) {\n if (previousSpan && previousSpan.hasAttribute('slot') && previousSpan.getAttribute('slot') === 'value' && this.isButton) {\n previousSpan.innerHTML = value || (inputType === 'submit' ? 'Submit' : 'Reset');\n }\n else {\n previousSpan.remove();\n }\n }\n return previousInput;\n }\n\n // create new element\n const input = document.createElement('input');\n if (value) {\n input.setAttribute('value', value);\n }\n // if (this.value) {\n // input.setAttribute('value', this.value);\n // }\n\n // setup new slot name\n // slot name is to prevent users adding custom elements\n input.setAttribute('slot', this.slotName);\n\n if (!this.availableTypes.includes(inputType)) {\n // type not available (yet)\n this.host.prepend(input);\n return input;\n }\n\n // add eventlistener manually if type is checkbox | radio | reset | submit\n const clicker = () => {\n if (this.host.attributes.getNamedItem('disabled')) {\n // does not trigger dummy when disabled\n return;\n }\n this.el.click();\n };\n\n if (this.isButton) {\n // hidden\n input.setAttribute('hidden', '');\n\n // tab index is on host\n if (!this.host.hasAttribute('disabled')) {\n this.host.setAttribute('tabindex', '0');\n }\n\n this.host.addEventListener('keyup', (e) => {\n if (e.key === 'Enter') {\n // checkbox, radio should be able to trigger click on enter key\n clicker();\n }\n });\n this.host.addEventListener('click', clicker);\n\n // add button text\n let span = document.createElement('span');\n // span.innerHTML = this.value || (inputType === 'submit' ? 'Submit' : 'Reset');\n span.innerHTML = value || (inputType === 'submit' ? 'Submit' : 'Reset');\n span.setAttribute('slot', 'value');\n this.host.prepend(span);\n }\n\n else if (this.isChecker) {\n // hidden\n input.setAttribute('hidden', '');\n\n // tab index is on host\n if (!this.host.hasAttribute('disabled')) {\n this.host.setAttribute('tabindex', '0');\n }\n\n // add eventlistener manually if type is checkbox | radio\n const clicker = () => {\n if (this.host.attributes.getNamedItem('disabled')) {\n // does not trigger dummy when disabled\n return;\n }\n this.el.click();\n };\n\n this.host.addEventListener('keyup', (e) => {\n if (e.key === 'Enter') {\n // checkbox, radio should be able to trigger click on enter key\n clicker();\n }\n }, true);\n\n this.host.addEventListener('click', clicker);\n\n input.addEventListener('change', () => {\n // keep track of checked, update dom\n if (inputType === 'checkbox') {\n if (input.checked) {\n this.host.setAttribute('checked', '');\n }\n else {\n this.host.removeAttribute('checked');\n }\n }\n\n if (inputType === 'radio') {\n // triggers only on checked, since radio button can't uncheck from user input\n let radios = document.getElementsByName(input.name);\n for (let i = 0; i < radios.length; i++) {\n if (\n (radios[i] instanceof HTMLInputElement) &&\n radios[i].getAttribute('type') === 'radio' &&\n radios[i] !== input\n ) {\n radios[i].parentElement.removeAttribute('checked'); // remove checked attribute from it's host\n }\n }\n this.host.setAttribute('checked', '');\n }\n });\n }\n\n else {\n // tab index is on input element\n\n for (const [key, value] of Object.entries({\n // set important styles\n // these value should not be editable\n 'box-sizing': 'border-box',\n display: 'block',\n 'font-size': 'inherit',\n 'line-height': '1.2'\n })) {\n input.style.setProperty(key, value, 'important');\n }\n // for (const [key, value] of Object.entries({\n // 'background-color': 'transparent',\n // color: 'inherit',\n // border: 'none',\n // })) {\n // input.style.setProperty(key, value);\n // }\n }\n\n this.host.prepend(input);\n return input;\n })()"
"defaultValue": "(() => {\n // add input element manually because shadow dom input is not recognized by forms\n let inputType = this.host.getAttribute('type'); // always use getAttribute() for proper casing\n // let value = this.host.getAttribute('value');\n let value = this.value;\n if (!inputType || !this.availableTypes.includes(inputType)) {\n this.host.setAttribute('type', 'text');\n inputType = 'text';\n }\n\n this.isButton = inputType === 'reset' || inputType === 'submit';\n this.isChecker = inputType === 'checkbox' || inputType === 'radio';\n\n const previousInput = this.host.getElementsByTagName('input')?.[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\n // button input use additional span to display text\n const previousSpan = this.host.getElementsByTagName('span')?.[0];\n if (previousSpan) {\n if (previousSpan && previousSpan.hasAttribute('slot') && previousSpan.getAttribute('slot') === 'value' && this.isButton) {\n previousSpan.innerHTML = value || (inputType === 'submit' ? 'Submit' : 'Reset');\n }\n else {\n previousSpan.remove();\n }\n }\n return previousInput;\n }\n\n // create new element\n const input = document.createElement('input');\n if (value) {\n input.setAttribute('value', value);\n }\n // if (this.value) {\n // input.setAttribute('value', this.value);\n // }\n\n // setup new slot name\n // slot name is to prevent users adding custom elements\n input.setAttribute('slot', this.slotName);\n\n if (!this.availableTypes.includes(inputType)) {\n // type not available (yet)\n this.host.prepend(input);\n return input;\n }\n\n // add eventlistener manually if type is checkbox | radio | reset | submit\n const clicker = () => {\n if (this.host.attributes.getNamedItem('disabled')) {\n // does not trigger dummy when disabled\n return;\n }\n this.el.click();\n };\n\n if (this.isButton) {\n // hidden\n input.setAttribute('hidden', '');\n\n // tab index is on host\n if (!this.host.hasAttribute('disabled')) {\n this.host.setAttribute('tabindex', '0');\n }\n\n this.host.addEventListener('keydown', (e) => {\n if (e.key === 'Enter') {\n // checkbox, radio should be able to trigger click on enter key\n clicker();\n }\n });\n this.host.addEventListener('click', clicker);\n\n // add button text\n let span = document.createElement('span');\n // span.innerHTML = this.value || (inputType === 'submit' ? 'Submit' : 'Reset');\n span.innerHTML = value || (inputType === 'submit' ? 'Submit' : 'Reset');\n span.setAttribute('slot', 'value');\n this.host.prepend(span);\n }\n\n else if (this.isChecker) {\n // hidden\n input.setAttribute('hidden', '');\n\n // tab index is on host\n if (!this.host.hasAttribute('disabled')) {\n this.host.setAttribute('tabindex', '0');\n }\n\n // add eventlistener manually if type is checkbox | radio\n const clicker = () => {\n if (this.host.attributes.getNamedItem('disabled')) {\n // does not trigger dummy when disabled\n return;\n }\n this.el.click();\n };\n\n this.host.addEventListener('keydown', (e) => {\n if (e.key === 'Enter') {\n // checkbox, radio should be able to trigger click on enter | space key\n clicker();\n }\n }, true);\n\n this.host.addEventListener('click', clicker);\n\n input.addEventListener('change', () => {\n // keep track of checked, update dom\n if (inputType === 'checkbox') {\n if (input.checked) {\n this.host.setAttribute('checked', '');\n }\n else {\n this.host.removeAttribute('checked');\n }\n }\n\n if (inputType === 'radio') {\n // triggers only on checked, since radio button can't uncheck from user input\n let radios = document.getElementsByName(input.name);\n for (let i = 0; i < radios.length; i++) {\n if (\n (radios[i] instanceof HTMLInputElement) &&\n radios[i].getAttribute('type') === 'radio' &&\n radios[i] !== input\n ) {\n radios[i].parentElement.removeAttribute('checked'); // remove checked attribute from it's host\n }\n }\n this.host.setAttribute('checked', '');\n }\n });\n }\n\n else {\n // tab index is on input element\n\n for (const [key, value] of Object.entries({\n // set important styles\n // these value should not be editable\n 'box-sizing': 'border-box',\n display: 'block',\n 'font-size': 'inherit',\n 'line-height': '1.2'\n })) {\n input.style.setProperty(key, value, 'important');\n }\n // for (const [key, value] of Object.entries({\n // 'background-color': 'transparent',\n // color: 'inherit',\n // border: 'none',\n // })) {\n // input.style.setProperty(key, value);\n // }\n }\n\n this.host.prepend(input);\n return input;\n })()"
}

@@ -277,0 +277,0 @@ };

9

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

@@ -23,3 +23,3 @@ import { Host, h } from '@stencil/core';

if (this.value) {
select.setAttribute('value', this.value);
select.value = this.value;
}

@@ -49,3 +49,3 @@ this.valueDisplay = ((_a = select.getElementsByTagName('option')[select.selectedIndex || 0]) === null || _a === void 0 ? void 0 : _a.textContent) || select.value || '';

if (!this.isMultiple) {
select.style.setProperty('opacity', '0');
select.style.setProperty('color', 'rgba(0 0 0 / 0%)');
}

@@ -58,2 +58,3 @@ this.host.append(select);

var _a;
// console.log({n,o});
if (n !== o) {

@@ -108,2 +109,4 @@ this.el.value = n;

cloneEvents.bind(this)(this.el);
// dispatch mounted event when finished loading
this.el.dispatchEvent(new CustomEvent('mounted'));
}

@@ -164,3 +167,3 @@ disconnectedCallback() {

},
"defaultValue": "(() => {\n const select = document.createElement('select');\n\n if (this.host.children.length) {\n let len = this.host.children.length;\n while (len--) {\n select.prepend(this.host.children[len]);\n }\n }\n\n if (this.value) {\n select.setAttribute('value', this.value);\n }\n\n this.valueDisplay = select.getElementsByTagName('option')[select.selectedIndex || 0]?.textContent || select.value || '';\n\n select.addEventListener('change', () => {\n if (select.value !== this.value) {\n this.value = select.value || '';\n }\n });\n\n for (const [key, value] of Object.entries({\n // set important styles\n // these value should not be editable\n background: 'transparent',\n 'box-sizing': 'border-box',\n border: 'none',\n display: 'block',\n 'font-size': 'inherit',\n 'line-height': '1.2',\n '-webkit-appearance': 'none',\n '-moz-appearance': 'none',\n 'appearance': 'none',\n 'cursor': this.isMultiple ? 'default' : 'pointer'\n })) {\n select.style.setProperty(key, value, 'important');\n }\n\n if (!this.isMultiple) {\n select.style.setProperty('opacity', '0');\n }\n\n this.host.append(select);\n return select;\n })()"
"defaultValue": "(() => {\n const select = document.createElement('select');\n\n if (this.host.children.length) {\n let len = this.host.children.length;\n while (len--) {\n select.prepend(this.host.children[len]);\n }\n }\n\n if (this.value) {\n select.value = this.value;\n }\n\n this.valueDisplay = select.getElementsByTagName('option')[select.selectedIndex || 0]?.textContent || select.value || '';\n select.addEventListener('change', () => {\n if (select.value !== this.value) {\n this.value = select.value || '';\n }\n });\n\n for (const [key, value] of Object.entries({\n // set important styles\n // these value should not be editable\n background: 'transparent',\n 'box-sizing': 'border-box',\n border: 'none',\n display: 'block',\n 'font-size': 'inherit',\n 'line-height': '1.2',\n '-webkit-appearance': 'none',\n '-moz-appearance': 'none',\n 'appearance': 'none',\n 'cursor': this.isMultiple ? 'default' : 'pointer'\n })) {\n select.style.setProperty(key, value, 'important');\n }\n\n if (!this.isMultiple) {\n select.style.setProperty('color', 'rgba(0 0 0 / 0%)');\n }\n\n this.host.append(select);\n return select;\n })()"
}

@@ -167,0 +170,0 @@ };

17

dist/esm/sui-button_6.entry.js

@@ -324,2 +324,4 @@ import { r as registerInstance, h, H as Host, g as getElement } from './index-20a01340.js';

dummyHandler.bind(this)({ computedStyle: window.getComputedStyle(this.host) });
// dispatch mounted event when finished loading
this.el.dispatchEvent(new CustomEvent('mounted'));
}

@@ -503,3 +505,3 @@ disconnectedCallback() {

}
this.host.addEventListener('keyup', (e) => {
this.host.addEventListener('keydown', (e) => {
if (e.key === 'Enter') {

@@ -533,5 +535,5 @@ // checkbox, radio should be able to trigger click on enter key

};
this.host.addEventListener('keyup', (e) => {
this.host.addEventListener('keydown', (e) => {
if (e.key === 'Enter') {
// checkbox, radio should be able to trigger click on enter key
// checkbox, radio should be able to trigger click on enter | space key
clicker();

@@ -653,3 +655,3 @@ }

const suiNavCss = ":host{display:block;width:100%;padding:8px;transform:translateY(var(--nav-top));position:var(--nav-position);top:0;z-index:1}";
const suiNavCss = ":host{display:block;width:100%;transform:translateY(var(--nav-top));position:var(--nav-position);top:0;z-index:1}";

@@ -1023,3 +1025,3 @@ const SuiNav = class {

if (this.value) {
select.setAttribute('value', this.value);
select.value = this.value;
}

@@ -1049,3 +1051,3 @@ this.valueDisplay = ((_a = select.getElementsByTagName('option')[select.selectedIndex || 0]) === null || _a === void 0 ? void 0 : _a.textContent) || select.value || '';

if (!this.isMultiple) {
select.style.setProperty('opacity', '0');
select.style.setProperty('color', 'rgba(0 0 0 / 0%)');
}

@@ -1058,2 +1060,3 @@ this.host.append(select);

var _a;
// console.log({n,o});
if (n !== o) {

@@ -1108,2 +1111,4 @@ this.el.value = n;

cloneEvents.bind(this)(this.el);
// dispatch mounted event when finished loading
this.el.dispatchEvent(new CustomEvent('mounted'));
}

@@ -1110,0 +1115,0 @@ disconnectedCallback() {

2

dist/skateui/skateui.esm.js

@@ -1,1 +0,1 @@

import{p as i,b as e}from"./p-42f55d11.js";(()=>{const e=import.meta.url,t={};return""!==e&&(t.resourcesUrl=new URL(".",e).href),i(t)})().then((i=>e([["p-25412ada",[[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]}]]]],i)));
import{p as e,b as i}from"./p-42f55d11.js";(()=>{const i=import.meta.url,t={};return""!==i&&(t.resourcesUrl=new URL(".",i).href),e(t)})().then((e=>i([["p-6efec2e2",[[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]}]]]],e)));

2

package.json
{
"name": "skateui",
"version": "0.1.106",
"version": "0.1.107",
"description": "Stencil Component Starter",

@@ -5,0 +5,0 @@ "main": "dist/index.cjs.js",

dist/skateui/p-25412ada.entry.js
dist/collection/components/sui-nav/sui-nav.css

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc