smoothly 1.0.0-alpha.21 → 1.0.0-alpha.211

package/dist/collection/components/filter/picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/filter/picker/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h, Listen, Prop } from \"@stencil/core\"\nimport { selectively } from \"selectively\"\nimport { isly } from \"isly\"\nimport { Option } from \"../../../model\"\nimport { Filter } from \"../Filter\"\n\n@Component({\n\ttag: \"smoothly-filter-picker\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyFilterPicker implements Filter {\n\tupdating = false\n\toptions: Map<string, { state: Record<string, any>; selected: (selected: boolean) => void }> = new Map<\n\t\tstring,\n\t\t{ state: Record<string, any>; selected: (selected: boolean) => void }\n\t>()\n\t@Prop() label: string\n\t@Prop() property: string\n\t@Prop() multiple = false\n\t@Event() smoothlyFilterUpdate: EventEmitter<Filter.Update>\n\t@Event() smoothlyFilterManipulate: EventEmitter<Filter.Manipulate>\n\tcomponentDidLoad() {\n\t\tthis.smoothlyFilterUpdate.emit(this.update.bind(this))\n\t}\n\t@Listen(\"smoothlyPickerOptionChange\")\n\toptionChangeHandler(event: CustomEvent<Option>) {\n\t\tevent.stopPropagation()\n\t\tthis.options.set(event.detail.value, {\n\t\t\tstate: this.property.split(\".\").reduceRight((r, e) => ({ [e]: r }), event.detail.value),\n\t\t\tselected: event.detail.set.selected,\n\t\t})\n\t}\n\tupdate(expression: selectively.Criteria): void {\n\t\tthis.updating = true\n\t\tif (expression instanceof selectively.And && expression.rules.length > 0)\n\t\t\tfor (const option of this.options.values()) {\n\t\t\t\toption.selected(\n\t\t\t\t\texpression.rules.some(r => r.is(option.state) && this.isCriteria(r, this.property, option.state))\n\t\t\t\t)\n\t\t\t}\n\t\telse\n\t\t\tthis.options.forEach(o => o.selected(false))\n\t\tthis.updating = false\n\t}\n\tprivate isCriteria(criteria: selectively.Rule | undefined, key: string, value: Record<string, any>): unknown {\n\t\tconst [property, ...rest] = key.split(\".\")\n\t\treturn (\n\t\t\tcriteria instanceof selectively.Property &&\n\t\t\tcriteria.name == property &&\n\t\t\t((!this.multiple && criteria.criteria instanceof selectively.Is && criteria.criteria.value == value[property]) ||\n\t\t\t\t(this.multiple &&\n\t\t\t\t\tcriteria.criteria instanceof selectively.Within &&\n\t\t\t\t\tcriteria.criteria.value.some(e => e == value[property])) ||\n\t\t\t\t(criteria.criteria instanceof selectively.Property &&\n\t\t\t\t\tthis.isCriteria(criteria.criteria, rest.join(\".\"), value[property])))\n\t\t)\n\t}\n\tpickerHandler(event: CustomEvent<Record<string, unknown>>) {\n\t\tevent.stopPropagation()\n\t\tif (!this.updating) {\n\t\t\tconst argument = event.detail[this.property]\n\t\t\tconst manipulate = (criteria: selectively.Criteria): selectively.Criteria => {\n\t\t\t\tlet result: selectively.Criteria = criteria\n\t\t\t\tconst newCriteria = this.getCriteria(argument)\n\t\t\t\tif (!(result instanceof selectively.Rule)) {\n\t\t\t\t\tresult = newCriteria ? selectively.and(result, newCriteria) : result\n\t\t\t\t} else if (result instanceof selectively.And) {\n\t\t\t\t\tconst index = result.rules.findIndex(r => this.findInstanceOf(r, this.property))\n\t\t\t\t\t!newCriteria\n\t\t\t\t\t\t? result.rules.splice(index, 1)\n\t\t\t\t\t\t: index == -1\n\t\t\t\t\t\t? result.rules.push(newCriteria)\n\t\t\t\t\t\t: (result.rules[index] = newCriteria)\n\t\t\t\t\tresult = selectively.and(...result.rules)\n\t\t\t\t}\n\t\t\t\treturn result\n\t\t\t}\n\t\t\tthis.smoothlyFilterManipulate.emit(manipulate.bind(this))\n\t\t}\n\t}\n\tfindInstanceOf(criteria: selectively.Criteria, key: string): boolean {\n\t\tconst [property, ...rest] = key.split(\".\")\n\t\treturn (\n\t\t\tcriteria instanceof selectively.Property &&\n\t\t\tcriteria.name == property &&\n\t\t\t(criteria.criteria instanceof selectively.Within ||\n\t\t\t\tcriteria.criteria instanceof selectively.Is ||\n\t\t\t\t(criteria.criteria instanceof selectively.Property && this.findInstanceOf(criteria.criteria, rest.join(\".\"))))\n\t\t)\n\t}\n\tprivate getCriteria(detail: unknown): selectively.Rule | undefined {\n\t\tlet result: selectively.Criteria | undefined\n\t\tif (this.multiple && isly.string().array({ criteria: \"minLength\", value: 1 }).is(detail))\n\t\t\tresult = selectively.within(detail)\n\t\telse if (typeof detail == \"string\")\n\t\t\tresult = selectively.is(detail)\n\t\telse\n\t\t\tresult = undefined\n\t\treturn result && this.property.split(\".\").reduceRight((r, e) => selectively.property(e, r), result)\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<smoothly-picker\n\t\t\t\tname={this.property}\n\t\t\t\tlooks=\"border\"\n\t\t\t\tmultiple={this.multiple}\n\t\t\t\tonSmoothlyInputLooks={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyChange={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyPickerLoaded={e => e.stopPropagation()}\n\t\t\t\tonSmoothlyInput={e => this.pickerHandler(e)}>\n\t\t\t\t{this.label && (\n\t\t\t\t\t<span slot=\"label\">\n\t\t\t\t\t\t{[this.label.slice(0, 1).toUpperCase(), this.label.slice(1, this.label.length)].join(\"\")}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<span slot=\"search\">Search</span>\n\t\t\t\t<slot />\n\t\t\t</smoothly-picker>\n\t\t)\n\t}\n}\n"]}

package/dist/collection/components/filter/picker/style.css

@@ -0,0 +1,8 @@
+:host {
+	display: contents;
+}
+
+:host>smoothly-picker {
+	flex-grow: 1;
+	width: 12.5em;
+}

package/dist/collection/components/filter/style.css

@@ -1,103 +1,88 @@
-* {
-  box-sizing: border-box;
-}
-
 :host {
-  display: flex;
-	flex-direction: column;
-	justify-content: center;
-	align-items: center;
 	position: relative;
-	width: 100%;
-	margin-bottom: 1em; 
+	border: 1px solid rgb(var(--smoothly-medium-tint));
+	margin-left: 1rem;
+	margin-right: 1rem;
+	display: flex;
+	flex-direction: row;
+	align-items: center;
 }
 
-:host > smoothly-input {
-	margin-bottom: 0.5em;
+:host>div::slotted([slot=detail]) {
+	z-index: 5;
 }
 
-section {
-	display: flex;
-	justify-content: center;
-	align-items: center;
+:host::slotted([slot=bar]) {
+	pointer-events: auto;
+	margin-left: 0.3em;
+	margin-right: 0.3em;
 }
 
-.hidden {
-	display: flex;
-	width: 0px;
-	opacity: 0;
+:host>div:empty+smoothly-icon {
+	display: none;
 }
 
-.container {
-	width: inherit;
-	position: relative;
-	z-index: 3;
-	margin: 0.8em 0;
-	opacity: 1;
-	transition: opacity 100ms ease-in-out;
+:host>smoothly-icon {
+	cursor: pointer;
+	margin-left: 0.3em;
+	margin-right: 0.3em;
+	flex-shrink: 0;
 }
 
-.container:after {
-	content:"";
-	height: 100%;
-	width: 100%;
-	border: 1px solid rgb(var(--smoothly-color-contrast));
-	border-radius: 0.25em;
-	position: absolute;
+.close {
+	position: fixed;
+	z-index: 3;
 	top: 0;
 	left: 0;
+	width: 100dvw;
+	height: 100dvh;
+	background: transparent;
+}
+
+.hidden {
+	display: none;
+}
+
+:host>.container {
+	padding: 2em;
+	position: absolute;
+	right: 0.35em;
+	width: fit-content;
+	display: flex;
+	justify-content: center;
+	top: 100%;
+	width: fit-content;
+	z-index: 4;
+	background-color: rgb(var(--smoothly-color));
+	margin: 0.8em -2em;
 }
 
 /* arrow */
 .container:before {
-	content:"";
+	content: "";
 	width: 0.6em;
 	height: 0.6em;
 	transform: rotate(45deg);
-	border-top: 1px solid rgb(var(--smoothly-color-contrast));
-	border-left: 1px solid rgb(var(--smoothly-color-contrast));
-	background-color: rgb(var(--smoothly-default-color));
+	border-top: 1px solid rgb(var(--smoothly-medium-tint));
+	border-left: 1px solid rgb(var(--smoothly-medium-tint));
+	background-color: rgb(var(--smoothly-color));
 	position: absolute;
 	z-index: 3;
 }
 
 /* arrow placement */
 .container.arrow-top:before {
-	left: calc(84.5%);
+	left: calc(91%);
 	top: -5px;
 }
 
-/* wrapper for slot(filters) */
-.container-wrapper {
+.container:after {
+	content: "";
+	height: 100%;
 	width: 100%;
-	padding: 1em;
-	position: relative;
-}
-
-.btn.hidden {
-	margin-right: 0.25em;
-	opacity: 0;
-	cursor:text
-}
-
-.btn.clear {
-	margin-right: 0.25em;
-	opacity: 0.3;
-}
-
-::slotted(div[slot=filter]) {
-	display: grid;
-	grid-template-columns: 1fr;
-	justify-content: center;
-	align-items: center;
-	gap: 0.5em;
-}
-
-:host > smoothly-fom > smoothly-input > section[slot=end] > smoothly-button {
-	font-size: 100%;
-	min-width: min-content;
-	padding: 0;
-	margin: 0;
-	border: none !important;
+	border: 1px solid rgb(var(--smoothly-medium-tint));
+	border-radius: 0.25em;
+	position: absolute;
+	top: 0;
+	left: 0;
 }
-

package/dist/collection/components/filter/toggle/index.js

@@ -0,0 +1,248 @@
+import { h } from "@stencil/core";
+import { selectively } from "selectively";
+export class SmoothlyFilterToggle {
+  constructor() {
+    this.icon = undefined;
+    this.properties = undefined;
+    this.toolTip = undefined;
+    this.not = undefined;
+    this.flip = false;
+    this.active = false;
+  }
+  componentWillLoad() {
+    this.active && this.activeHandler();
+  }
+  componentDidLoad() {
+    this.smoothlyFilterUpdate.emit(this.update.bind(this));
+  }
+  update(expression) {
+    if (expression instanceof selectively.And && expression.rules.length > 0) {
+      this.active = Object.entries(this.properties).every(([key, value]) => expression.rules.some(r => {
+        const criteria = !this.not ? r : r instanceof selectively.Not ? r.criteria : undefined;
+        return value == ""
+          ? !(criteria instanceof selectively.Property && criteria.name == key)
+          : this.isCriteria(criteria, key, value);
+      }));
+    }
+    else
+      this.active = false;
+  }
+  isCriteria(criteria, key, value) {
+    const [property, ...rest] = key.split(".");
+    return (criteria instanceof selectively.Property &&
+      criteria.name == property &&
+      ((criteria.criteria instanceof selectively.Is && criteria.criteria.value == value) ||
+        this.isCriteria(criteria.criteria, rest.join("."), value)));
+  }
+  activeHandler(activate) {
+    const manipulate = (criteria) => {
+      let result = criteria;
+      activate && (this.active = !this.active);
+      if (result instanceof selectively.And) {
+        for (const [key, value] of Object.entries(this.properties)) {
+          const newCriteria = !this.active || (this.active && value == "")
+            ? undefined
+            : this.not
+              ? selectively.not(this.createCriteria(key, value))
+              : this.createCriteria(key, value);
+          const index = result.rules.findIndex(r => this.findInstanceOf(r, key));
+          !newCriteria && index >= 0
+            ? result.rules.splice(index, 1)
+            : !newCriteria
+              ? undefined
+              : index == -1
+                ? result.rules.push(newCriteria)
+                : (result.rules[index] = newCriteria);
+        }
+        result = selectively.and(...result.rules);
+      }
+      return result;
+    };
+    this.smoothlyFilterManipulate.emit(manipulate.bind(this));
+  }
+  createCriteria(key, value) {
+    const [property, ...rest] = key.split(".");
+    return selectively.property(property, rest.length == 0 ? selectively.is(value) : this.createCriteria(rest.join("."), value));
+  }
+  findInstanceOf(criteria, property) {
+    const check = !this.not ? criteria : criteria instanceof selectively.Not ? criteria.criteria : false;
+    const [current, ...rest] = property.split(".");
+    return (check instanceof selectively.Property &&
+      check.name == current &&
+      (rest.length == 0 || (!!check.criteria && this.findInstanceOf(check.criteria, rest.join(".")))));
+  }
+  render() {
+    return (h("smoothly-icon", { fill: "clear", color: this.active ? "success" : "medium", name: (this.active ? `${this.icon}` : `${this.icon}-outline`), toolTip: this.toolTip, onClick: () => this.activeHandler(true) }));
+  }
+  static get is() { return "smoothly-filter-toggle"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["style.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["style.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "icon": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "Icon",
+          "resolved": "Name | \"build-outline\" | \"build-sharp\" | \"help-outline\" | \"help-sharp\" | \"open-outline\" | \"open-sharp\" | \"watch-outline\" | \"watch-sharp\" | \"expand-outline\" | \"expand-sharp\" | \"filter-outline\" | \"filter-sharp\" | \"map-outline\" | \"map-sharp\" | \"at-outline\" | \"at-sharp\" | \"copy-outline\" | \"copy-sharp\" | \"body-outline\" | \"body-sharp\" | \"document-outline\" | \"document-sharp\" | \"code-outline\" | \"code-sharp\" | \"link-outline\" | \"link-sharp\" | \"menu-outline\" | \"menu-sharp\" | \"time-outline\" | \"time-sharp\" | \"ellipse-outline\" | \"ellipse-sharp\" | \"image-outline\" | \"image-sharp\" | \"stop-outline\" | \"stop-sharp\" | \"text-outline\" | \"text-sharp\" | \"download-outline\" | \"download-sharp\" | \"sync-outline\" | \"sync-sharp\" | \"scale-outline\" | \"scale-sharp\" | \"terminal-outline\" | \"terminal-sharp\" | \"square-outline\" | \"square-sharp\" | \"location-outline\" | \"location-sharp\" | \"alert-outline\" | \"alert-sharp\" | \"close-outline\" | \"close-sharp\" | \"print-outline\" | \"print-sharp\" | \"remove-outline\" | \"remove-sharp\" | \"key-outline\" | \"key-sharp\" | \"warning-outline\" | \"warning-sharp\" | \"language-outline\" | \"language-sharp\" | \"push-outline\" | \"push-sharp\" | \"search-outline\" | \"search-sharp\" | \"repeat-outline\" | \"repeat-sharp\" | \"accessibility-outline\" | \"accessibility-sharp\" | \"add-circle-outline\" | \"add-circle-sharp\" | \"add-outline\" | \"add-sharp\" | \"airplane-outline\" | \"airplane-sharp\" | \"alarm-outline\" | \"alarm-sharp\" | \"albums-outline\" | \"albums-sharp\" | \"alert-circle-outline\" | \"alert-circle-sharp\" | \"american-football-outline\" | \"american-football-sharp\" | \"analytics-outline\" | \"analytics-sharp\" | \"aperture-outline\" | \"aperture-sharp\" | \"apps-outline\" | \"apps-sharp\" | \"archive-outline\" | \"archive-sharp\" | \"arrow-back-circle-outline\" | \"arrow-back-circle-sharp\" | \"arrow-back-outline\" | \"arrow-back-sharp\" | \"arrow-down-circle-outline\" | \"arrow-down-circle-sharp\" | \"arrow-down-outline\" | \"arrow-down-sharp\" | \"arrow-forward-circle-outline\" | \"arrow-forward-circle-sharp\" | \"arrow-forward-outline\" | \"arrow-forward-sharp\" | \"arrow-redo-circle-outline\" | \"arrow-redo-circle-sharp\" | \"arrow-redo-outline\" | \"arrow-redo-sharp\" | \"arrow-undo-circle-outline\" | \"arrow-undo-circle-sharp\" | \"arrow-undo-outline\" | \"arrow-undo-sharp\" | \"arrow-up-circle-outline\" | \"arrow-up-circle-sharp\" | \"arrow-up-outline\" | \"arrow-up-sharp\" | \"at-circle-outline\" | \"at-circle-sharp\" | \"attach-outline\" | \"attach-sharp\" | \"backspace-outline\" | \"backspace-sharp\" | \"bag-outline\" | \"bag-sharp\" | \"bag-add-outline\" | \"bag-add-sharp\" | \"bag-check-outline\" | \"bag-check-sharp\" | \"bag-handle-outline\" | \"bag-handle-sharp\" | \"balloon-outline\" | \"balloon-sharp\" | \"ban-outline\" | \"ban-sharp\" | \"bandage-outline\" | \"bandage-sharp\" | \"barbell-outline\" | \"barbell-sharp\" | \"bar-chart-outline\" | \"bar-chart-sharp\" | \"barcode-outline\" | \"barcode-sharp\" | \"baseball-outline\" | \"baseball-sharp\" | \"basketball-outline\" | \"basketball-sharp\" | \"basket-outline\" | \"basket-sharp\" | \"battery-charging-outline\" | \"battery-charging-sharp\" | \"battery-dead-outline\" | \"battery-dead-sharp\" | \"battery-full-outline\" | \"battery-full-sharp\" | \"battery-half-outline\" | \"battery-half-sharp\" | \"beaker-outline\" | \"beaker-sharp\" | \"bed-outline\" | \"bed-sharp\" | \"beer-outline\" | \"beer-sharp\" | \"bicycle-outline\" | \"bicycle-sharp\" | \"bluetooth-outline\" | \"bluetooth-sharp\" | \"boat-outline\" | \"boat-sharp\" | \"bonfire-outline\" | \"bonfire-sharp\" | \"bowling-ball-outline\" | \"bowling-ball-sharp\" | \"bookmarks-outline\" | \"bookmarks-sharp\" | \"bookmark-outline\" | \"bookmark-sharp\" | \"book-outline\" | \"book-sharp\" | \"briefcase-outline\" | \"briefcase-sharp\" | \"browsers-outline\" | \"browsers-sharp\" | \"brush-outline\" | \"brush-sharp\" | \"bug-outline\" | \"bug-sharp\" | \"bulb-outline\" | \"bulb-sharp\" | \"business-outline\" | \"business-sharp\" | \"bus-outline\" | \"bus-sharp\" | \"cafe-outline\" | \"cafe-sharp\" | \"calculator-outline\" | \"calculator-sharp\" | \"calendar-outline\" | \"calendar-sharp\" | \"calendar-clear-outline\" | \"calendar-clear-sharp\" | \"calendar-number-outline\" | \"calendar-number-sharp\" | \"call-outline\" | \"call-sharp\" | \"camera-reverse-outline\" | \"camera-reverse-sharp\" | \"camera-outline\" | \"camera-sharp\" | \"card-outline\" | \"card-sharp\" | \"caret-back-circle-outline\" | \"caret-back-circle-sharp\" | \"caret-back-outline\" | \"caret-back-sharp\" | \"caret-down-circle-outline\" | \"caret-down-circle-sharp\" | \"caret-down-outline\" | \"caret-down-sharp\" | \"caret-forward-circle-outline\" | \"caret-forward-circle-sharp\" | \"caret-forward-outline\" | \"caret-forward-sharp\" | \"caret-up-circle-outline\" | \"caret-up-circle-sharp\" | \"caret-up-outline\" | \"caret-up-sharp\" | \"car-sport-outline\" | \"car-sport-sharp\" | \"car-outline\" | \"car-sharp\" | \"cart-outline\" | \"cart-sharp\" | \"cash-outline\" | \"cash-sharp\" | \"cellular-outline\" | \"cellular-sharp\" | \"chatbox-ellipses-outline\" | \"chatbox-ellipses-sharp\" | \"chatbox-outline\" | \"chatbox-sharp\" | \"chatbubble-ellipses-outline\" | \"chatbubble-ellipses-sharp\" | \"chatbubbles-outline\" | \"chatbubbles-sharp\" | \"chatbubble-outline\" | \"chatbubble-sharp\" | \"checkbox-outline\" | \"checkbox-sharp\" | \"checkmark-circle-outline\" | \"checkmark-circle-sharp\" | \"checkmark-done-circle-outline\" | \"checkmark-done-circle-sharp\" | \"checkmark-done-outline\" | \"checkmark-done-sharp\" | \"checkmark-outline\" | \"checkmark-sharp\" | \"chevron-back-circle-outline\" | \"chevron-back-circle-sharp\" | \"chevron-back-outline\" | \"chevron-back-sharp\" | \"chevron-down-circle-outline\" | \"chevron-down-circle-sharp\" | \"chevron-down-outline\" | \"chevron-down-sharp\" | \"chevron-forward-circle-outline\" | \"chevron-forward-circle-sharp\" | \"chevron-forward-outline\" | \"chevron-forward-sharp\" | \"chevron-up-circle-outline\" | \"chevron-up-circle-sharp\" | \"chevron-up-outline\" | \"chevron-up-sharp\" | \"clipboard-outline\" | \"clipboard-sharp\" | \"close-circle-outline\" | \"close-circle-sharp\" | \"cloud-circle-outline\" | \"cloud-circle-sharp\" | \"cloud-done-outline\" | \"cloud-done-sharp\" | \"cloud-download-outline\" | \"cloud-download-sharp\" | \"cloud-offline-outline\" | \"cloud-offline-sharp\" | \"cloud-outline\" | \"cloud-sharp\" | \"cloud-upload-outline\" | \"cloud-upload-sharp\" | \"cloudy-night-outline\" | \"cloudy-night-sharp\" | \"cloudy-outline\" | \"cloudy-sharp\" | \"code-download-outline\" | \"code-download-sharp\" | \"code-slash-outline\" | \"code-slash-sharp\" | \"code-working-outline\" | \"code-working-sharp\" | \"cog-outline\" | \"cog-sharp\" | \"color-fill-outline\" | \"color-fill-sharp\" | \"color-filter-outline\" | \"color-filter-sharp\" | \"color-palette-outline\" | \"color-palette-sharp\" | \"color-wand-outline\" | \"color-wand-sharp\" | \"compass-outline\" | \"compass-sharp\" | \"construct-outline\" | \"construct-sharp\" | \"contract-outline\" | \"contract-sharp\" | \"contrast-outline\" | \"contrast-sharp\" | \"create-outline\" | \"create-sharp\" | \"crop-outline\" | \"crop-sharp\" | \"cube-outline\" | \"cube-sharp\" | \"cut-outline\" | \"cut-sharp\" | \"desktop-outline\" | \"desktop-sharp\" | \"diamond-outline\" | \"diamond-sharp\" | \"dice-outline\" | \"dice-sharp\" | \"disc-outline\" | \"disc-sharp\" | \"document-attach-outline\" | \"document-attach-sharp\" | \"document-lock-outline\" | \"document-lock-sharp\" | \"documents-outline\" | \"documents-sharp\" | \"document-text-outline\" | \"document-text-sharp\" | \"duplicate-outline\" | \"duplicate-sharp\" | \"ear-outline\" | \"ear-sharp\" | \"earth-outline\" | \"earth-sharp\" | \"easel-outline\" | \"easel-sharp\" | \"egg-outline\" | \"egg-sharp\" | \"ellipsis-horizontal-circle-outline\" | \"ellipsis-horizontal-circle-sharp\" | \"ellipsis-horizontal-outline\" | \"ellipsis-horizontal-sharp\" | \"ellipsis-vertical-circle-outline\" | \"ellipsis-vertical-circle-sharp\" | \"ellipsis-vertical-outline\" | \"ellipsis-vertical-sharp\" | \"enter-outline\" | \"enter-sharp\" | \"exit-outline\" | \"exit-sharp\" | \"eyedrop-outline\" | \"eyedrop-sharp\" | \"eye-off-outline\" | \"eye-off-sharp\" | \"eye-outline\" | \"eye-sharp\" | \"fast-food-outline\" | \"fast-food-sharp\" | \"female-outline\" | \"female-sharp\" | \"file-tray-full-outline\" | \"file-tray-full-sharp\" | \"file-tray-stacked-outline\" | \"file-tray-stacked-sharp\" | \"file-tray-outline\" | \"file-tray-sharp\" | \"film-outline\" | \"film-sharp\" | \"filter-circle-outline\" | \"filter-circle-sharp\" | \"finger-print-outline\" | \"finger-print-sharp\" | \"fish-outline\" | \"fish-sharp\" | \"fitness-outline\" | \"fitness-sharp\" | \"flag-outline\" | \"flag-sharp\" | \"flame-outline\" | \"flame-sharp\" | \"flashlight-outline\" | \"flashlight-sharp\" | \"flash-off-outline\" | \"flash-off-sharp\" | \"flash-outline\" | \"flash-sharp\" | \"flask-outline\" | \"flask-sharp\" | \"flower-outline\" | \"flower-sharp\" | \"folder-open-outline\" | \"folder-open-sharp\" | \"folder-outline\" | \"folder-sharp\" | \"football-outline\" | \"football-sharp\" | \"footsteps-outline\" | \"footsteps-sharp\" | \"funnel-outline\" | \"funnel-sharp\" | \"game-controller-outline\" | \"game-controller-sharp\" | \"gift-outline\" | \"gift-sharp\" | \"git-branch-outline\" | \"git-branch-sharp\" | \"git-commit-outline\" | \"git-commit-sharp\" | \"git-compare-outline\" | \"git-compare-sharp\" | \"git-merge-outline\" | \"git-merge-sharp\" | \"git-network-outline\" | \"git-network-sharp\" | \"git-pull-request-outline\" | \"git-pull-request-sharp\" | \"glasses-outline\" | \"glasses-sharp\" | \"globe-outline\" | \"globe-sharp\" | \"golf-outline\" | \"golf-sharp\" | \"grid-outline\" | \"grid-sharp\" | \"hammer-outline\" | \"hammer-sharp\" | \"hand-left-outline\" | \"hand-left-sharp\" | \"hand-right-outline\" | \"hand-right-sharp\" | \"happy-outline\" | \"happy-sharp\" | \"hardware-chip-outline\" | \"hardware-chip-sharp\" | \"headset-outline\" | \"headset-sharp\" | \"heart-circle-outline\" | \"heart-circle-sharp\" | \"heart-dislike-circle-outline\" | \"heart-dislike-circle-sharp\" | \"heart-dislike-outline\" | \"heart-dislike-sharp\" | \"heart-half-outline\" | \"heart-half-sharp\" | \"heart-outline\" | \"heart-sharp\" | \"help-buoy-outline\" | \"help-buoy-sharp\" | \"help-circle-outline\" | \"help-circle-sharp\" | \"home-outline\" | \"home-sharp\" | \"hourglass-outline\" | \"hourglass-sharp\" | \"ice-cream-outline\" | \"ice-cream-sharp\" | \"id-card-outline\" | \"id-card-sharp\" | \"images-outline\" | \"images-sharp\" | \"infinite-outline\" | \"infinite-sharp\" | \"information-circle-outline\" | \"information-circle-sharp\" | \"information-outline\" | \"information-sharp\" | \"journal-outline\" | \"journal-sharp\" | \"invert-mode-outline\" | \"invert-mode-sharp\" | \"keypad-outline\" | \"keypad-sharp\" | \"laptop-outline\" | \"laptop-sharp\" | \"layers-outline\" | \"layers-sharp\" | \"leaf-outline\" | \"leaf-sharp\" | \"library-outline\" | \"library-sharp\" | \"list-circle-outline\" | \"list-circle-sharp\" | \"list-outline\" | \"list-sharp\" | \"locate-outline\" | \"locate-sharp\" | \"lock-closed-outline\" | \"lock-closed-sharp\" | \"lock-open-outline\" | \"lock-open-sharp\" | \"log-in-outline\" | \"log-in-sharp\" | \"logo-alipay-outline\" | \"logo-alipay-sharp\" | \"logo-amazon-outline\" | \"logo-amazon-sharp\" | \"logo-amplify-outline\" | \"logo-amplify-sharp\" | \"logo-android-outline\" | \"logo-android-sharp\" | \"logo-angular-outline\" | \"logo-angular-sharp\" | \"logo-apple-appstore-outline\" | \"logo-apple-appstore-sharp\" | \"logo-apple-outline\" | \"logo-apple-sharp\" | \"logo-apple-ar-outline\" | \"logo-apple-ar-sharp\" | \"logo-behance-outline\" | \"logo-behance-sharp\" | \"logo-bitbucket-outline\" | \"logo-bitbucket-sharp\" | \"logo-bitcoin-outline\" | \"logo-bitcoin-sharp\" | \"logo-buffer-outline\" | \"logo-buffer-sharp\" | \"logo-capacitor-outline\" | \"logo-capacitor-sharp\" | \"logo-chrome-outline\" | \"logo-chrome-sharp\" | \"logo-closed-captioning-outline\" | \"logo-closed-captioning-sharp\" | \"logo-codepen-outline\" | \"logo-codepen-sharp\" | \"logo-css3-outline\" | \"logo-css3-sharp\" | \"logo-designernews-outline\" | \"logo-designernews-sharp\" | \"logo-deviantart-outline\" | \"logo-deviantart-sharp\" | \"logo-discord-outline\" | \"logo-discord-sharp\" | \"logo-docker-outline\" | \"logo-docker-sharp\" | \"logo-dribbble-outline\" | \"logo-dribbble-sharp\" | \"logo-dropbox-outline\" | \"logo-dropbox-sharp\" | \"logo-edge-outline\" | \"logo-edge-sharp\" | \"logo-electron-outline\" | \"logo-electron-sharp\" | \"logo-euro-outline\" | \"logo-euro-sharp\" | \"logo-facebook-outline\" | \"logo-facebook-sharp\" | \"logo-firebase-outline\" | \"logo-firebase-sharp\" | \"logo-firefox-outline\" | \"logo-firefox-sharp\" | \"logo-flickr-outline\" | \"logo-flickr-sharp\" | \"logo-foursquare-outline\" | \"logo-foursquare-sharp\" | \"logo-github-outline\" | \"logo-github-sharp\" | \"logo-gitlab-outline\" | \"logo-gitlab-sharp\" | \"logo-google-playstore-outline\" | \"logo-google-playstore-sharp\" | \"logo-google-outline\" | \"logo-google-sharp\" | \"logo-hackernews-outline\" | \"logo-hackernews-sharp\" | \"logo-html5-outline\" | \"logo-html5-sharp\" | \"logo-instagram-outline\" | \"logo-instagram-sharp\" | \"logo-ionic-outline\" | \"logo-ionic-sharp\" | \"logo-ionitron-outline\" | \"logo-ionitron-sharp\" | \"logo-javascript-outline\" | \"logo-javascript-sharp\" | \"logo-laravel-outline\" | \"logo-laravel-sharp\" | \"logo-linkedin-outline\" | \"logo-linkedin-sharp\" | \"logo-markdown-outline\" | \"logo-markdown-sharp\" | \"logo-mastodon-outline\" | \"logo-mastodon-sharp\" | \"logo-medium-outline\" | \"logo-medium-sharp\" | \"logo-microsoft-outline\" | \"logo-microsoft-sharp\" | \"logo-nodejs-outline\" | \"logo-nodejs-sharp\" | \"logo-no-smoking-outline\" | \"logo-no-smoking-sharp\" | \"logo-npm-outline\" | \"logo-npm-sharp\" | \"logo-octocat-outline\" | \"logo-octocat-sharp\" | \"logo-paypal-outline\" | \"logo-paypal-sharp\" | \"logo-pinterest-outline\" | \"logo-pinterest-sharp\" | \"logo-playstation-outline\" | \"logo-playstation-sharp\" | \"logo-pwa-outline\" | \"logo-pwa-sharp\" | \"logo-python-outline\" | \"logo-python-sharp\" | \"logo-react-outline\" | \"logo-react-sharp\" | \"logo-reddit-outline\" | \"logo-reddit-sharp\" | \"logo-rss-outline\" | \"logo-rss-sharp\" | \"logo-sass-outline\" | \"logo-sass-sharp\" | \"logo-skype-outline\" | \"logo-skype-sharp\" | \"logo-slack-outline\" | \"logo-slack-sharp\" | \"logo-snapchat-outline\" | \"logo-snapchat-sharp\" | \"logo-soundcloud-outline\" | \"logo-soundcloud-sharp\" | \"logo-stackoverflow-outline\" | \"logo-stackoverflow-sharp\" | \"logo-steam-outline\" | \"logo-steam-sharp\" | \"logo-stencil-outline\" | \"logo-stencil-sharp\" | \"logo-tableau-outline\" | \"logo-tableau-sharp\" | \"logo-tiktok-outline\" | \"logo-tiktok-sharp\" | \"logo-tumblr-outline\" | \"logo-tumblr-sharp\" | \"logo-tux-outline\" | \"logo-tux-sharp\" | \"logo-twitch-outline\" | \"logo-twitch-sharp\" | \"logo-twitter-outline\" | \"logo-twitter-sharp\" | \"logo-usd-outline\" | \"logo-usd-sharp\" | \"log-out-outline\" | \"log-out-sharp\" | \"logo-web-component-outline\" | \"logo-web-component-sharp\" | \"logo-venmo-outline\" | \"logo-venmo-sharp\" | \"logo-whatsapp-outline\" | \"logo-whatsapp-sharp\" | \"logo-vercel-outline\" | \"logo-vercel-sharp\" | \"logo-vimeo-outline\" | \"logo-vimeo-sharp\" | \"logo-windows-outline\" | \"logo-windows-sharp\" | \"logo-vk-outline\" | \"logo-vk-sharp\" | \"logo-wordpress-outline\" | \"logo-wordpress-sharp\" | \"logo-vue-outline\" | \"logo-vue-sharp\" | \"logo-xbox-outline\" | \"logo-xbox-sharp\" | \"logo-xing-outline\" | \"logo-xing-sharp\" | \"logo-yahoo-outline\" | \"logo-yahoo-sharp\" | \"logo-yen-outline\" | \"logo-yen-sharp\" | \"logo-youtube-outline\" | \"logo-youtube-sharp\" | \"magnet-outline\" | \"magnet-sharp\" | \"mail-open-outline\" | \"mail-open-sharp\" | \"mail-outline\" | \"mail-sharp\" | \"mail-unread-outline\" | \"mail-unread-sharp\" | \"male-female-outline\" | \"male-female-sharp\" | \"male-outline\" | \"male-sharp\" | \"man-outline\" | \"man-sharp\" | \"medal-outline\" | \"medal-sharp\" | \"medical-outline\" | \"medical-sharp\" | \"medkit-outline\" | \"medkit-sharp\" | \"megaphone-outline\" | \"megaphone-sharp\" | \"mic-circle-outline\" | \"mic-circle-sharp\" | \"mic-off-circle-outline\" | \"mic-off-circle-sharp\" | \"mic-off-outline\" | \"mic-off-sharp\" | \"mic-outline\" | \"mic-sharp\" | \"moon-outline\" | \"moon-sharp\" | \"move-outline\" | \"move-sharp\" | \"musical-notes-outline\" | \"musical-notes-sharp\" | \"musical-note-outline\" | \"musical-note-sharp\" | \"navigate-circle-outline\" | \"navigate-circle-sharp\" | \"navigate-outline\" | \"navigate-sharp\" | \"newspaper-outline\" | \"newspaper-sharp\" | \"notifications-circle-outline\" | \"notifications-circle-sharp\" | \"notifications-off-circle-outline\" | \"notifications-off-circle-sharp\" | \"notifications-off-outline\" | \"notifications-off-sharp\" | \"notifications-outline\" | \"notifications-sharp\" | \"nuclear-outline\" | \"nuclear-sharp\" | \"nutrition-outline\" | \"nutrition-sharp\" | \"options-outline\" | \"options-sharp\" | \"paper-plane-outline\" | \"paper-plane-sharp\" | \"partly-sunny-outline\" | \"partly-sunny-sharp\" | \"pause-circle-outline\" | \"pause-circle-sharp\" | \"pause-outline\" | \"pause-sharp\" | \"paw-outline\" | \"paw-sharp\" | \"pencil-outline\" | \"pencil-sharp\" | \"people-circle-outline\" | \"people-circle-sharp\" | \"people-outline\" | \"people-sharp\" | \"person-add-outline\" | \"person-add-sharp\" | \"person-circle-outline\" | \"person-circle-sharp\" | \"person-remove-outline\" | \"person-remove-sharp\" | \"person-outline\" | \"person-sharp\" | \"phone-landscape-outline\" | \"phone-landscape-sharp\" | \"phone-portrait-outline\" | \"phone-portrait-sharp\" | \"pie-chart-outline\" | \"pie-chart-sharp\" | \"pin-outline\" | \"pin-sharp\" | \"pint-outline\" | \"pint-sharp\" | \"pizza-outline\" | \"pizza-sharp\" | \"planet-outline\" | \"planet-sharp\" | \"play-back-circle-outline\" | \"play-back-circle-sharp\" | \"play-back-outline\" | \"play-back-sharp\" | \"play-circle-outline\" | \"play-circle-sharp\" | \"play-forward-circle-outline\" | \"play-forward-circle-sharp\" | \"play-forward-outline\" | \"play-forward-sharp\" | \"play-skip-back-circle-outline\" | \"play-skip-back-circle-sharp\" | \"play-skip-back-outline\" | \"play-skip-back-sharp\" | \"play-skip-forward-circle-outline\" | \"play-skip-forward-circle-sharp\" | \"play-skip-forward-outline\" | \"play-skip-forward-sharp\" | \"play-outline\" | \"play-sharp\" | \"podium-outline\" | \"podium-sharp\" | \"power-outline\" | \"power-sharp\" | \"pricetags-outline\" | \"pricetags-sharp\" | \"prism-outline\" | \"prism-sharp\" | \"pricetag-outline\" | \"pricetag-sharp\" | \"pulse-outline\" | \"pulse-sharp\" | \"qr-code-outline\" | \"qr-code-sharp\" | \"radio-button-off-outline\" | \"radio-button-off-sharp\" | \"radio-button-on-outline\" | \"radio-button-on-sharp\" | \"radio-outline\" | \"radio-sharp\" | \"rainy-outline\" | \"rainy-sharp\" | \"reader-outline\" | \"reader-sharp\" | \"receipt-outline\" | \"receipt-sharp\" | \"recording-outline\" | \"recording-sharp\" | \"refresh-circle-outline\" | \"refresh-circle-sharp\" | \"refresh-outline\" | \"refresh-sharp\" | \"reload-circle-outline\" | \"reload-circle-sharp\" | \"reload-outline\" | \"reload-sharp\" | \"remove-circle-outline\" | \"remove-circle-sharp\" | \"reorder-four-outline\" | \"reorder-four-sharp\" | \"reorder-three-outline\" | \"reorder-three-sharp\" | \"reorder-two-outline\" | \"reorder-two-sharp\" | \"resize-outline\" | \"resize-sharp\" | \"restaurant-outline\" | \"restaurant-sharp\" | \"return-down-back-outline\" | \"return-down-back-sharp\" | \"return-down-forward-outline\" | \"return-down-forward-sharp\" | \"return-up-back-outline\" | \"return-up-back-sharp\" | \"return-up-forward-outline\" | \"return-up-forward-sharp\" | \"ribbon-outline\" | \"ribbon-sharp\" | \"rocket-outline\" | \"rocket-sharp\" | \"rose-outline\" | \"rose-sharp\" | \"sad-outline\" | \"sad-sharp\" | \"save-outline\" | \"save-sharp\" | \"scan-circle-outline\" | \"scan-circle-sharp\" | \"scan-outline\" | \"scan-sharp\" | \"school-outline\" | \"school-sharp\" | \"search-circle-outline\" | \"search-circle-sharp\" | \"send-outline\" | \"send-sharp\" | \"server-outline\" | \"server-sharp\" | \"settings-outline\" | \"settings-sharp\" | \"shapes-outline\" | \"shapes-sharp\" | \"share-social-outline\" | \"share-social-sharp\" | \"share-outline\" | \"share-sharp\" | \"shield-checkmark-outline\" | \"shield-checkmark-sharp\" | \"shield-half-outline\" | \"shield-half-sharp\" | \"shield-outline\" | \"shield-sharp\" | \"shirt-outline\" | \"shirt-sharp\" | \"shuffle-outline\" | \"shuffle-sharp\" | \"skull-outline\" | \"skull-sharp\" | \"snow-outline\" | \"snow-sharp\" | \"sparkles-outline\" | \"sparkles-sharp\" | \"speedometer-outline\" | \"speedometer-sharp\" | \"star-half-outline\" | \"star-half-sharp\" | \"star-outline\" | \"star-sharp\" | \"stats-chart-outline\" | \"stats-chart-sharp\" | \"stop-circle-outline\" | \"stop-circle-sharp\" | \"stopwatch-outline\" | \"stopwatch-sharp\" | \"storefront-outline\" | \"storefront-sharp\" | \"subway-outline\" | \"subway-sharp\" | \"sunny-outline\" | \"sunny-sharp\" | \"swap-horizontal-outline\" | \"swap-horizontal-sharp\" | \"swap-vertical-outline\" | \"swap-vertical-sharp\" | \"sync-circle-outline\" | \"sync-circle-sharp\" | \"tablet-landscape-outline\" | \"tablet-landscape-sharp\" | \"tablet-portrait-outline\" | \"tablet-portrait-sharp\" | \"telescope-outline\" | \"telescope-sharp\" | \"tennisball-outline\" | \"tennisball-sharp\" | \"thermometer-outline\" | \"thermometer-sharp\" | \"thumbs-down-outline\" | \"thumbs-down-sharp\" | \"thumbs-up-outline\" | \"thumbs-up-sharp\" | \"thunderstorm-outline\" | \"thunderstorm-sharp\" | \"ticket-outline\" | \"ticket-sharp\" | \"timer-outline\" | \"timer-sharp\" | \"today-outline\" | \"today-sharp\" | \"toggle-outline\" | \"toggle-sharp\" | \"trail-sign-outline\" | \"trail-sign-sharp\" | \"train-outline\" | \"train-sharp\" | \"transgender-outline\" | \"transgender-sharp\" | \"trash-bin-outline\" | \"trash-bin-sharp\" | \"trash-outline\" | \"trash-sharp\" | \"trending-down-outline\" | \"trending-down-sharp\" | \"trending-up-outline\" | \"trending-up-sharp\" | \"triangle-outline\" | \"triangle-sharp\" | \"trophy-outline\" | \"trophy-sharp\" | \"tv-outline\" | \"tv-sharp\" | \"umbrella-outline\" | \"umbrella-sharp\" | \"unlink-outline\" | \"unlink-sharp\" | \"videocam-off-outline\" | \"videocam-off-sharp\" | \"walk-outline\" | \"walk-sharp\" | \"wallet-outline\" | \"wallet-sharp\" | \"water-outline\" | \"water-sharp\" | \"videocam-outline\" | \"videocam-sharp\" | \"wifi-outline\" | \"wifi-sharp\" | \"wine-outline\" | \"wine-sharp\" | \"volume-high-outline\" | \"volume-high-sharp\" | \"volume-low-outline\" | \"volume-low-sharp\" | \"volume-medium-outline\" | \"volume-medium-sharp\" | \"volume-mute-outline\" | \"volume-mute-sharp\" | \"volume-off-outline\" | \"volume-off-sharp\" | \"woman-outline\" | \"woman-sharp\"",
+          "references": {
+            "Icon": {
+              "location": "import",
+              "path": "../../../model"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "icon",
+        "reflect": false
+      },
+      "properties": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "Record<string, string>",
+          "resolved": "{ [x: string]: string; }",
+          "references": {
+            "Record": {
+              "location": "global"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        }
+      },
+      "toolTip": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "tool-tip",
+        "reflect": false
+      },
+      "not": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "not",
+        "reflect": false
+      },
+      "flip": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "flip",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "active": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "active",
+        "reflect": false,
+        "defaultValue": "false"
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "smoothlyFilterUpdate",
+        "name": "smoothlyFilterUpdate",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "Filter.Update",
+          "resolved": "(expression: Criteria) => void",
+          "references": {
+            "Filter": {
+              "location": "import",
+              "path": "../Filter"
+            }
+          }
+        }
+      }, {
+        "method": "smoothlyFilterManipulate",
+        "name": "smoothlyFilterManipulate",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "Filter.Manipulate",
+          "resolved": "(criteria: Criteria) => Criteria",
+          "references": {
+            "Filter": {
+              "location": "import",
+              "path": "../Filter"
+            }
+          }
+        }
+      }];
+  }
+}
+//# sourceMappingURL=index.js.map

package/dist/collection/components/filter/toggle/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/filter/toggle/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h, Prop } from \"@stencil/core\"\nimport { selectively } from \"selectively\"\nimport { Icon } from \"../../../model\"\nimport { Filter } from \"../Filter\"\n\n@Component({\n\ttag: \"smoothly-filter-toggle\",\n\tstyleUrl: \"style.css\",\n\tscoped: true,\n})\nexport class SmoothlyFilterToggle {\n\t@Prop() icon: Icon\n\t@Prop() properties: Record<string, string>\n\t@Prop() toolTip: string\n\t@Prop() not: boolean\n\t@Prop({ reflect: true }) flip = false\n\t@Prop({ mutable: true }) active = false\n\t@Event() smoothlyFilterUpdate: EventEmitter<Filter.Update>\n\t@Event() smoothlyFilterManipulate: EventEmitter<Filter.Manipulate>\n\tcomponentWillLoad() {\n\t\tthis.active && this.activeHandler()\n\t}\n\tcomponentDidLoad() {\n\t\tthis.smoothlyFilterUpdate.emit(this.update.bind(this))\n\t}\n\tupdate(expression: selectively.Criteria): void {\n\t\tif (expression instanceof selectively.And && expression.rules.length > 0) {\n\t\t\tthis.active = Object.entries(this.properties).every(([key, value]) =>\n\t\t\t\texpression.rules.some(r => {\n\t\t\t\t\tconst criteria = !this.not ? r : r instanceof selectively.Not ? r.criteria : undefined\n\t\t\t\t\treturn value == \"\"\n\t\t\t\t\t\t? !(criteria instanceof selectively.Property && criteria.name == key)\n\t\t\t\t\t\t: this.isCriteria(criteria, key, value)\n\t\t\t\t})\n\t\t\t)\n\t\t} else\n\t\t\tthis.active = false\n\t}\n\tprivate isCriteria(criteria: selectively.Rule | undefined, key: string, value: string): boolean {\n\t\tconst [property, ...rest] = key.split(\".\")\n\t\treturn (\n\t\t\tcriteria instanceof selectively.Property &&\n\t\t\tcriteria.name == property &&\n\t\t\t((criteria.criteria instanceof selectively.Is && criteria.criteria.value == value) ||\n\t\t\t\tthis.isCriteria(criteria.criteria, rest.join(\".\"), value))\n\t\t)\n\t}\n\n\tactiveHandler(activate?: true) {\n\t\tconst manipulate: Filter.Manipulate = (criteria: selectively.Criteria): selectively.Criteria => {\n\t\t\tlet result: selectively.Criteria = criteria\n\t\t\tactivate && (this.active = !this.active)\n\t\t\tif (result instanceof selectively.And) {\n\t\t\t\tfor (const [key, value] of Object.entries(this.properties)) {\n\t\t\t\t\tconst newCriteria =\n\t\t\t\t\t\t!this.active || (this.active && value == \"\")\n\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t: this.not\n\t\t\t\t\t\t\t? selectively.not(this.createCriteria(key, value))\n\t\t\t\t\t\t\t: this.createCriteria(key, value)\n\t\t\t\t\tconst index = result.rules.findIndex(r => this.findInstanceOf(r, key))\n\t\t\t\t\t!newCriteria && index >= 0\n\t\t\t\t\t\t? result.rules.splice(index, 1)\n\t\t\t\t\t\t: !newCriteria\n\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t: index == -1\n\t\t\t\t\t\t? result.rules.push(newCriteria)\n\t\t\t\t\t\t: (result.rules[index] = newCriteria)\n\t\t\t\t}\n\t\t\t\tresult = selectively.and(...result.rules)\n\t\t\t}\n\t\t\treturn result\n\t\t}\n\t\tthis.smoothlyFilterManipulate.emit(manipulate.bind(this))\n\t}\n\tcreateCriteria(key: string, value: string): selectively.Rule {\n\t\tconst [property, ...rest] = key.split(\".\")\n\t\treturn selectively.property(\n\t\t\tproperty,\n\t\t\trest.length == 0 ? selectively.is(value) : this.createCriteria(rest.join(\".\"), value)\n\t\t)\n\t}\n\tfindInstanceOf(criteria: selectively.Criteria, property: string): boolean {\n\t\tconst check = !this.not ? criteria : criteria instanceof selectively.Not ? criteria.criteria : false\n\t\tconst [current, ...rest] = property.split(\".\")\n\t\treturn (\n\t\t\tcheck instanceof selectively.Property &&\n\t\t\tcheck.name == current &&\n\t\t\t(rest.length == 0 || (!!check.criteria && this.findInstanceOf(check.criteria, rest.join(\".\"))))\n\t\t)\n\t}\n\trender() {\n\t\treturn (\n\t\t\t<smoothly-icon\n\t\t\t\tfill=\"clear\"\n\t\t\t\tcolor={this.active ? \"success\" : \"medium\"}\n\t\t\t\tname={(this.active ? `${this.icon}` : `${this.icon}-outline`) as Icon}\n\t\t\t\ttoolTip={this.toolTip}\n\t\t\t\tonClick={() => this.activeHandler(true)}\n\t\t\t/>\n\t\t)\n\t}\n}\n"]}

package/dist/collection/components/filter/toggle/style.css

@@ -0,0 +1,8 @@
+:host {
+	position: relative;
+	display: inline-block;
+}
+
+:host[flip] {
+	transform: scaleX(-1);
+}