@featherds/chips - npm Package Compare versions

Comparing version 0.2.9 to 0.2.10

dist/app.es.js

@@ -20,6 +20,3 @@ var __defProp = Object.defineProperty;
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __require = typeof require !== "undefined" ? require : (x) => {
-  throw new Error('Dynamic require of "' + x + '" is not supported');
-};
-import { pushScopeId, popScopeId, inject, computed, ref, resolveComponent, openBlock, createElementBlock, normalizeClass, renderSlot, createBlock, createCommentVNode, createElementVNode, withModifiers, createVNode, toRef, mergeProps, withCtx, h, provide } from "vue";
+import { inject, computed, ref, resolveComponent, openBlock, createElementBlock, normalizeClass, renderSlot, createBlock, createCommentVNode, createElementVNode, withModifiers, createVNode, toRef, mergeProps, withCtx, h, provide } from "vue";
 import { getSafeId } from "@featherds/utils/id";
@@ -31,3 +28,3 @@ import { useLabelProperty } from "@featherds/composables/LabelProperty";
 import { useRadioGroup } from "@featherds/composables/radio/RadioGroup";
-var Chip_vue_vue_type_style_index_0_scoped_true_lang = '.chip[data-v-3454cba5] {\n  margin: 0;\n  margin-right: 8px;\n  margin-bottom: 8px;\n  height: 32px;\n  list-style: none;\n  display: inline-flex;\n  align-items: center;\n  background-color: var(--feather-border-light-on-surface);\n  border-radius: 16px;\n  border: 1px solid transparent;\n  min-width: 0;\n  max-width: 288px;\n  padding: 0 4px;\n}\n.chip .ripple[data-v-3454cba5] {\n  background-color: var(--feather-state-color-on-neutral);\n  opacity: var(--feather-state-opacity-pressed-on-neutral);\n}\n.chip.selected[data-v-3454cba5],\n.chip .selected[data-v-3454cba5] {\n  background: linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-selected-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-selected-on-neutral))), linear-gradient(var(--feather-border-light-on-surface), var(--feather-border-light-on-surface));\n}\n.chip.hover[data-v-3454cba5]:hover, .chip:hover .hover[data-v-3454cba5] {\n  background: linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-hover-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-hover-on-neutral))), linear-gradient(var(--feather-border-light-on-surface), var(--feather-border-light-on-surface));\n}\n.chip.hover:hover.selected[data-v-3454cba5], .chip:hover .hover.selected[data-v-3454cba5] {\n  background: linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-selected-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-selected-on-neutral))), linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-hover-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-hover-on-neutral))), linear-gradient(var(--feather-border-light-on-surface), var(--feather-border-light-on-surface));\n}\n.chip:focus.focus[data-v-3454cba5], .chip:focus .focus[data-v-3454cba5], .chip.focused.focus[data-v-3454cba5], .chip.focused .focus[data-v-3454cba5] {\n  background: linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-focus-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-focus-on-neutral))), linear-gradient(var(--feather-border-light-on-surface), var(--feather-border-light-on-surface));\n}\n.chip:focus.focus.selected[data-v-3454cba5], .chip:focus .focus.selected[data-v-3454cba5], .chip.focused.focus.selected[data-v-3454cba5], .chip.focused .focus.selected[data-v-3454cba5] {\n  background: linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-selected-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-selected-on-neutral))), linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-focus-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-focus-on-neutral))), linear-gradient(var(--feather-border-light-on-surface), var(--feather-border-light-on-surface));\n}\n.chip:hover:focus .focus.hover[data-v-3454cba5], .chip:hover:focus.focus.hover[data-v-3454cba5], .chip:hover.focused .focus.hover[data-v-3454cba5], .chip:hover.focused.focus.hover[data-v-3454cba5] {\n  background: linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-hover-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-hover-on-neutral))), linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-focus-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-focus-on-neutral))), linear-gradient(var(--feather-border-light-on-surface), var(--feather-border-light-on-surface));\n}\n.chip:hover:focus .focus.hover.selected[data-v-3454cba5], .chip:hover:focus.focus.hover.selected[data-v-3454cba5], .chip:hover.focused .focus.hover.selected[data-v-3454cba5], .chip:hover.focused.focus.hover.selected[data-v-3454cba5] {\n  background: linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-selected-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-selected-on-neutral))), linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-hover-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-hover-on-neutral))), linear-gradient(rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-focus-on-neutral)), rgba(var(--feather-state-color-on-neutral-r), var(--feather-state-color-on-neutral-g), var(--feather-state-color-on-neutral-b), var(--feather-state-opacity-focus-on-neutral))), linear-gradient(var(--feather-border-light-on-surface), var(--feather-border-light-on-surface));\n}\n.chip[data-v-3454cba5]:focus {\n  outline: none;\n}\n.chip.hover[data-v-3454cba5] {\n  cursor: pointer;\n}\n.chip.hover[data-v-3454cba5] .ripple {\n  display: block;\n}\n.chip[data-v-3454cba5] .ripple {\n  display: none;\n}\n.chip[data-v-3454cba5] >  span[role="gridcell"]:not(.chip-delete) {\n  display: flex;\n  flex: 1;\n  min-width: 0;\n}\n.chip[data-v-3454cba5] >  span[role="gridcell"]:not(.chip-delete) .chip-label-button {\n  min-width: 0;\n}\n.chip.focused[data-v-3454cba5]:not(.disabled) {\n  border: 1px solid var(--feather-border-on-surface);\n  outline: 0;\n}\n.chip.focused[data-v-3454cba5]:not(.disabled) .label {\n  color: var(--feather-primary-text-on-surface);\n}\n.chip.disabled[data-v-3454cba5] {\n  color: var(--feather-disabled-text-on-surface);\n  background-color: var(--feather-border-light-on-surface);\n  cursor: default;\n}\n.chip.disabled.selected[data-v-3454cba5],\n.chip.disabled .selected[data-v-3454cba5] {\n  background: var(--feather-border-light-on-surface);\n}\n.chip.disabled.hover[data-v-3454cba5]:hover, .chip.disabled:hover .hover[data-v-3454cba5] {\n  background: var(--feather-border-light-on-surface);\n}\n.chip.disabled.hover:hover.selected[data-v-3454cba5], .chip.disabled:hover .hover.selected[data-v-3454cba5] {\n  background: var(--feather-border-light-on-surface);\n}\n.chip.disabled:focus.focus[data-v-3454cba5], .chip.disabled:focus .focus[data-v-3454cba5] {\n  background: var(--feather-border-light-on-surface);\n}\n.chip.disabled:focus.focus.selected[data-v-3454cba5], .chip.disabled:focus .focus.selected[data-v-3454cba5] {\n  background: var(--feather-border-light-on-surface);\n}\n.chip.disabled:hover:focus .focus.hover[data-v-3454cba5], .chip.disabled:hover:focus.focus.hover[data-v-3454cba5] {\n  background: var(--feather-border-light-on-surface);\n}\n.chip.disabled:hover:focus .focus.hover.selected[data-v-3454cba5], .chip.disabled:hover:focus.focus.hover.selected[data-v-3454cba5] {\n  background: var(--feather-border-light-on-surface);\n}\n.chip.disabled .label[data-v-3454cba5] {\n  color: var(--feather-disabled-text-on-surface);\n  cursor: default;\n}\n.chip.disabled .label[data-v-3454cba5]:hover {\n  color: var(--feather-disabled-text-on-surface);\n}\n.chip.disabled[data-v-3454cba5] .ripple {\n  display: none;\n}\n.chip.disabled[data-v-3454cba5] .chip-icon > .feather-icon {\n  color: var(--feather-disabled-text-on-surface);\n}\n.chip.condensed[data-v-3454cba5] {\n  height: 26px;\n  padding: 0;\n}';
+var Chip_vue_vue_type_style_index_0_scoped_true_lang = "";
 var _export_sfc = (sfc, props) => {
@@ -77,5 +74,3 @@ for (const [key, val] of props) {
 };
-pushScopeId("data-v-3454cba5");
 const _hoisted_1$6 = ["aria-disabled"];
-popScopeId();
 function _sfc_render$7(_ctx, _cache, $props, $setup, $data, $options) {
@@ -98,3 +93,3 @@ const _component_FeatherRipple = resolveComponent("FeatherRipple");
 var Chip = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["render", _sfc_render$7], ["__scopeId", "data-v-3454cba5"]]);
-var DeleteIcon_vue_vue_type_style_index_0_scoped_true_lang = ".chip-delete[data-v-6c60e4e0] {\n  display: inline-flex;\n  align-items: center;\n  pointer-events: auto;\n  position: relative;\n  width: 22px;\n  height: 18px;\n  z-index: 1;\n  flex-shrink: 0;\n}\n.chip-delete .delete-icon[data-v-6c60e4e0] {\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  font-size: 18px;\n  height: 18px;\n  margin-right: 4px;\n  color: var(--feather-secondary-text-on-surface);\n  cursor: pointer;\n}\n.chip-delete .delete-icon[data-v-6c60e4e0]:hover {\n  color: var(--feather-primary-text-on-surface);\n}\n.chip-delete .delete-icon[data-v-6c60e4e0]:focus {\n  outline: 0;\n}";
+var DeleteIcon_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _sfc_main$7 = {
@@ -132,6 +127,4 @@ emits: ["delete"],
 };
-pushScopeId("data-v-6c60e4e0");
 const _hoisted_1$5 = { class: "chip-delete" };
 const _hoisted_2 = ["aria-label", "aria-describedby"];
-popScopeId();
 function _sfc_render$6(_ctx, _cache, $props, $setup, $data, $options) {
@@ -156,3 +149,3 @@ const _component_FeatherIcon = resolveComponent("FeatherIcon");
 var DeleteIcon = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["render", _sfc_render$6], ["__scopeId", "data-v-6c60e4e0"]]);
-var Label_vue_vue_type_style_index_0_scoped_true_lang = ".label[data-v-5fe439b1] {\n  font-family: var(--feather-font-family);\n  font-size: 0.875rem;\n  line-height: 1.375rem;\n  letter-spacing: 0.01786em;\n  font-weight: var(--feather-font-normal);\n  color: var(--feather-primary-text-on-surface);\n  text-rendering: optimizeLegibility;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  color: var(--feather-secondary-text-on-surface);\n  margin-right: 12px;\n  margin-left: 12px;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow-x: hidden;\n  -webkit-user-select: none;\n          user-select: none;\n}";
+var Label_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _sfc_main$6 = {
@@ -179,5 +172,3 @@ data() {
 };
-pushScopeId("data-v-5fe439b1");
 const _hoisted_1$4 = ["title"];
-popScopeId();
 function _sfc_render$5(_ctx, _cache, $props, $setup, $data, $options) {
@@ -193,5 +184,4 @@ return openBlock(), createElementBlock("span", {
 var Label = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$5], ["__scopeId", "data-v-5fe439b1"]]);
-var PreIcon_vue_vue_type_style_index_0_scoped_true_lang = ".chip-icon[data-v-6ef70725] {\n  height: 24px;\n  width: 24px;\n  border-radius: 100%;\n  display: inline-flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  background-color: var(--feather-border-on-surface);\n}\n.chip-icon[data-v-6ef70725] .feather-icon {\n  font-size: 18px;\n  height: 18px;\n  color: var(--feather-secondary-text-on-surface);\n}";
+var PreIcon_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _sfc_main$5 = {};
-pushScopeId("data-v-6ef70725");
 const _hoisted_1$3 = {
@@ -201,3 +191,2 @@ class: "chip-icon",
 };
-popScopeId();
 function _sfc_render$4(_ctx, _cache) {
@@ -209,3 +198,3 @@ return openBlock(), createElementBlock("span", _hoisted_1$3, [
 var PreIcon = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["render", _sfc_render$4], ["__scopeId", "data-v-6ef70725"]]);
-var GridChip_vue_vue_type_style_index_0_scoped_true_lang = "[role=gridcell][data-v-4cf8b170] {\n  height: 100%;\n}\n.chip-label-button[data-v-4cf8b170] {\n  height: 100%;\n  display: inline-flex;\n  align-items: center;\n}\n.chip-label-button[data-v-4cf8b170]:focus {\n  outline: 0;\n}";
+var GridChip_vue_vue_type_style_index_0_scoped_true_lang = "";
 const LABELS = {
@@ -279,5 +268,3 @@ delete: "Remove"
 };
-pushScopeId("data-v-4cf8b170");
 const _hoisted_1$2 = ["aria-disabled"];
-popScopeId();
 function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
@@ -328,3 +315,3 @@ const _component_PreIcon = resolveComponent("PreIcon");
 var GridChip = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$3], ["__scopeId", "data-v-4cf8b170"]]);
-var ReadonlyChip_vue_vue_type_style_index_0_scoped_true_lang = "[role=gridcell][data-v-461384ea] {\n  height: 100%;\n  display: inline-flex;\n  align-items: center;\n}";
+var ReadonlyChip_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _sfc_main$3 = {
@@ -353,5 +340,3 @@ props: {
 };
-pushScopeId("data-v-461384ea");
 const _hoisted_1$1 = ["aria-disabled"];
-popScopeId();
 function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
@@ -390,3 +375,3 @@ const _component_PreIcon = resolveComponent("PreIcon");
 var ReadonlyChip = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$2], ["__scopeId", "data-v-461384ea"]]);
-var RadioChip_vue_vue_type_style_index_0_scoped_true_lang = "[role=radio][data-v-364d0741] {\n  cursor: pointer;\n}";
+var RadioChip_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _sfc_main$2 = {
@@ -524,3 +509,3 @@ props: {
 };
-var FeatherChipList_vue_vue_type_style_index_0_scoped_true_lang = ".chip-list[data-v-f5d5306a] {\n  margin: 0;\n  margin-top: 12px;\n  margin-bottom: 4px;\n  padding: 0;\n  list-style: none;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  flex-wrap: wrap;\n}\n.chip-list + .chip-list[data-v-f5d5306a] {\n  margin-top: 28px;\n}\n.chip-list.condensed[data-v-f5d5306a] .chip {\n  height: 26px;\n  padding: 0;\n}\n.chip-list.single[data-v-f5d5306a] {\n  margin: 0;\n}\n.chip-list.single[data-v-f5d5306a] .chip {\n  margin: 12px 16px;\n}";
+var FeatherChipList_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _sfc_main = {
@@ -576,5 +561,3 @@ model: {
 };
-pushScopeId("data-v-f5d5306a");
 const _hoisted_1 = ["aria-label"];
-popScopeId();
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
@@ -581,0 +564,0 @@ return openBlock(), createElementBlock("div", mergeProps(_ctx.attrs, {

package.json

 {
   "name": "@featherds/chips",
-  "version": "0.2.9",
+  "version": "0.2.10",
   "publishConfig": {
@@ -12,7 +12,7 @@ "access": "public"
   "dependencies": {
-    "@featherds/composables": "^0.2.9",
-    "@featherds/icon": "^0.2.9",
-    "@featherds/radio": "^0.2.9",
-    "@featherds/ripple": "^0.2.9",
-    "@featherds/styles": "^0.2.9",
+    "@featherds/composables": "^0.2.10",
+    "@featherds/icon": "^0.2.10",
+    "@featherds/radio": "^0.2.10",
+    "@featherds/ripple": "^0.2.10",
+    "@featherds/styles": "^0.2.10",
     "vue": "^3.1.0-0"
@@ -25,3 +25,3 @@ },
   "types": "./src/index.d.ts",
-  "gitHead": "28578b1da72bd2bf1f56dded784e513fa34333d8"
+  "gitHead": "945b2b349bd8bab6b37b573ae2bb7fb70e170f4d"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

Possible typosquat attack

Supply chain risk

There is a package with a similar name that is downloaded much more often.

Did you mean
@material/chips

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

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

Number of critical supply chain risk alerts

0

decreased by-100%

Number of low supply chain risk alerts

1

decreased by-66.67%

Worsened metrics

Total package byte prevSize

90299

decreased by-11.72%

Lines of code

1295

decreased by-4.22%

Dependency changes

• Updated@featherds/composables@^0.2.10

• Updated@featherds/icon@^0.2.10

• Updated@featherds/radio@^0.2.10

• Updated@featherds/ripple@^0.2.10

• Updated@featherds/styles@^0.2.10