@pod-os/elements 0.7.0 → 0.7.1-2196a40.0

package/dist/cjs/ion-picker-column.cjs.entry.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-b4a9ece2.js');
-const ionicGlobal = require('./ionic-global-56e10eb5.js');
-const helpers = require('./helpers-398ced09.js');
-const haptic = require('./haptic-09e73337.js');
+const index = require('./index-eaa0d16e.js');
+const ionicGlobal = require('./ionic-global-f2d95fd3.js');
+const helpers = require('./helpers-cb08f5ae.js');
+const haptic = require('./haptic-7358cb0b.js');
 
 const pickerColumnIosCss = ".picker-col{display:flex;position:relative;flex:1;justify-content:center;height:100%;box-sizing:content-box;contain:content}.picker-opts{position:relative;flex:1;max-width:100%}.picker-opt{left:0;top:0;display:block;position:absolute;width:100%;border:0;text-align:center;text-overflow:ellipsis;white-space:nowrap;contain:strict;overflow:hidden;will-change:transform}[dir=rtl] .picker-opt,:host-context([dir=rtl]) .picker-opt{left:unset;right:unset;right:0}.picker-opt.picker-opt-disabled{pointer-events:none}.picker-opt-disabled{opacity:0}.picker-opts-left{justify-content:flex-start}.picker-opts-right{justify-content:flex-end}.picker-opt:active,.picker-opt:focus{outline:none}.picker-prefix{position:relative;flex:1;text-align:end;white-space:nowrap}.picker-suffix{position:relative;flex:1;text-align:start;white-space:nowrap}.picker-col{padding-left:4px;padding-right:4px;padding-top:0;padding-bottom:0;transform-style:preserve-3d}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.picker-col{padding-left:unset;padding-right:unset;-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px}}.picker-prefix,.picker-suffix,.picker-opts{top:77px;transform-style:preserve-3d;color:inherit;font-size:20px;line-height:42px;pointer-events:none}.picker-opt{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;transform-origin:center center;height:46px;transform-style:preserve-3d;transition-timing-function:ease-out;background:transparent;color:inherit;font-size:20px;line-height:42px;backface-visibility:hidden;pointer-events:auto}[dir=rtl] .picker-opt,:host-context([dir=rtl]) .picker-opt{transform-origin:calc(100% - center) center}";
 
@@ -35,15 +35,15 @@ const PickerColumnCmp = class {
     }
     this.rotateFactor = pickerRotateFactor;
     this.scaleFactor = pickerScaleFactor;
-    this.gesture = (await Promise.resolve().then(function () { return require('./index-d01d9183.js'); })).createGesture({
+    this.gesture = (await Promise.resolve().then(function () { return require('./index-643851c6.js'); })).createGesture({
       el: this.el,
       gestureName: 'picker-swipe',
       gesturePriority: 100,
       threshold: 0,
       passive: false,
-      onStart: ev => this.onStart(ev),
-      onMove: ev => this.onMove(ev),
-      onEnd: ev => this.onEnd(ev),
+      onStart: (ev) => this.onStart(ev),
+      onMove: (ev) => this.onMove(ev),
+      onEnd: (ev) => this.onEnd(ev),
     });
     this.gesture.enable();
     this.tmrId = setTimeout(() => {
@@ -56,7 +56,7 @@ const PickerColumnCmp = class {
     if (colEl) {
       // DOM READ
       // We perfom a DOM read over a rendered item, this needs to happen after the first render
-      this.optHeight = (colEl.firstElementChild ? colEl.firstElementChild.clientHeight : 0);
+      this.optHeight = colEl.firstElementChild ? colEl.firstElementChild.clientHeight : 0;
     }
     this.refresh();
   }
@@ -74,7 +74,7 @@ const PickerColumnCmp = class {
   setSelected(selectedIndex, duration) {
     // if there is a selected index, then figure out it's y position
     // if there isn't a selected index, then just use the top y position
-    const y = (selectedIndex > -1) ? -(selectedIndex * this.optHeight) : 0;
+    const y = selectedIndex > -1 ? -(selectedIndex * this.optHeight) : 0;
     this.velocity = 0;
     // set what y position we're at
     cancelAnimationFrame(this.rafId);
@@ -89,14 +89,14 @@ const PickerColumnCmp = class {
     let translateY = 0;
     let translateZ = 0;
     const { col, rotateFactor } = this;
-    const selectedIndex = col.selectedIndex = this.indexForY(-y);
-    const durationStr = (duration === 0) ? '' : duration + 'ms';
+    const selectedIndex = (col.selectedIndex = this.indexForY(-y));
+    const durationStr = duration === 0 ? '' : duration + 'ms';
     const scaleStr = `scale(${this.scaleFactor})`;
     const children = this.optsEl.children;
     for (let i = 0; i < children.length; i++) {
       const button = children[i];
       const opt = col.options[i];
-      const optOffset = (i * this.optHeight) + y;
+      const optOffset = i * this.optHeight + y;
       let transform = '';
       if (rotateFactor !== 0) {
         const rotateX = optOffset * rotateFactor;
@@ -130,8 +130,8 @@ const PickerColumnCmp = class {
       // Update transform
       if (transform !== opt.transform) {
         opt.transform = transform;
-        button.style.transform = transform;
       }
+      button.style.transform = transform;
       // Update selected item
       if (selected !== opt.selected) {
         opt.selected = selected;
@@ -158,9 +158,7 @@ const PickerColumnCmp = class {
       // still decelerating
       this.velocity *= DECELERATION_FRICTION;
       // do not let it go slower than a velocity of 1
-      this.velocity = (this.velocity > 0)
-        ? Math.max(this.velocity, 1)
-        : Math.min(this.velocity, -1);
+      this.velocity = this.velocity > 0 ? Math.max(this.velocity, 1) : Math.min(this.velocity, -1);
       let y = this.y + this.velocity;
       if (y > this.minY) {
         // whoops, it's trying to scroll up farther than the options we have!
@@ -173,7 +171,7 @@ const PickerColumnCmp = class {
         this.velocity = 0;
       }
       this.update(y, 0, true);
-      const notLockedIn = (Math.round(y) % this.optHeight !== 0) || (Math.abs(this.velocity) > 1);
+      const notLockedIn = Math.round(y) % this.optHeight !== 0 || Math.abs(this.velocity) > 1;
       if (notLockedIn) {
         // isn't locked in yet, keep decelerating until it is
         this.rafId = requestAnimationFrame(() => this.decelerate());
@@ -188,14 +186,13 @@ const PickerColumnCmp = class {
       // needs to still get locked into a position so options line up
       const currentPos = Math.abs(this.y % this.optHeight);
       // create a velocity in the direction it needs to scroll
-      this.velocity = (currentPos > (this.optHeight / 2) ? 1 : -1);
+      this.velocity = currentPos > this.optHeight / 2 ? 1 : -1;
       this.decelerate();
     }
   }
   indexForY(y) {
     return Math.min(Math.max(Math.abs(Math.round(y / this.optHeight)), 0), this.col.options.length - 1);
   }
-  // TODO should this check disabled?
   onStart(detail) {
     // We have to prevent default in order to block scrolling under the picker
     // but we DO NOT have to stop propagation, since we still want
@@ -208,7 +205,7 @@ const PickerColumnCmp = class {
     // reset everything
     cancelAnimationFrame(this.rafId);
     const options = this.col.options;
-    let minY = (options.length - 1);
+    let minY = options.length - 1;
     let maxY = 0;
     for (let i = 0; i < options.length; i++) {
       if (!options[i].disabled) {
@@ -257,7 +254,7 @@ const PickerColumnCmp = class {
     this.velocity = helpers.clamp(-MAX_PICKER_SPEED, detail.velocityY * 23, MAX_PICKER_SPEED);
     if (this.velocity === 0 && detail.deltaY === 0) {
       const opt = detail.event.target.closest('.picker-opt');
-      if (opt && opt.hasAttribute('opt-index')) {
+      if (opt === null || opt === void 0 ? void 0 : opt.hasAttribute('opt-index')) {
         this.setSelected(parseInt(opt.getAttribute('opt-index'), 10), TRANSITION_DURATION);
       }
     }
@@ -277,6 +274,7 @@ const PickerColumnCmp = class {
     }
   }
   refresh(forceRefresh) {
+    var _a;
     let min = this.col.options.length - 1;
     let max = 0;
     const options = this.col.options;
@@ -296,9 +294,9 @@ const PickerColumnCmp = class {
     if (this.velocity !== 0) {
       return;
     }
-    const selectedIndex = helpers.clamp(min, this.col.selectedIndex || 0, max);
+    const selectedIndex = helpers.clamp(min, (_a = this.col.selectedIndex) !== null && _a !== void 0 ? _a : 0, max);
     if (this.col.prevSelected !== selectedIndex || forceRefresh) {
-      const y = (selectedIndex * this.optHeight) * -1;
+      const y = selectedIndex * this.optHeight * -1;
       this.velocity = 0;
       this.update(y, TRANSITION_DURATION, true);
     }
@@ -311,10 +309,10 @@ const PickerColumnCmp = class {
         [mode]: true,
         'picker-col': true,
         'picker-opts-left': this.col.align === 'left',
-        'picker-opts-right': this.col.align === 'right'
+        'picker-opts-right': this.col.align === 'right',
       }, style: {
-        'max-width': this.col.columnWidth
-      } }, col.prefix && (index.h("div", { class: "picker-prefix", style: { width: col.prefixWidth } }, col.prefix)), index.h("div", { class: "picker-opts", style: { maxWidth: col.optionsWidth }, ref: el => this.optsEl = el }, col.options.map((o, index$1) => index.h(Button, { type: "button", class: { 'picker-opt': true, 'picker-opt-disabled': !!o.disabled }, "opt-index": index$1 }, o.text))), col.suffix && (index.h("div", { class: "picker-suffix", style: { width: col.suffixWidth } }, col.suffix))));
+        'max-width': this.col.columnWidth,
+      } }, col.prefix && (index.h("div", { class: "picker-prefix", style: { width: col.prefixWidth } }, col.prefix)), index.h("div", { class: "picker-opts", style: { maxWidth: col.optionsWidth }, ref: (el) => (this.optsEl = el) }, col.options.map((o, index$1) => (index.h(Button, { type: "button", class: { 'picker-opt': true, 'picker-opt-disabled': !!o.disabled }, "opt-index": index$1 }, o.text)))), col.suffix && (index.h("div", { class: "picker-suffix", style: { width: col.suffixWidth } }, col.suffix))));
   }
   get el() { return index.getElement(this); }
   static get watchers() { return {

package/dist/cjs/ion-picker.cjs.entry.js

@@ -2,14 +2,18 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-b4a9ece2.js');
-const ionicGlobal = require('./ionic-global-56e10eb5.js');
-const overlays = require('./overlays-49fe9ba7.js');
-const theme = require('./theme-2259d0f5.js');
-const animation = require('./animation-5840e4df.js');
-require('./hardware-back-button-01027575.js');
-require('./helpers-398ced09.js');
+const index = require('./index-eaa0d16e.js');
+const ionicGlobal = require('./ionic-global-f2d95fd3.js');
+const overlays = require('./overlays-65c716aa.js');
+const theme = require('./theme-fc63803b.js');
+const animation = require('./animation-9bea118f.js');
+require('./hardware-back-button-25372ec7.js');
+require('./helpers-cb08f5ae.js');
+require('./index-57b9fa9e.js');
 
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
 /**
  * iOS Picker Enter Animation
  */
@@ -21,7 +25,7 @@ const iosEnterAnimation = (baseEl) => {
     .addElement(baseEl.querySelector('ion-backdrop'))
     .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
     .beforeStyles({
-    'pointer-events': 'none'
+    'pointer-events': 'none',
   })
     .afterClearStyles(['pointer-events']);
   wrapperAnimation
@@ -34,6 +38,9 @@ const iosEnterAnimation = (baseEl) => {
     .addAnimation([backdropAnimation, wrapperAnimation]);
 };
 
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
 /**
  * iOS Picker Leave Animation
  */
@@ -100,7 +107,7 @@ const Picker = class {
     this.dispatchCancelHandler = (ev) => {
       const role = ev.detail.role;
       if (overlays.isCancel(role)) {
-        const cancelButton = this.buttons.find(b => b.role === 'cancel');
+        const cancelButton = this.buttons.find((b) => b.role === 'cancel');
         this.callButtonHandler(cancelButton);
       }
     };
@@ -150,7 +157,7 @@ const Picker = class {
    * @param name The name of the column.
    */
   getColumn(name) {
-    return Promise.resolve(this.columns.find(column => column.name === name));
+    return Promise.resolve(this.columns.find((column) => column.name === name));
   }
   async buttonClick(button) {
     const role = button.role;
@@ -178,13 +185,11 @@ const Picker = class {
   getSelected() {
     const selected = {};
     this.columns.forEach((col, index) => {
-      const selectedColumn = col.selectedIndex !== undefined
-        ? col.options[col.selectedIndex]
-        : undefined;
+      const selectedColumn = col.selectedIndex !== undefined ? col.options[col.selectedIndex] : undefined;
       selected[col.name] = {
         text: selectedColumn ? selectedColumn.text : undefined,
         value: selectedColumn ? selectedColumn.value : undefined,
-        columnIndex: index
+        columnIndex: index,
       };
     });
     return selected;
@@ -193,17 +198,17 @@ const Picker = class {
     const { htmlAttributes } = this;
     const mode = ionicGlobal.getIonMode(this);
     return (index.h(index.Host, Object.assign({ "aria-modal": "true", tabindex: "-1" }, htmlAttributes, { style: {
-        zIndex: `${20000 + this.overlayIndex}`
+        zIndex: `${20000 + this.overlayIndex}`,
       }, class: Object.assign({ [mode]: true,
         // Used internally for styling
-        [`picker-${mode}`]: true }, theme.getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), index.h("ion-backdrop", { visible: this.showBackdrop, tappable: this.backdropDismiss }), index.h("div", { tabindex: "0" }), index.h("div", { class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, index.h("div", { class: "picker-toolbar" }, this.buttons.map(b => (index.h("div", { class: buttonWrapperClass(b) }, index.h("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass(b) }, b.text))))), index.h("div", { class: "picker-columns" }, index.h("div", { class: "picker-above-highlight" }), this.presented && this.columns.map(c => index.h("ion-picker-column", { col: c })), index.h("div", { class: "picker-below-highlight" }))), index.h("div", { tabindex: "0" })));
+        [`picker-${mode}`]: true, 'overlay-hidden': true }, theme.getClassMap(this.cssClass)), onIonBackdropTap: this.onBackdropTap, onIonPickerWillDismiss: this.dispatchCancelHandler }), index.h("ion-backdrop", { visible: this.showBackdrop, tappable: this.backdropDismiss }), index.h("div", { tabindex: "0" }), index.h("div", { class: "picker-wrapper ion-overlay-wrapper", role: "dialog" }, index.h("div", { class: "picker-toolbar" }, this.buttons.map((b) => (index.h("div", { class: buttonWrapperClass(b) }, index.h("button", { type: "button", onClick: () => this.buttonClick(b), class: buttonClass(b) }, b.text))))), index.h("div", { class: "picker-columns" }, index.h("div", { class: "picker-above-highlight" }), this.presented && this.columns.map((c) => index.h("ion-picker-column", { col: c })), index.h("div", { class: "picker-below-highlight" }))), index.h("div", { tabindex: "0" })));
   }
   get el() { return index.getElement(this); }
 };
 const buttonWrapperClass = (button) => {
   return {
     [`picker-toolbar-${button.role}`]: button.role !== undefined,
-    'picker-toolbar-button': true
+    'picker-toolbar-button': true,
   };
 };
 const buttonClass = (button) => {