Repositorio del curso CCOM4030 el semestre B91 del proyecto Artesanías con el Instituto de Cultura

ons-toolbar-button.js 4.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. import _Object$getPrototypeOf from 'babel-runtime/core-js/object/get-prototype-of';
  2. import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
  3. import _createClass from 'babel-runtime/helpers/createClass';
  4. import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
  5. import _inherits from 'babel-runtime/helpers/inherits';
  6. /*
  7. Copyright 2013-2015 ASIAL CORPORATION
  8. Licensed under the Apache License, Version 2.0 (the "License");
  9. you may not use this file except in compliance with the License.
  10. You may obtain a copy of the License at
  11. http://www.apache.org/licenses/LICENSE-2.0
  12. Unless required by applicable law or agreed to in writing, software
  13. distributed under the License is distributed on an "AS IS" BASIS,
  14. WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  15. See the License for the specific language governing permissions and
  16. limitations under the License.
  17. */
  18. import onsElements from '../ons/elements';
  19. import BaseButtonElement from './base/base-button';
  20. /**
  21. * @element ons-toolbar-button
  22. * @category page
  23. * @modifier material
  24. * [en]Material Design toolbar button.[/en]
  25. * [ja][/ja]
  26. * @modifier outline
  27. * [en]A button with an outline.[/en]
  28. * [ja]アウトラインをもったボタンを表示します。[/ja]
  29. * @description
  30. * [en]Button component for ons-toolbar and ons-bottom-toolbar.[/en]
  31. * [ja]ons-toolbarあるいはons-bottom-toolbarに設置できるボタン用コンポーネントです。[/ja]
  32. * @codepen aHmGL
  33. * @tutorial vanilla/Reference/page
  34. * @guide compilation.html#toolbar-compilation
  35. * [en]Adding a toolbar[/en]
  36. * [ja]ツールバーの追加[/ja]
  37. * @seealso ons-toolbar
  38. * [en]The `<ons-toolbar>` component displays a navigation bar at the top of a page.[/en]
  39. * [ja]ons-toolbarコンポーネント[/ja]
  40. * @seealso ons-back-button
  41. * [en]The `<ons-back-button>` displays a back button in the navigation bar.[/en]
  42. * [ja]ons-back-buttonコンポーネント[/ja]
  43. * @example
  44. * <ons-toolbar>
  45. * <div class="left">
  46. * <ons-toolbar-button>
  47. * Button
  48. * </ons-toolbar-button>
  49. * </div>
  50. * <div class="center">
  51. * Title
  52. * </div>
  53. * <div class="right">
  54. * <ons-toolbar-button>
  55. * <ons-icon icon="ion-navicon" size="28px"></ons-icon>
  56. * </ons-toolbar-button>
  57. * </div>
  58. * </ons-toolbar>
  59. */
  60. var ToolbarButtonElement = function (_BaseButtonElement) {
  61. _inherits(ToolbarButtonElement, _BaseButtonElement);
  62. function ToolbarButtonElement() {
  63. _classCallCheck(this, ToolbarButtonElement);
  64. return _possibleConstructorReturn(this, (ToolbarButtonElement.__proto__ || _Object$getPrototypeOf(ToolbarButtonElement)).apply(this, arguments));
  65. }
  66. _createClass(ToolbarButtonElement, [{
  67. key: '_scheme',
  68. /**
  69. * @attribute modifier
  70. * @type {String}
  71. * @description
  72. * [en]The appearance of the button.[/en]
  73. * [ja]ボタンの表現を指定します。[/ja]
  74. */
  75. /**
  76. * @attribute icon
  77. * @type {String}
  78. * @description
  79. * [en]Creates an `ons-icon` component with this string.[/en]
  80. * [ja]`ons-icon`コンポーネントを悪性します。[/ja]
  81. */
  82. /**
  83. * @attribute disabled
  84. * @description
  85. * [en]Specify if button should be disabled.[/en]
  86. * [ja]ボタンを無効化する場合は指定してください。[/ja]
  87. */
  88. /**
  89. * @property disabled
  90. * @type {Boolean}
  91. * @description
  92. * [en]Whether the element is disabled or not.[/en]
  93. * [ja]無効化されている場合に`true`。[/ja]
  94. */
  95. get: function get() {
  96. return { '': 'toolbar-button--*' };
  97. }
  98. }, {
  99. key: '_defaultClassName',
  100. get: function get() {
  101. return 'toolbar-button';
  102. }
  103. }, {
  104. key: '_rippleOpt',
  105. get: function get() {
  106. return [this, undefined, { center: '', 'size': 'contain', 'background': 'transparent' }];
  107. }
  108. }]);
  109. return ToolbarButtonElement;
  110. }(BaseButtonElement);
  111. export default ToolbarButtonElement;
  112. onsElements.ToolbarButton = ToolbarButtonElement;
  113. customElements.define('ons-toolbar-button', ToolbarButtonElement);