@getflip/swirl-components 0.259.0 → 0.260.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components.json +1 -1
- package/dist/cjs/swirl-date-input.cjs.entry.js +2 -2
- package/dist/cjs/swirl-option-list_2.cjs.entry.js +4 -1
- package/dist/collection/assets/pdfjs/pdf.worker.min.js +1 -1
- package/dist/collection/components/swirl-date-input/swirl-date-input.css +7 -0
- package/dist/collection/components/swirl-date-input/swirl-date-input.js +1 -1
- package/dist/collection/components/swirl-date-input/swirl-date-input.spec.js +1 -1
- package/dist/collection/components/swirl-tag/swirl-tag.js +4 -1
- package/dist/components/assets/pdfjs/pdf.worker.min.js +1 -1
- package/dist/components/swirl-date-input.js +2 -2
- package/dist/components/swirl-tag2.js +4 -1
- package/dist/esm/swirl-date-input.entry.js +2 -2
- package/dist/esm/swirl-option-list_2.entry.js +4 -1
- package/dist/swirl-components/{p-e8e3e6eb.entry.js → p-388be284.entry.js} +1 -1
- package/dist/swirl-components/{p-6835a307.entry.js → p-a6e6e516.entry.js} +1 -1
- package/dist/swirl-components/swirl-components.esm.js +1 -1
- package/dist/types/components/swirl-tag/swirl-tag.d.ts +1 -0
- package/package.json +1 -1
package/components.json
CHANGED
|
@@ -8,7 +8,7 @@ const maska = require('./maska-d2148ad3.js');
|
|
|
8
8
|
const utils = require('./utils-ea8f1bbc.js');
|
|
9
9
|
require('./_commonjsHelpers-8f2c79cd.js');
|
|
10
10
|
|
|
11
|
-
const swirlDateInputCss = ".sc-swirl-date-input-h{display:flex;width:100%}.sc-swirl-date-input-h *.sc-swirl-date-input{box-sizing:border-box}.date-input.sc-swirl-date-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);line-height:var(--s-line-height-sm)}.date-input--inline.sc-swirl-date-input .date-input__date-picker-button.sc-swirl-date-input{top:-0.0625rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.date-input--inline.sc-swirl-date-input .date-input__date-picker-button.sc-swirl-date-input{top:0}}.date-input__input.sc-swirl-date-input{display:inline-flex;width:calc(100% - 1.25rem - var(--s-space-8));margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.date-input__input.sc-swirl-date-input:focus{outline:none}.date-input__input.sc-swirl-date-input:disabled{color:var(--s-text-disabled);background-color:transparent}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.date-input__input.sc-swirl-date-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.date-input__date-picker-button.sc-swirl-date-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.date-input__date-picker-button.sc-swirl-date-input:focus:not(:focus-visible){outline:none}.date-input__date-picker-button.sc-swirl-date-input:focus-visible{outline-color:var(--s-focus-default);outline-offset:var(--s-space-2)}.date-input__date-picker-button.sc-swirl-date-input:disabled{color:var(--s-icon-disabled);cursor:default}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.date-input__date-picker-button.sc-swirl-date-input{top:-0.625rem}}";
|
|
11
|
+
const swirlDateInputCss = ".sc-swirl-date-input-h{display:flex;width:100%}.sc-swirl-date-input-h *.sc-swirl-date-input{box-sizing:border-box}.date-input.sc-swirl-date-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);line-height:var(--s-line-height-sm)}.date-input--inline.sc-swirl-date-input .date-input__date-picker-button.sc-swirl-date-input{top:-0.0625rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.date-input--inline.sc-swirl-date-input .date-input__date-picker-button.sc-swirl-date-input{top:0}}.date-input__input.sc-swirl-date-input{display:inline-flex;width:calc(100% - 1.25rem - var(--s-space-8));margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);caret-color:var(--s-border-highlight)}.date-input__input.sc-swirl-date-input:focus{outline:none}.date-input__input.sc-swirl-date-input:disabled{color:var(--s-text-disabled);background-color:transparent}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.date-input__input.sc-swirl-date-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.date-input__date-picker-button.sc-swirl-date-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.date-input__date-picker-button.sc-swirl-date-input:focus:not(:focus-visible){outline:none}.date-input__date-picker-button.sc-swirl-date-input:focus-visible{outline-color:var(--s-focus-default);outline-offset:var(--s-space-2)}.date-input__date-picker-button.sc-swirl-date-input:disabled{color:var(--s-icon-disabled);cursor:default}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.date-input__date-picker-button.sc-swirl-date-input{top:-0.625rem}}@media (max-width: 767px){.date-input__date-picker-popover.sc-swirl-date-input{position:fixed}}";
|
|
12
12
|
const SwirlDateInputStyle0 = swirlDateInputCss;
|
|
13
13
|
|
|
14
14
|
const internalDateFormat = "yyyy-MM-dd";
|
|
@@ -159,7 +159,7 @@ const SwirlDateInput = class {
|
|
|
159
159
|
const className = index$1.classnames("date-input", {
|
|
160
160
|
"date-input--inline": this.inline,
|
|
161
161
|
});
|
|
162
|
-
return (index.h(index.Host, { key: '296c03693dedf618c9f897027d1f18c37d7570cc' }, index.h("div", { key: '1cebccc9e07c74ba99250df57ce53385cc7422dd', class: className }, index.h("input", { key: 'f751cb69404907a1e203396d559db8e7b4591007', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "date-input__input", disabled: this.disabled, readonly: this.readonly, id: this.id, inputmode: "numeric", onClick: this.onClick, onMouseDown: this.onMouseDown, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), index.h("swirl-popover-trigger", { key: 'dcbd828da70c00ac11ae35c278a793e5225e80f4', swirlPopover: `popover-${this.id}` }, index.h("button", { key: 'ba359bdb631eb2c327f9660d08e9ee28e4e7db37', "aria-label": this.datePickerTriggerLabel, class: "date-input__date-picker-button", disabled: this.disabled, type: "button" }, index.h("swirl-icon-today", { key: '144aed4c8e6768e3b3f3e4ea73a1b45688329205', size: this.iconSize })))), !this.disabled && (index.h("swirl-popover", { key: '
|
|
162
|
+
return (index.h(index.Host, { key: '296c03693dedf618c9f897027d1f18c37d7570cc' }, index.h("div", { key: '1cebccc9e07c74ba99250df57ce53385cc7422dd', class: className }, index.h("input", { key: 'f751cb69404907a1e203396d559db8e7b4591007', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "date-input__input", disabled: this.disabled, readonly: this.readonly, id: this.id, inputmode: "numeric", onClick: this.onClick, onMouseDown: this.onMouseDown, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), index.h("swirl-popover-trigger", { key: 'dcbd828da70c00ac11ae35c278a793e5225e80f4', swirlPopover: `popover-${this.id}` }, index.h("button", { key: 'ba359bdb631eb2c327f9660d08e9ee28e4e7db37', "aria-label": this.datePickerTriggerLabel, class: "date-input__date-picker-button", disabled: this.disabled, type: "button" }, index.h("swirl-icon-today", { key: '144aed4c8e6768e3b3f3e4ea73a1b45688329205', size: this.iconSize })))), !this.disabled && (index.h("swirl-popover", { key: 'e28a16501ccbd4bb6507984d55cd539689eec1bd', animation: "scale-in-y", class: "date-input__date-picker-popover", id: `popover-${this.id}`, label: this.datePickerLabel, placement: "bottom-end", ref: (el) => (this.pickerPopover = el) }, index.h("swirl-date-picker", { key: '0cd7207713f7dcb2b61d9a562ebab2e863af3058', disableDate: this.datePickerDisableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onValueChange: this.onPickDate, value: dateValue, startDate: dateValue })))));
|
|
163
163
|
}
|
|
164
164
|
get el() { return index.getElement(this); }
|
|
165
165
|
static get watchers() { return {
|
|
@@ -376,6 +376,9 @@ const SwirlTag = class {
|
|
|
376
376
|
componentWillLoad() {
|
|
377
377
|
this.forceVariant();
|
|
378
378
|
}
|
|
379
|
+
componentDidRender() {
|
|
380
|
+
this.forceIconProps();
|
|
381
|
+
}
|
|
379
382
|
forceIconProps() {
|
|
380
383
|
const icon = this.iconEl?.children[0];
|
|
381
384
|
icon?.setAttribute("size", "16");
|
|
@@ -388,7 +391,7 @@ const SwirlTag = class {
|
|
|
388
391
|
}
|
|
389
392
|
render() {
|
|
390
393
|
const className = index$1.classnames("tag", `tag--icon-position-${this.iconPosition}`, `tag--intent-${this.intent}`, `tag--size-${this.size}`, `tag--variant-${this.variant}`);
|
|
391
|
-
return (index.h(index.Host, { key: '
|
|
394
|
+
return (index.h(index.Host, { key: 'b1252aae3bea38598442cb55686853e117d13c7f' }, index.h("span", { key: '8913c5ba54383d25683173d728f3bfaecc3e5738', class: className, part: "tag" }, this.icon && (index.h("span", { key: 'aaf64fd259e1379305e46314103380ac80330c45', class: "tag__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), index.h("span", { key: 'f1bb805f0264d23957e244682027417f41dc6507', class: "tag__label" }, this.label), this.removable && (index.h("button", { key: 'c0e1fc5f3c153fea47edf8dadf0870b9d3ecb405', "aria-label": this.removalButtonLabel, class: "tag__removal-button", onClick: this.onRemove, tabIndex: this.el.ariaHidden === "true" ? -1 : undefined, type: "button" }, index.h("swirl-icon-close", { key: '94acd6d0feb76393da944ae9bf41043735d297c6', size: 16 }))))));
|
|
392
395
|
}
|
|
393
396
|
get el() { return index.getElement(this); }
|
|
394
397
|
};
|