javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-10 00:27:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(all): updating to newest stencil apis (#18578)

Browse Source 
* chore(): update ionicons

* refactor(all): updating to newest stencil apis

* fix lint issues

* more changes

* moreee

* fix treeshaking

* fix config

* fix checkbox

* fix stuff

* chore(): update ionicons

* fix linting errors
This commit is contained in:
Manu MA
2019-06-23 11:26:42 +02:00
committed by GitHub
parent 78e477b2a7
commit 34dfc3ce98
112 changed files with 1229 additions and 1233 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
core/src/components/datetime/datetime.tsx
View File

@ -1,4 +1,4 @@
import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Method, Prop, State, Watch, h } from '@stencil/core';
import { Component, ComponentInterface, Element, Event, EventEmitter, Host, Method, Prop, State, Watch, h } from '@stencil/core';
import { getIonMode } from '../../global/ionic-global';
import { DatetimeChangeEventDetail, DatetimeOptions, PickerColumn, PickerColumnOption, PickerOptions, StyleEventDetail } from '../../interface';
@ -242,12 +242,6 @@ export class Datetime implements ComponentInterface {
this.emitStyle();
}
@Listen('click')
onClick() {
this.setFocus();
this.open();
}
/**
* Opens the datetime overlay.
*/
@ -557,7 +551,7 @@ export class Datetime implements ComponentInterface {
return 0;
}
private getText() {
private get text() {
// create the text of the formatted data
const template = this.displayFormat || this.pickerFormat || DEFAULT_FORMAT;
@ -581,6 +575,11 @@ export class Datetime implements ComponentInterface {
}
}
private onClick = () => {
this.setFocus();
this.open();
}
private onFocus = () => {
this.ionFocus.emit();
}
@ -589,54 +588,52 @@ export class Datetime implements ComponentInterface {
this.ionBlur.emit();
}
hostData() {
const { inputId, disabled, readonly, isExpanded, el, placeholder } = this;
render() {
const { inputId, text, disabled, readonly, isExpanded, el, placeholder } = this;
const mode = getIonMode(this);
const addPlaceholderClass =
(this.getText() === undefined && placeholder != null) ? true : false;
const labelId = inputId + '-lbl';
const label = findItemLabel(el);
if (label) {
label.id = labelId;
}
return {
'role': 'combobox',
'aria-disabled': disabled ? 'true' : null,
'aria-expanded': `${isExpanded}`,
'aria-haspopup': 'true',
'aria-labelledby': labelId,
class: {
[`${mode}`]: true,
'datetime-disabled': disabled,
'datetime-readonly': readonly,
'datetime-placeholder': addPlaceholderClass,
'in-item': hostContext('ion-item', el)
}
};
}
const addPlaceholderClass = (text === undefined && placeholder != null) ? true : false;
render() {
// If selected text has been passed in, use that first
// otherwise use the placeholder
let datetimeText = this.getText();
if (datetimeText === undefined) {
datetimeText = this.placeholder != null ? this.placeholder : '';
const datetimeText = text === undefined
? (placeholder != null ? placeholder : '')
: text;
if (label) {
label.id = labelId;
}
renderHiddenInput(true, this.el, this.name, this.value, this.disabled);
return [
<div class="datetime-text">{datetimeText}</div>,
<button
type="button"
onFocus={this.onFocus}
onBlur={this.onBlur}
disabled={this.disabled}
ref={el => this.buttonEl = el}
renderHiddenInput(true, el, this.name, this.value, this.disabled);
return (
<Host
onClick={this.onClick}
role="combobox"
aria-disabled={disabled ? 'true' : null}
aria-expanded={`${isExpanded}`}
aria-haspopup="true"
aria-labelledby={labelId}
class={{
[mode]: true,
'datetime-disabled': disabled,
'datetime-readonly': readonly,
'datetime-placeholder': addPlaceholderClass,
'in-item': hostContext('ion-item', el)
}}
>
</button>
];
<div class="datetime-text">{datetimeText}</div>
<button
type="button"
onFocus={this.onFocus}
onBlur={this.onBlur}
disabled={this.disabled}
ref={btnEl => this.buttonEl = btnEl}
>
</button>
</Host>
);
}
}