* Universal render methods * These are pieces of datetime that * are rendered independently of presentation.
()
| 1608 | */ |
| 1609 | |
| 1610 | private renderFooter() { |
| 1611 | const { disabled, readonly, showDefaultButtons, showClearButton } = this; |
| 1612 | /** |
| 1613 | * The cancel, clear, and confirm buttons |
| 1614 | * should not be interactive if the datetime |
| 1615 | * is disabled or readonly. |
| 1616 | */ |
| 1617 | const isButtonDisabled = disabled || readonly; |
| 1618 | const hasSlottedButtons = this.el.querySelector('[slot="buttons"]') !== null; |
| 1619 | if (!hasSlottedButtons && !showDefaultButtons && !showClearButton) { |
| 1620 | return; |
| 1621 | } |
| 1622 | |
| 1623 | const clearButtonClick = () => { |
| 1624 | this.reset(); |
| 1625 | this.setValue(undefined); |
| 1626 | }; |
| 1627 | |
| 1628 | /** |
| 1629 | * By default we render two buttons: |
| 1630 | * Cancel - Dismisses the datetime and |
| 1631 | * does not update the `value` prop. |
| 1632 | * OK - Dismisses the datetime and |
| 1633 | * updates the `value` prop. |
| 1634 | */ |
| 1635 | return ( |
| 1636 | <div class="datetime-footer"> |
| 1637 | <div class="datetime-buttons"> |
| 1638 | <div |
| 1639 | class={{ |
| 1640 | ['datetime-action-buttons']: true, |
| 1641 | ['has-clear-button']: this.showClearButton, |
| 1642 | }} |
| 1643 | > |
| 1644 | <slot name="buttons"> |
| 1645 | <ion-buttons> |
| 1646 | {showDefaultButtons && ( |
| 1647 | <ion-button |
| 1648 | id="cancel-button" |
| 1649 | color={this.color} |
| 1650 | onClick={() => this.cancel(true)} |
| 1651 | disabled={isButtonDisabled} |
| 1652 | > |
| 1653 | {this.cancelText} |
| 1654 | </ion-button> |
| 1655 | )} |
| 1656 | <div class="datetime-action-buttons-container"> |
| 1657 | {showClearButton && ( |
| 1658 | <ion-button |
| 1659 | id="clear-button" |
| 1660 | color={this.color} |
| 1661 | onClick={() => clearButtonClick()} |
| 1662 | disabled={isButtonDisabled} |
| 1663 | > |
| 1664 | {this.clearText} |
| 1665 | </ion-button> |
| 1666 | )} |
| 1667 | {showDefaultButtons && ( |
no test coverage detected