From e4094e9e69ddd34ff8cbb4c48d0fc854b46c043f Mon Sep 17 00:00:00 2001 From: Leopoldthecoder Date: Wed, 28 Mar 2018 14:46:08 +0800 Subject: [PATCH] [build] 2.3.0 --- examples/docs/en-US/alert.md | 446 +++++++++++++-------------- examples/docs/en-US/popover.md | 494 +++++++++++++++--------------- examples/versions.json | 2 +- packages/theme-chalk/package.json | 2 +- src/index.js | 2 +- 5 files changed, 473 insertions(+), 473 deletions(-) diff --git a/examples/docs/en-US/alert.md b/examples/docs/en-US/alert.md index 484e093bd..b8034a85b 100644 --- a/examples/docs/en-US/alert.md +++ b/examples/docs/en-US/alert.md @@ -1,223 +1,223 @@ - - - -## Alert - -Displays important alert messages. - -### Basic usage - -Alert components are non-overlay elements in the page that does not disappear automatically. - -:::demo Alert provides 4 types of themes defined by `type`, whose default value is `info`. - -```html - -``` -::: - -### Customizable close button - -Customize the close button as texts or other symbols. - -:::demo Alert allows you to configure if it's closable. The close button text and closing callbacks are also customizable. `closable` attribute decides if the component can be closed or not. It accepts `boolean`, and the default is `true`. You can set `close-text` attribute to replace the default cross symbol as the close button. Be careful that `close-text` must be a string. `close` event fires when the component is closed. - -```html - - - -``` -::: - -### With icon - -Displaying an icon improves readability. - -:::demo Setting the `show-icon` attribute displays an icon that corresponds with the current Alert type. - -```html - -``` -::: - -## Centered text - -Use the `center` attribute to center the text. - -:::demo - -```html - -``` -::: - -### With description - -Description includes a message with more detailed information. - -:::demo Besides the required `title` attribute, you can add a `description` attribute to help you describe the alert with more details. Description can only store text string, and it will word wrap automatically. - -```html - -``` -::: - -### With icon and description - -:::demo At last, this is an example with both icon and description. - -```html - -``` -::: - -### Attributes -| Attribute | Description | Type | Accepted Values | Default | -|---------- |-------------- |---------- |-------------------------------- |-------- | -| **title** | title **REQUIRED** | string | — | — | -| type | component type | string | success/warning/info/error | info | -| description | descriptive text. Can also be passed with the default slot | string | — | — | -| closable | if closable or not | boolean | — | true | -| center | whether to center the text | boolean | — | false | -| close-text | customized close button text | string | — | — | -| show-icon | if a type icon is displayed | boolean | — | false | - - -### Events -| Event Name | Description | Parameters | -|---------- |-------- |---------- | -| close | fires when alert is closed | — | + + + +## Alert + +Displays important alert messages. + +### Basic usage + +Alert components are non-overlay elements in the page that does not disappear automatically. + +:::demo Alert provides 4 types of themes defined by `type`, whose default value is `info`. + +```html + +``` +::: + +### Customizable close button + +Customize the close button as texts or other symbols. + +:::demo Alert allows you to configure if it's closable. The close button text and closing callbacks are also customizable. `closable` attribute decides if the component can be closed or not. It accepts `boolean`, and the default is `true`. You can set `close-text` attribute to replace the default cross symbol as the close button. Be careful that `close-text` must be a string. `close` event fires when the component is closed. + +```html + + + +``` +::: + +### With icon + +Displaying an icon improves readability. + +:::demo Setting the `show-icon` attribute displays an icon that corresponds with the current Alert type. + +```html + +``` +::: + +## Centered text + +Use the `center` attribute to center the text. + +:::demo + +```html + +``` +::: + +### With description + +Description includes a message with more detailed information. + +:::demo Besides the required `title` attribute, you can add a `description` attribute to help you describe the alert with more details. Description can only store text string, and it will word wrap automatically. + +```html + +``` +::: + +### With icon and description + +:::demo At last, this is an example with both icon and description. + +```html + +``` +::: + +### Attributes +| Attribute | Description | Type | Accepted Values | Default | +|---------- |-------------- |---------- |-------------------------------- |-------- | +| **title** | title **REQUIRED** | string | — | — | +| type | component type | string | success/warning/info/error | info | +| description | descriptive text. Can also be passed with the default slot | string | — | — | +| closable | if closable or not | boolean | — | true | +| center | whether to center the text | boolean | — | false | +| close-text | customized close button text | string | — | — | +| show-icon | if a type icon is displayed | boolean | — | false | + + +### Events +| Event Name | Description | Parameters | +|---------- |-------- |---------- | +| close | fires when alert is closed | — | diff --git a/examples/docs/en-US/popover.md b/examples/docs/en-US/popover.md index 1169e5839..ce1f2a07c 100644 --- a/examples/docs/en-US/popover.md +++ b/examples/docs/en-US/popover.md @@ -1,247 +1,247 @@ - - - - -## Popover - -### Basic usage - -Similar to Tooltip, Popover is also built with `Vue-popper`. So for some duplicated attributes, please refer to the documentation of Tooltip. - -:::demo Add `ref` in your popover, then in your button, use `v-popover` directive to link the button and the popover. The attribute `trigger` is used to define how popover is triggered: `hover`, `click` or `focus`. Alternatively, you can specify reference using a named `slot`. - -```html - - - - - - -Hover to activate -Click to activate - - Focus to activate - -``` -::: - -### Nested information - -Other components can be nested in popover. Following is an example of nested table. - -:::demo replace the `content` attribute with a default `slot`. - -```html - - - - - - - - -Click to activate - - -``` -::: - -### Nested operation - -Of course, you can nest other operations. It's more light-weight than using a dialog. - -:::demo -```html - -

Are you sure to delete this?

-
- cancel - confirm -
-
- -Delete - - -``` -::: - -### Attributes -| Attribute | Description | Type | Accepted Values | Default | -|--------------------|----------------------------------------------------------|-------------------|-------------|--------| -| trigger | how the popover is triggered | string | click/focus/hover/manual | click | -| title | popover title | string | — | — | -| content | popover content, can be replaced with a default `slot` | string | — | — | -| width | popover width | string, number | — | Min width 150px | -| placement | popover placement | string | top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end | bottom | -| disabled | whether Popover is disabled | boolean | — | false | -| value(v-model) | whether popover is visible | Boolean | — | false | -| offset | popover offset | number | — | 0 | -| transition | popover transition animation | string | — | el-fade-in-linear | -| visible-arrow | whether a tooltip arrow is displayed or not. For more info, please refer to [Vue-popper](https://github.com/element-component/vue-popper) | boolean | — | true | -| popper-options | parameters for [popper.js](https://popper.js.org/documentation.html) | object | please refer to [popper.js](https://popper.js.org/documentation.html) | `{ boundariesElement: 'body', gpuAcceleration: false }` | -| popper-class | custom class name for popover | string | — | — | -| open-delay | delay of appearance when `trigger` is hover, in milliseconds | number | — | — | - -### Slot -| Name | Description | -| --- | --- | -| — | text content of popover | -| reference | HTML element that triggers popover | - -### Events -| Event Name | Description | 回调参数 | -|---------|--------|---------| -| show | triggers when popover shows | — | -| after-enter | triggers when the entering transition ends | — | -| hide | triggers when popover hides | — | -| after-leave | triggers when the leaving transition ends | — | + + + + +## Popover + +### Basic usage + +Similar to Tooltip, Popover is also built with `Vue-popper`. So for some duplicated attributes, please refer to the documentation of Tooltip. + +:::demo Add `ref` in your popover, then in your button, use `v-popover` directive to link the button and the popover. The attribute `trigger` is used to define how popover is triggered: `hover`, `click` or `focus`. Alternatively, you can specify reference using a named `slot`. + +```html + + + + + + +Hover to activate +Click to activate + + Focus to activate + +``` +::: + +### Nested information + +Other components can be nested in popover. Following is an example of nested table. + +:::demo replace the `content` attribute with a default `slot`. + +```html + + + + + + + + +Click to activate + + +``` +::: + +### Nested operation + +Of course, you can nest other operations. It's more light-weight than using a dialog. + +:::demo +```html + +

Are you sure to delete this?

+
+ cancel + confirm +
+
+ +Delete + + +``` +::: + +### Attributes +| Attribute | Description | Type | Accepted Values | Default | +|--------------------|----------------------------------------------------------|-------------------|-------------|--------| +| trigger | how the popover is triggered | string | click/focus/hover/manual | click | +| title | popover title | string | — | — | +| content | popover content, can be replaced with a default `slot` | string | — | — | +| width | popover width | string, number | — | Min width 150px | +| placement | popover placement | string | top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end | bottom | +| disabled | whether Popover is disabled | boolean | — | false | +| value(v-model) | whether popover is visible | Boolean | — | false | +| offset | popover offset | number | — | 0 | +| transition | popover transition animation | string | — | el-fade-in-linear | +| visible-arrow | whether a tooltip arrow is displayed or not. For more info, please refer to [Vue-popper](https://github.com/element-component/vue-popper) | boolean | — | true | +| popper-options | parameters for [popper.js](https://popper.js.org/documentation.html) | object | please refer to [popper.js](https://popper.js.org/documentation.html) | `{ boundariesElement: 'body', gpuAcceleration: false }` | +| popper-class | custom class name for popover | string | — | — | +| open-delay | delay of appearance when `trigger` is hover, in milliseconds | number | — | — | + +### Slot +| Name | Description | +| --- | --- | +| — | text content of popover | +| reference | HTML element that triggers popover | + +### Events +| Event Name | Description | 回调参数 | +|---------|--------|---------| +| show | triggers when popover shows | — | +| after-enter | triggers when the entering transition ends | — | +| hide | triggers when popover hides | — | +| after-leave | triggers when the leaving transition ends | — | diff --git a/examples/versions.json b/examples/versions.json index 3664e5f4c..b6d944db6 100644 --- a/examples/versions.json +++ b/examples/versions.json @@ -1 +1 @@ -{"1.4.13":"1.4","2.0.11":"2.0","2.1.0":"2.1","2.2.2":"2.2"} \ No newline at end of file +{"1.4.13":"1.4","2.0.11":"2.0","2.1.0":"2.1","2.2.2":"2.2","2.3.0":"2.3"} \ No newline at end of file diff --git a/packages/theme-chalk/package.json b/packages/theme-chalk/package.json index d21a5596d..56bf14274 100644 --- a/packages/theme-chalk/package.json +++ b/packages/theme-chalk/package.json @@ -1,6 +1,6 @@ { "name": "element-theme-chalk", - "version": "2.2.2", + "version": "2.3.0", "description": "Element component chalk theme.", "main": "lib/index.css", "style": "lib/index.css", diff --git a/src/index.js b/src/index.js index c6a34d0ca..ba24b9003 100644 --- a/src/index.js +++ b/src/index.js @@ -171,7 +171,7 @@ if (typeof window !== 'undefined' && window.Vue) { } module.exports = { - version: '2.2.2', + version: '2.3.0', locale: locale.use, i18n: locale.i18n, install,