@next-bricks/form 1.21.8 → 1.21.9

package/dist/chunks/eo-time-picker.da156d88.js.map

@@ -1 +1 @@
-{"version":3,"file":"chunks/eo-time-picker.da156d88.js","mappings":"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","sources":["webpack:///./src/time-picker/index.tsx","webpack:///../../node_modules/antd/es/time-picker/index.js","webpack:///../../src/FormItemElement.tsx","webpack:///./src/time-picker/fix-style.shadow.css","webpack:///../../src/pickFormItemProps.ts","webpack:///./src/time-picker/styles.shadow.css"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\";\nimport { createDecorators, EventEmitter } from \"@next-core/element\";\nimport { wrapBrick } from \"@next-core/react-element\";\nimport \"@next-core/theme\";\nimport styleText from \"./styles.shadow.css\";\nimport fixStyleText from \"./fix-style.shadow.css\";\nimport { TimePicker, ConfigProvider, theme } from \"antd\";\nimport { useCurrentTheme } from \"@next-core/react-runtime\";\nimport { FormItemElementBase, pickFormItemProps } from \"@next-shared/form\";\nimport type { FormItem, FormItemProps } from \"../form-item/index.js\";\nimport { TimePickerProps } from \"antd/lib/time-picker\";\nimport { StyleProvider, createCache } from \"@ant-design/cssinjs\";\nimport { i18n } from \"@next-core/i18n\";\nimport { isNil } from \"lodash\";\nimport dayjs from \"dayjs\";\nimport type { Dayjs } from \"dayjs\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat.js\";\nimport enUS from \"antd/locale/en_US.js\";\nimport zhCN from \"antd/locale/zh_CN.js\";\n\ndayjs.extend(customParseFormat);\n\nconst { defineElement, property, event } = createDecorators();\nconst WrappedFormItem = wrapBrick<FormItem, FormItemProps>(\"eo-form-item\");\n\ninterface EoTimePickerProps extends FormItemProps {\n  shadowRoot: ShadowRoot | null;\n  configProps?: Partial<TimePickerProps>;\n  placeholder?: string;\n  value?: string;\n  disabled?: boolean;\n  onChange?: (value: string) => void;\n  onOpenChange?: (flag: boolean, value: string) => void;\n}\n\nexport interface EoTimePickeEventsMap {\n  change: CustomEvent<string>;\n  open: CustomEvent<string>;\n  close: CustomEvent<string>;\n}\n\nexport interface EoTimePickeEventsMapping {\n  onChange: \"change\";\n  onOpen: \"open\";\n  onClose: \"close\";\n}\n\n/**\n * 时间选择器\n * @author zhendonghuang\n * @category form-input-basic\n */\nexport\n@defineElement(\"eo-time-picker\", {\n  styleTexts: [styleText, fixStyleText],\n})\nclass EoTimePicker extends FormItemElementBase {\n  /**\n   * 时间选择器字段名\n   */\n  @property() accessor name: string | undefined;\n\n  /**\n   * 时间选择器说明\n   */\n  @property() accessor label: string | undefined;\n\n  /**\n   *时间选择器的初始值\n   */\n  @property() accessor value: string | undefined;\n\n  /**\n   * 时间选择器占位说明\n   */\n  @property()\n  accessor placeholder: string | undefined;\n\n  /**\n   * 校验文本信息\n   */\n  @property({ attribute: false })\n  accessor message: Record<string, string> | undefined;\n\n  /**\n   * 是否禁用\n   */\n  @property({ type: Boolean }) accessor disabled: boolean | undefined;\n\n  /**\n   * 是否必填\n   */\n  @property({ type: Boolean }) accessor required: boolean | undefined;\n\n  /**\n   * 透传 antd timePicker 属性 [timePickerProps](https://ant.design/components/time-picker-cn)\n   */\n  @property({ attribute: false })\n  accessor configProps: Partial<TimePickerProps> | undefined;\n\n  /**\n   *时间变化时触发\n   */\n  @event({ type: \"change\" })\n  accessor #changeEvent!: EventEmitter<string>;\n\n  /**\n   *面板打开时触发， 传出当前时间值\n   */\n  @event({ type: \"open\" })\n  accessor #openEvent!: EventEmitter<string>;\n\n  /**\n   *面板关闭时触发，传出当前时间值\n   */\n  @event({ type: \"close\" })\n  accessor #closeEvent!: EventEmitter<string>;\n\n  handleChange = (value: string): void => {\n    this.value = value;\n    this.#changeEvent.emit(value);\n  };\n  #handleOpenChange = (flag: boolean, value: string): void => {\n    if (flag) {\n      this.#openEvent.emit(value);\n    } else {\n      this.#closeEvent.emit(value);\n    }\n  };\n\n  render() {\n    return (\n      <EoTimePickerComponent\n        curElement={this}\n        formElement={this.getFormElement()}\n        configProps={this.configProps}\n        name={this.name}\n        label={this.label}\n        onChange={this.handleChange}\n        trigger=\"handleChange\"\n        onOpenChange={this.#handleOpenChange}\n        placeholder={this.placeholder}\n        value={this.value}\n        required={this.required}\n        message={this.message}\n        notRender={this.notRender}\n        labelBrick={this.labelBrick}\n        helpBrick={this.helpBrick}\n        shadowRoot={this.shadowRoot}\n        disabled={this.disabled}\n      />\n    );\n  }\n}\n\nexport function EoTimePickerComponent(props: EoTimePickerProps) {\n  const {\n    configProps = {},\n    onChange,\n    onOpenChange,\n    disabled,\n    placeholder,\n  } = props;\n  const currentTheme = useCurrentTheme();\n  const locale =\n    i18n.language && i18n.language.split(\"-\")[0] === \"en\" ? enUS : zhCN;\n  const [value, setValue] = useState<Dayjs | null>(null);\n  const format: string = (configProps.format as string) ?? \"HH:mm:ss\";\n  useEffect(() => {\n    if (!isNil(props.value)) {\n      setValue(dayjs(props.value, format) as Dayjs);\n    } else {\n      setValue(null);\n    }\n  }, [props.value, format]);\n\n  const handleChange = (_time: Dayjs | null, timeString: string): void => {\n    onChange?.(timeString);\n  };\n\n  const handleOpenChange = (flag: boolean): void => {\n    onOpenChange?.(\n      flag,\n      !isNil(value) ? (dayjs(value as Dayjs).format(format) as string) : \"\"\n    );\n  };\n  const cahce = useMemo(() => {\n    return createCache();\n  }, []);\n\n  return (\n    <WrappedFormItem exportparts=\"message\" {...pickFormItemProps(props)}>\n      <ConfigProvider\n        locale={locale as any}\n        theme={{\n          algorithm:\n            currentTheme === \"dark-v2\"\n              ? theme.darkAlgorithm\n              : theme.defaultAlgorithm,\n        }}\n      >\n        <StyleProvider container={props.shadowRoot as ShadowRoot} cache={cahce}>\n          <div\n            onChange={(e) => {\n              e.stopPropagation();\n            }}\n          >\n            <TimePicker\n              {...configProps}\n              getPopupContainer={(trigger) => trigger}\n              value={value}\n              // Currently we don't support multiple pick mode\n              onChange={handleChange as any}\n              onOpenChange={handleOpenChange}\n              disabled={disabled}\n              placeholder={placeholder}\n              allowClear={configProps.allowClear}\n            />\n          </div>\n        </StyleProvider>\n      </ConfigProvider>\n    </WrappedFormItem>\n  );\n}\n","\"use client\";\n\nvar __rest = this && this.__rest || function (s, e) {\n  var t = {};\n  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];\n  if (s != null && typeof Object.getOwnPropertySymbols === \"function\") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\n    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];\n  }\n  return t;\n};\nimport * as React from 'react';\nimport genPurePanel from '../_util/PurePanel';\nimport { devUseWarning } from '../_util/warning';\nimport DatePicker from '../date-picker';\nimport useVariant from '../form/hooks/useVariants';\nconst {\n  TimePicker: InternalTimePicker,\n  RangePicker: InternalRangePicker\n} = DatePicker;\nconst RangePicker = /*#__PURE__*/React.forwardRef((props, ref) => (/*#__PURE__*/React.createElement(InternalRangePicker, Object.assign({}, props, {\n  picker: \"time\",\n  mode: undefined,\n  ref: ref\n}))));\nconst TimePicker = /*#__PURE__*/React.forwardRef((_a, ref) => {\n  var {\n      addon,\n      renderExtraFooter,\n      variant,\n      bordered\n    } = _a,\n    restProps = __rest(_a, [\"addon\", \"renderExtraFooter\", \"variant\", \"bordered\"]);\n  if (process.env.NODE_ENV !== 'production') {\n    const warning = devUseWarning('TimePicker');\n    warning.deprecated(!addon, 'addon', 'renderExtraFooter');\n  }\n  const [mergedVariant] = useVariant('timePicker', variant, bordered);\n  const internalRenderExtraFooter = React.useMemo(() => {\n    if (renderExtraFooter) {\n      return renderExtraFooter;\n    }\n    if (addon) {\n      return addon;\n    }\n    return undefined;\n  }, [addon, renderExtraFooter]);\n  return /*#__PURE__*/React.createElement(InternalTimePicker, Object.assign({}, restProps, {\n    mode: undefined,\n    ref: ref,\n    renderExtraFooter: internalRenderExtraFooter,\n    variant: mergedVariant\n  }));\n});\nif (process.env.NODE_ENV !== 'production') {\n  TimePicker.displayName = 'TimePicker';\n}\n// We don't care debug panel\n/* istanbul ignore next */\nconst PurePanel = genPurePanel(TimePicker, 'popupAlign', undefined, 'picker');\nTimePicker._InternalPanelDoNotUseOrYouWillBeFired = PurePanel;\nTimePicker.RangePicker = RangePicker;\nTimePicker._InternalPanelDoNotUseOrYouWillBeFired = PurePanel;\nexport default TimePicker;","import { createDecorators } from \"@next-core/element\";\nimport { ReactNextElement } from \"@next-core/react-element\";\nimport type { AbstractForm, ColProps } from \"./Form.js\";\nimport { UseSingleBrickConf } from \"@next-core/types\";\n\nconst { method, property } = createDecorators();\n\nexport abstract class FormItemElementBase extends ReactNextElement {\n  accessor #_notRender = false;\n  accessor #validate = \"normal\";\n  accessor #bindFormItem = false;\n\n  get isFormItemElement(): true {\n    return true;\n  }\n\n  set validateState(value: string) {\n    this.#validate = value;\n    this._render();\n  }\n  get validateState() {\n    return this.#validate;\n  }\n\n  /**\n   * 控制该表单项是否隐藏\n   * @default false\n   * @group ui\n   */\n  set notRender(value: boolean) {\n    this.hidden = value;\n    this.#_notRender = value;\n    this._render();\n  }\n  get notRender(): boolean {\n    return this.#_notRender;\n  }\n\n  get $bindFormItem() {\n    return this.#bindFormItem;\n  }\n  set $bindFormItem(value: boolean) {\n    this.#bindFormItem = value;\n    this._render();\n  }\n\n  @property({\n    attribute: false,\n  })\n  accessor helpBrick:\n    | { useBrick: UseSingleBrickConf | UseSingleBrickConf[] }\n    | undefined;\n\n  @property({\n    attribute: false,\n  })\n  accessor labelBrick:\n    | { useBrick: UseSingleBrickConf | UseSingleBrickConf[] }\n    | undefined;\n\n  @property({\n    attribute: false,\n  })\n  accessor labelCol: ColProps | undefined;\n\n  @property({\n    attribute: false,\n  })\n  accessor wrapperCol: ColProps | undefined;\n\n  @method()\n  setNotRender(value: boolean) {\n    this.notRender = value;\n  }\n\n  @method()\n  getFormElement(): AbstractForm | null {\n    // eslint-disable-next-line @typescript-eslint/no-this-alias\n    let element: AbstractForm | null = this as unknown as AbstractForm;\n    while ((element = element.parentNode as AbstractForm | null)) {\n      if (!element || element.isFormElement) {\n        break;\n      }\n    }\n    return element as AbstractForm | null;\n  }\n}\n","// Imports\nimport ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/noSourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `.ant-picker{border-radius:var(--small-border-radius);height:30px}.ant-picker-dropdown .ant-picker-panel-container{border:var(--medius-border-radius)}.ant-picker-dropdown .ant-picker-panel > .ant-picker-time-panel{padding-top:0}.ant-picker-dropdown\n  .ant-picker-time-panel-column\n  > li.ant-picker-time-panel-cell{margin-left:0;margin-right:0}.ant-picker-dropdown\n  .ant-picker-time-panel-column\n  > li.ant-picker-time-panel-cell\n  .ant-picker-time-panel-cell-inner{width:auto;border-radius:0}.ant-picker-dropdown .ant-picker-time-panel-column{margin:0}.ant-picker-dropdown .ant-picker-ranges{margin-top:0px;padding:3px 10px;background-color:var(--color-fill-bg-base-3)}.ant-btn{box-shadow:none}`, \"\"]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___.toString();\n","// istanbul ignore file\nimport { pick } from \"lodash\";\nimport type { FormItemProps } from \"./interfaces\";\n\nconst FORM_ITEM_PROP_NAMES = [\n  \"formElement\",\n  \"curElement\",\n  \"name\",\n  \"label\",\n  \"current\",\n  \"required\",\n  \"pattern\",\n  \"type\",\n  \"min\",\n  \"max\",\n  \"labelCol\",\n  \"wrapperCol\",\n  \"message\",\n  \"layout\",\n  \"size\",\n  \"trigger\",\n  \"valuePropsName\",\n  \"notRender\",\n  \"helpBrick\",\n  \"labelBrick\",\n  \"needValidate\",\n  \"validator\",\n] as const;\n\nexport function pickFormItemProps<T extends FormItemProps>(\n  props: T\n): FormItemProps {\n  return pick(props, FORM_ITEM_PROP_NAMES);\n}\n\n/* ====== Type checks ====== */\ntype Equal<X, Y> =\n  (<T>() => T extends X ? 1 : 2) extends <T>() => T extends Y ? 1 : 2\n    ? true\n    : false;\ntype Expect<T extends true> = T;\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\ntype cases = [\n  Expect<Equal<keyof FormItemProps, (typeof FORM_ITEM_PROP_NAMES)[number]>>,\n];\n","// Imports\nimport ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/noSourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:host{display:inline-block}:host([hidden]){display:none}`, \"\"]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___.toString();\n"],"names":["dayjs","customParseFormat","defineElement","property","event","createDecorators","WrappedFormItem","wrapBrick","_EoTimePicker","_A","WeakMap","_B","_C","_D","_E","_F","_G","_H","_I","_EoTimePicker_brand","WeakSet","_J","_K","_handleOpenChange","EoTimePicker","FormItemElementBase","constructor","arguments","_classPrivateMethodInitSpec","_classPrivateFieldInitSpec","_init_name","_init_extra_name","_init_label","_init_extra_label","_init_value","_init_extra_value","_init_placeholder","_init_extra_placeholder","_init_message","_init_extra_message","_init_disabled","_init_extra_disabled","_init_required","_init_extra_required","_init_configProps","_init_extra_configProps","_init_changeEvent","_init_extra_changeEvent","_init_openEvent","_init_extra_openEvent","_init_closeEvent","_defineProperty","_init_extra_closeEvent","value","this","_classPrivateGetter","_get_changeEvent","emit","flag","_get_openEvent","_get_closeEvent","name","_classPrivateFieldGet","v","_classPrivateFieldSet","label","placeholder","message","disabled","required","configProps","render","React","EoTimePickerComponent","curElement","formElement","getFormElement","onChange","handleChange","trigger","onOpenChange","notRender","labelBrick","helpBrick","shadowRoot","props","_ref","currentTheme","useCurrentTheme","locale","i18n","language","split","enUS","zhCN","setValue","useState","format","useEffect","isNil","cahce","useMemo","createCache","_extends","exportparts","pickFormItemProps","ConfigProvider","theme","algorithm","darkAlgorithm","defaultAlgorithm","StyleProvider","container","cache","e","stopPropagation","TimePicker","getPopupContainer","_time","timeString","allowClear","_EoTimePicker2","_set_changeEvent","_set_openEvent","_set_closeEvent","c","_initClass","_applyDecs","styleTexts","styleText","fixStyleText","attribute","type","Boolean","o","_","has","_checkInRHS","InternalTimePicker","RangePicker","InternalRangePicker","ref","Object","assign","picker","mode","undefined","_a","addon","renderExtraFooter","variant","bordered","restProps","s","t","p","prototype","hasOwnProperty","call","indexOf","getOwnPropertySymbols","i","length","propertyIsEnumerable","__rest","mergedVariant","internalRenderExtraFooter","PurePanel","_InternalPanelDoNotUseOrYouWillBeFired","method","_FormItemElementBase_brand","ReactNextElement","_initProto","_init_helpBrick","_init_extra_helpBrick","_init_labelBrick","_init_extra_labelBrick","_init_labelCol","_init_extra_labelCol","_init_wrapperCol","_init_extra_wrapperCol","isFormItemElement","validateState","_classPrivateSetter","_set_validate","_render","_get_validate","hidden","_set__notRender","_get__notRender","$bindFormItem","_get_bindFormItem","_set_bindFormItem","labelCol","wrapperCol","setNotRender","element","parentNode","isFormElement","_this","_this2","_this3","_this4","_this5","_this6","_FormItemElementBase","___CSS_LOADER_EXPORT___","push","module","id","toString","FORM_ITEM_PROP_NAMES","pick"],"sourceRoot":""}
+{"version":3,"file":"chunks/eo-time-picker.da156d88.js","mappings":"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","sources":["webpack:///./src/time-picker/index.tsx","webpack:///../../node_modules/antd/es/time-picker/index.js","webpack:///../../src/FormItemElement.tsx","webpack:///./src/time-picker/fix-style.shadow.css","webpack:///../../src/pickFormItemProps.ts","webpack:///./src/time-picker/styles.shadow.css"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\";\nimport { createDecorators, EventEmitter } from \"@next-core/element\";\nimport { wrapBrick } from \"@next-core/react-element\";\nimport \"@next-core/theme\";\nimport styleText from \"./styles.shadow.css\";\nimport fixStyleText from \"./fix-style.shadow.css\";\nimport { TimePicker, ConfigProvider, theme } from \"antd\";\nimport { useCurrentTheme } from \"@next-core/react-runtime\";\nimport { FormItemElementBase, pickFormItemProps } from \"@next-shared/form\";\nimport type { FormItem, FormItemProps } from \"../form-item/index.js\";\nimport { TimePickerProps } from \"antd/lib/time-picker\";\nimport { StyleProvider, createCache } from \"@ant-design/cssinjs\";\nimport { i18n } from \"@next-core/i18n\";\nimport { isNil } from \"lodash\";\nimport dayjs from \"dayjs\";\nimport type { Dayjs } from \"dayjs\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat.js\";\nimport enUS from \"antd/locale/en_US.js\";\nimport zhCN from \"antd/locale/zh_CN.js\";\n\ndayjs.extend(customParseFormat);\n\nconst { defineElement, property, event } = createDecorators();\nconst WrappedFormItem = wrapBrick<FormItem, FormItemProps>(\"eo-form-item\");\n\nexport interface EoTimePickerProps extends FormItemProps {\n  shadowRoot: ShadowRoot | null;\n  configProps?: Partial<TimePickerProps>;\n  placeholder?: string;\n  value?: string;\n  disabled?: boolean;\n  onChange?: (value: string) => void;\n  onOpenChange?: (flag: boolean, value: string) => void;\n}\n\nexport interface EoTimePickerEventsMap {\n  change: CustomEvent<string>;\n  open: CustomEvent<string>;\n  close: CustomEvent<string>;\n}\n\nexport interface EoTimePickerEventsMapping {\n  onChange: \"change\";\n  onOpen: \"open\";\n  onClose: \"close\";\n}\n\n/**\n * 时间选择器\n * @author zhendonghuang\n * @category form-input-basic\n */\nexport\n@defineElement(\"eo-time-picker\", {\n  styleTexts: [styleText, fixStyleText],\n})\nclass EoTimePicker extends FormItemElementBase {\n  /**\n   * 时间选择器字段名\n   */\n  @property() accessor name: string | undefined;\n\n  /**\n   * 时间选择器说明\n   */\n  @property() accessor label: string | undefined;\n\n  /**\n   *时间选择器的初始值\n   */\n  @property() accessor value: string | undefined;\n\n  /**\n   * 时间选择器占位说明\n   */\n  @property()\n  accessor placeholder: string | undefined;\n\n  /**\n   * 校验文本信息\n   */\n  @property({ attribute: false })\n  accessor message: Record<string, string> | undefined;\n\n  /**\n   * 是否禁用\n   */\n  @property({ type: Boolean }) accessor disabled: boolean | undefined;\n\n  /**\n   * 是否必填\n   */\n  @property({ type: Boolean }) accessor required: boolean | undefined;\n\n  /**\n   * 透传 antd timePicker 属性 [timePickerProps](https://ant.design/components/time-picker-cn)\n   */\n  @property({ attribute: false })\n  accessor configProps: Partial<TimePickerProps> | undefined;\n\n  /**\n   *时间变化时触发\n   */\n  @event({ type: \"change\" })\n  accessor #changeEvent!: EventEmitter<string>;\n\n  /**\n   *面板打开时触发， 传出当前时间值\n   */\n  @event({ type: \"open\" })\n  accessor #openEvent!: EventEmitter<string>;\n\n  /**\n   *面板关闭时触发，传出当前时间值\n   */\n  @event({ type: \"close\" })\n  accessor #closeEvent!: EventEmitter<string>;\n\n  handleChange = (value: string): void => {\n    this.value = value;\n    this.#changeEvent.emit(value);\n  };\n  #handleOpenChange = (flag: boolean, value: string): void => {\n    if (flag) {\n      this.#openEvent.emit(value);\n    } else {\n      this.#closeEvent.emit(value);\n    }\n  };\n\n  render() {\n    return (\n      <EoTimePickerComponent\n        curElement={this}\n        formElement={this.getFormElement()}\n        configProps={this.configProps}\n        name={this.name}\n        label={this.label}\n        onChange={this.handleChange}\n        trigger=\"handleChange\"\n        onOpenChange={this.#handleOpenChange}\n        placeholder={this.placeholder}\n        value={this.value}\n        required={this.required}\n        message={this.message}\n        notRender={this.notRender}\n        labelBrick={this.labelBrick}\n        helpBrick={this.helpBrick}\n        shadowRoot={this.shadowRoot}\n        disabled={this.disabled}\n      />\n    );\n  }\n}\n\nexport function EoTimePickerComponent(props: EoTimePickerProps) {\n  const {\n    configProps = {},\n    onChange,\n    onOpenChange,\n    disabled,\n    placeholder,\n  } = props;\n  const currentTheme = useCurrentTheme();\n  const locale =\n    i18n.language && i18n.language.split(\"-\")[0] === \"en\" ? enUS : zhCN;\n  const [value, setValue] = useState<Dayjs | null>(null);\n  const format: string = (configProps.format as string) ?? \"HH:mm:ss\";\n  useEffect(() => {\n    if (!isNil(props.value)) {\n      setValue(dayjs(props.value, format) as Dayjs);\n    } else {\n      setValue(null);\n    }\n  }, [props.value, format]);\n\n  const handleChange = (_time: Dayjs | null, timeString: string): void => {\n    onChange?.(timeString);\n  };\n\n  const handleOpenChange = (flag: boolean): void => {\n    onOpenChange?.(\n      flag,\n      !isNil(value) ? (dayjs(value as Dayjs).format(format) as string) : \"\"\n    );\n  };\n  const cahce = useMemo(() => {\n    return createCache();\n  }, []);\n\n  return (\n    <WrappedFormItem exportparts=\"message\" {...pickFormItemProps(props)}>\n      <ConfigProvider\n        locale={locale as any}\n        theme={{\n          algorithm:\n            currentTheme === \"dark-v2\"\n              ? theme.darkAlgorithm\n              : theme.defaultAlgorithm,\n        }}\n      >\n        <StyleProvider container={props.shadowRoot as ShadowRoot} cache={cahce}>\n          <div\n            onChange={(e) => {\n              e.stopPropagation();\n            }}\n          >\n            <TimePicker\n              {...configProps}\n              getPopupContainer={(trigger) => trigger}\n              value={value}\n              // Currently we don't support multiple pick mode\n              onChange={handleChange as any}\n              onOpenChange={handleOpenChange}\n              disabled={disabled}\n              placeholder={placeholder}\n              allowClear={configProps.allowClear}\n            />\n          </div>\n        </StyleProvider>\n      </ConfigProvider>\n    </WrappedFormItem>\n  );\n}\n","\"use client\";\n\nvar __rest = this && this.__rest || function (s, e) {\n  var t = {};\n  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];\n  if (s != null && typeof Object.getOwnPropertySymbols === \"function\") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {\n    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];\n  }\n  return t;\n};\nimport * as React from 'react';\nimport genPurePanel from '../_util/PurePanel';\nimport { devUseWarning } from '../_util/warning';\nimport DatePicker from '../date-picker';\nimport useVariant from '../form/hooks/useVariants';\nconst {\n  TimePicker: InternalTimePicker,\n  RangePicker: InternalRangePicker\n} = DatePicker;\nconst RangePicker = /*#__PURE__*/React.forwardRef((props, ref) => (/*#__PURE__*/React.createElement(InternalRangePicker, Object.assign({}, props, {\n  picker: \"time\",\n  mode: undefined,\n  ref: ref\n}))));\nconst TimePicker = /*#__PURE__*/React.forwardRef((_a, ref) => {\n  var {\n      addon,\n      renderExtraFooter,\n      variant,\n      bordered\n    } = _a,\n    restProps = __rest(_a, [\"addon\", \"renderExtraFooter\", \"variant\", \"bordered\"]);\n  if (process.env.NODE_ENV !== 'production') {\n    const warning = devUseWarning('TimePicker');\n    warning.deprecated(!addon, 'addon', 'renderExtraFooter');\n  }\n  const [mergedVariant] = useVariant('timePicker', variant, bordered);\n  const internalRenderExtraFooter = React.useMemo(() => {\n    if (renderExtraFooter) {\n      return renderExtraFooter;\n    }\n    if (addon) {\n      return addon;\n    }\n    return undefined;\n  }, [addon, renderExtraFooter]);\n  return /*#__PURE__*/React.createElement(InternalTimePicker, Object.assign({}, restProps, {\n    mode: undefined,\n    ref: ref,\n    renderExtraFooter: internalRenderExtraFooter,\n    variant: mergedVariant\n  }));\n});\nif (process.env.NODE_ENV !== 'production') {\n  TimePicker.displayName = 'TimePicker';\n}\n// We don't care debug panel\n/* istanbul ignore next */\nconst PurePanel = genPurePanel(TimePicker, 'popupAlign', undefined, 'picker');\nTimePicker._InternalPanelDoNotUseOrYouWillBeFired = PurePanel;\nTimePicker.RangePicker = RangePicker;\nTimePicker._InternalPanelDoNotUseOrYouWillBeFired = PurePanel;\nexport default TimePicker;","import { createDecorators } from \"@next-core/element\";\nimport { ReactNextElement } from \"@next-core/react-element\";\nimport type { AbstractForm, ColProps } from \"./Form.js\";\nimport { UseSingleBrickConf } from \"@next-core/types\";\n\nconst { method, property } = createDecorators();\n\nexport abstract class FormItemElementBase extends ReactNextElement {\n  accessor #_notRender = false;\n  accessor #validate = \"normal\";\n  accessor #bindFormItem = false;\n\n  get isFormItemElement(): true {\n    return true;\n  }\n\n  set validateState(value: string) {\n    this.#validate = value;\n    this._render();\n  }\n  get validateState() {\n    return this.#validate;\n  }\n\n  /**\n   * 控制该表单项是否隐藏\n   * @default false\n   * @group ui\n   */\n  set notRender(value: boolean) {\n    this.hidden = value;\n    this.#_notRender = value;\n    this._render();\n  }\n  get notRender(): boolean {\n    return this.#_notRender;\n  }\n\n  get $bindFormItem() {\n    return this.#bindFormItem;\n  }\n  set $bindFormItem(value: boolean) {\n    this.#bindFormItem = value;\n    this._render();\n  }\n\n  @property({\n    attribute: false,\n  })\n  accessor helpBrick:\n    | { useBrick: UseSingleBrickConf | UseSingleBrickConf[] }\n    | undefined;\n\n  @property({\n    attribute: false,\n  })\n  accessor labelBrick:\n    | { useBrick: UseSingleBrickConf | UseSingleBrickConf[] }\n    | undefined;\n\n  @property({\n    attribute: false,\n  })\n  accessor labelCol: ColProps | undefined;\n\n  @property({\n    attribute: false,\n  })\n  accessor wrapperCol: ColProps | undefined;\n\n  @method()\n  setNotRender(value: boolean) {\n    this.notRender = value;\n  }\n\n  @method()\n  getFormElement(): AbstractForm | null {\n    // eslint-disable-next-line @typescript-eslint/no-this-alias\n    let element: AbstractForm | null = this as unknown as AbstractForm;\n    while ((element = element.parentNode as AbstractForm | null)) {\n      if (!element || element.isFormElement) {\n        break;\n      }\n    }\n    return element as AbstractForm | null;\n  }\n}\n","// Imports\nimport ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/noSourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `.ant-picker{border-radius:var(--small-border-radius);height:30px}.ant-picker-dropdown .ant-picker-panel-container{border:var(--medius-border-radius)}.ant-picker-dropdown .ant-picker-panel > .ant-picker-time-panel{padding-top:0}.ant-picker-dropdown\n  .ant-picker-time-panel-column\n  > li.ant-picker-time-panel-cell{margin-left:0;margin-right:0}.ant-picker-dropdown\n  .ant-picker-time-panel-column\n  > li.ant-picker-time-panel-cell\n  .ant-picker-time-panel-cell-inner{width:auto;border-radius:0}.ant-picker-dropdown .ant-picker-time-panel-column{margin:0}.ant-picker-dropdown .ant-picker-ranges{margin-top:0px;padding:3px 10px;background-color:var(--color-fill-bg-base-3)}.ant-btn{box-shadow:none}`, \"\"]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___.toString();\n","// istanbul ignore file\nimport { pick } from \"lodash\";\nimport type { FormItemProps } from \"./interfaces\";\n\nconst FORM_ITEM_PROP_NAMES = [\n  \"formElement\",\n  \"curElement\",\n  \"name\",\n  \"label\",\n  \"current\",\n  \"required\",\n  \"pattern\",\n  \"type\",\n  \"min\",\n  \"max\",\n  \"labelCol\",\n  \"wrapperCol\",\n  \"message\",\n  \"layout\",\n  \"size\",\n  \"trigger\",\n  \"valuePropsName\",\n  \"notRender\",\n  \"helpBrick\",\n  \"labelBrick\",\n  \"needValidate\",\n  \"validator\",\n] as const;\n\nexport function pickFormItemProps<T extends FormItemProps>(\n  props: T\n): FormItemProps {\n  return pick(props, FORM_ITEM_PROP_NAMES);\n}\n\n/* ====== Type checks ====== */\ntype Equal<X, Y> =\n  (<T>() => T extends X ? 1 : 2) extends <T>() => T extends Y ? 1 : 2\n    ? true\n    : false;\ntype Expect<T extends true> = T;\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\ntype cases = [\n  Expect<Equal<keyof FormItemProps, (typeof FORM_ITEM_PROP_NAMES)[number]>>,\n];\n","// Imports\nimport ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/noSourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:host{display:inline-block}:host([hidden]){display:none}`, \"\"]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___.toString();\n"],"names":["dayjs","customParseFormat","defineElement","property","event","createDecorators","WrappedFormItem","wrapBrick","_EoTimePicker","_A","WeakMap","_B","_C","_D","_E","_F","_G","_H","_I","_EoTimePicker_brand","WeakSet","_J","_K","_handleOpenChange","EoTimePicker","FormItemElementBase","constructor","arguments","_classPrivateMethodInitSpec","_classPrivateFieldInitSpec","_init_name","_init_extra_name","_init_label","_init_extra_label","_init_value","_init_extra_value","_init_placeholder","_init_extra_placeholder","_init_message","_init_extra_message","_init_disabled","_init_extra_disabled","_init_required","_init_extra_required","_init_configProps","_init_extra_configProps","_init_changeEvent","_init_extra_changeEvent","_init_openEvent","_init_extra_openEvent","_init_closeEvent","_defineProperty","_init_extra_closeEvent","value","this","_classPrivateGetter","_get_changeEvent","emit","flag","_get_openEvent","_get_closeEvent","name","_classPrivateFieldGet","v","_classPrivateFieldSet","label","placeholder","message","disabled","required","configProps","render","React","EoTimePickerComponent","curElement","formElement","getFormElement","onChange","handleChange","trigger","onOpenChange","notRender","labelBrick","helpBrick","shadowRoot","props","_ref","currentTheme","useCurrentTheme","locale","i18n","language","split","enUS","zhCN","setValue","useState","format","useEffect","isNil","cahce","useMemo","createCache","_extends","exportparts","pickFormItemProps","ConfigProvider","theme","algorithm","darkAlgorithm","defaultAlgorithm","StyleProvider","container","cache","e","stopPropagation","TimePicker","getPopupContainer","_time","timeString","allowClear","_EoTimePicker2","_set_changeEvent","_set_openEvent","_set_closeEvent","c","_initClass","_applyDecs","styleTexts","styleText","fixStyleText","attribute","type","Boolean","o","_","has","_checkInRHS","InternalTimePicker","RangePicker","InternalRangePicker","ref","Object","assign","picker","mode","undefined","_a","addon","renderExtraFooter","variant","bordered","restProps","s","t","p","prototype","hasOwnProperty","call","indexOf","getOwnPropertySymbols","i","length","propertyIsEnumerable","__rest","mergedVariant","internalRenderExtraFooter","PurePanel","_InternalPanelDoNotUseOrYouWillBeFired","method","_FormItemElementBase_brand","ReactNextElement","_initProto","_init_helpBrick","_init_extra_helpBrick","_init_labelBrick","_init_extra_labelBrick","_init_labelCol","_init_extra_labelCol","_init_wrapperCol","_init_extra_wrapperCol","isFormItemElement","validateState","_classPrivateSetter","_set_validate","_render","_get_validate","hidden","_set__notRender","_get__notRender","$bindFormItem","_get_bindFormItem","_set_bindFormItem","labelCol","wrapperCol","setNotRender","element","parentNode","isFormElement","_this","_this2","_this3","_this4","_this5","_this6","_FormItemElementBase","___CSS_LOADER_EXPORT___","push","module","id","toString","FORM_ITEM_PROP_NAMES","pick"],"sourceRoot":""}

package/dist/examples.json

@@ -1,7 +1,4 @@
 {
-  "eo-form": {
-    "doc": "表单构件。\n\n## Examples\n\n### Layout\n\n```yaml preview\n- brick: eo-form\n  properties:\n    layout: inline\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            label: input\n        - brick: eo-select\n          properties:\n            label: select\n- brick: div\n  properties:\n    style:\n      height: 1px\n      background: \"#abc\"\n      margin: \"20px 0\"\n- brick: eo-form\n  properties:\n    layout: horizontal\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            label: input\n        - brick: eo-select\n          properties:\n            label: select\n- brick: div\n  properties:\n    style:\n      height: 1px\n      background: \"#abc\"\n      margin: \"20px 0\"\n- brick: eo-form\n  properties:\n    layout: vertical\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            label: input\n        - brick: eo-select\n          properties:\n            label: select\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form layout=\"inline\">\n#   <eo-input label=\"input\"></eo-input>\n#   <eo-select label=\"select\"></eo-select>\n# </eo-form>\n# <div style=\"height: 1px; background: #abc; margin: 20px 0\"></div>\n# <eo-form layout=\"horizontal\">\n#   <eo-input label=\"input\"></eo-input>\n#   <eo-select label=\"select\"></eo-select>\n# </eo-form>\n# <div style=\"height: 1px; background: #abc; margin: 20px 0\"></div>\n# <eo-form layout=\"vertical\">\n#   <eo-input label=\"input\"></eo-input>\n#   <eo-select label=\"select\"></eo-select>\n# </eo-form>\n# \n```\n\n### Values\n\n```yaml preview\n- brick: eo-form\n  properties:\n    values:\n      input: This is default value\n      select: Beijing\n      radio: Guangzhou\n      checkbox:\n        - C\n        - D\n      textarea: \"Hello World! \\nNice to see you!\"\n      dynamicForm:\n        - input: beijing\n          select: Guangzhou\n        - input: shenzhen\n          select: Shenzhen\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            label: input\n            name: input\n        - brick: eo-select\n          properties:\n            label: select\n            name: select\n            options:\n              - Beijing\n              - Shanghai\n        - brick: eo-radio\n          properties:\n            label: radio\n            name: radio\n            options:\n              - Guangzhou\n              - Shenzhen\n        - brick: eo-checkbox\n          properties:\n            name: checkbox\n            label: checkbox\n            options:\n              - A\n              - B\n              - C\n              - D\n        - brick: eo-textarea\n          properties:\n            name: textarea\n            label: textarea\n            autoSize:\n              minRows: 3\n        - brick: eo-dynamic-form-item\n          properties:\n            label: dynamic-form\n            name: dynamicForm\n            useBrick:\n              - brick: eo-input\n                properties:\n                  name: input\n              - brick: eo-select\n                properties:\n                  name: select\n                  options:\n                    - Beijing\n                    - Shanghai\n                    - Guangzhou\n                    - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form values=\"[object Object]\">\n#   <eo-input label=\"input\" name=\"input\"></eo-input>\n#   <eo-select label=\"select\" name=\"select\" id=\"brick-1\"></eo-select>\n#   <eo-radio label=\"radio\" name=\"radio\" id=\"brick-2\"></eo-radio>\n#   <eo-checkbox name=\"checkbox\" label=\"checkbox\" id=\"brick-3\"></eo-checkbox>\n#   <eo-textarea name=\"textarea\" label=\"textarea\" id=\"brick-4\"></eo-textarea>\n#   <eo-dynamic-form-item\n#     label=\"dynamic-form\"\n#     name=\"dynamicForm\"\n#     id=\"brick-5\"\n#   ></eo-dynamic-form-item>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\"];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\"Guangzhou\", \"Shenzhen\"];\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.options = [\"A\", \"B\", \"C\", \"D\"];\n# \n#   const brick_4 = document.getElementById(\"brick-4\");\n#   brick_4.autoSize = {\n#     minRows: 3,\n#   };\n# \n#   const brick_5 = document.getElementById(\"brick-5\");\n#   brick_5.useBrick = [\n#     {\n#       brick: \"eo-input\",\n#       properties: {\n#         name: \"input\",\n#       },\n#     },\n#     {\n#       brick: \"eo-select\",\n#       properties: {\n#         name: \"select\",\n#         options: [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"],\n#       },\n#     },\n#   ];\n# </script>\n# \n```\n\n### Events\n\n```yaml preview\n- brick: eo-form\n  events:\n    values.change:\n      - action: console.log\n    validate.success:\n      - action: message.success\n        args:\n          - 表单提交成功\n    validate.error:\n      - action: message.error\n        args:\n          - 表单校验失败\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            required: true\n            name: name\n            label: 姓名\n            max: 6\n            min: 2\n            message:\n              required: 一定要填写姓名哟\n              max: 不能超过 6 个字符哟\n              min: 最少填写 2 个字符哟\n        - brick: eo-select\n          properties:\n            required: true\n            name: sex\n            label: 性别\n            options:\n              - label: 男\n                value: 0\n              - label: 女\n                value: 1\n        - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-input\n#     required\n#     name=\"name\"\n#     label=\"姓名\"\n#     max=\"6\"\n#     min=\"2\"\n#     id=\"brick-2\"\n#   ></eo-input>\n#   <eo-select required name=\"sex\" label=\"性别\" id=\"brick-3\"></eo-select>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"success\", message: \"表单提交成功\" });\n#   });\n#   brick_1.addEventListener(\"validate.error\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"error\", message: \"表单校验失败\" });\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.message = {\n#     required: \"一定要填写姓名哟\",\n#     max: \"不能超过 6 个字符哟\",\n#     min: \"最少填写 2 个字符哟\",\n#   };\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.options = [\n#     {\n#       label: \"男\",\n#       value: 0,\n#     },\n#     {\n#       label: \"女\",\n#       value: 1,\n#     },\n#   ];\n# </script>\n# \n```\n\n### Method\n\n```yaml preview\n- brick: eo-form\n  properties:\n    id: form\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            required: true\n            name: name\n            label: 姓名\n            max: 6\n            min: 2\n        - brick: eo-select\n          properties:\n            required: true\n            name: sex\n            label: 性别\n            options:\n              - label: 男\n                value: 0\n              - label: 女\n                value: 1\n- brick: eo-button\n  properties:\n    textContent: validateFields\n  events:\n    click:\n      - target: \"#form\"\n        method: validate\n- brick: eo-button\n  properties:\n    textContent: setInitValue\n  events:\n    click:\n      - target: \"#form\"\n        method: setInitValue\n        args:\n          - name: Mike\n            sex: 0\n- brick: eo-button\n  properties:\n    textContent: resetFields\n  events:\n    click:\n      - target: \"#form\"\n        method: resetFields\n- brick: eo-button\n  properties:\n    textContent: resetFields(name)\n  events:\n    click:\n      - target: \"#form\"\n        method: resetFields\n        args:\n          - name\n- brick: eo-button\n  properties:\n    textContent: getFieldsValue\n  events:\n    click:\n      - target: \"#form\"\n        method: getFieldsValue\n        callback:\n          success:\n            - action: console.log\n- brick: eo-button\n  properties:\n    textContent: getFieldsValue(name)\n  events:\n    click:\n      - target: \"#form\"\n        method: getFieldsValue\n        args:\n          - name\n        callback:\n          success:\n            - action: console.log\n- brick: eo-button\n  properties:\n    textContent: validateField(name)\n  events:\n    click:\n      - target: \"#form\"\n        method: validateField\n        args:\n          - name\n- brick: eo-button\n  properties:\n    textContent: resetValidateState\n  events:\n    click:\n      - target: \"#form\"\n        method: resetValidateState\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"form\">\n#   <eo-input required name=\"name\" label=\"姓名\" max=\"6\" min=\"2\"></eo-input>\n#   <eo-select required name=\"sex\" label=\"性别\" id=\"brick-1\"></eo-select>\n# </eo-form>\n# <eo-button id=\"brick-2\">validateFields</eo-button>\n# <eo-button id=\"brick-3\">setInitValue</eo-button>\n# <eo-button id=\"brick-4\">resetFields</eo-button>\n# <eo-button id=\"brick-5\">resetFields(name)</eo-button>\n# <eo-button id=\"brick-6\">getFieldsValue</eo-button>\n# <eo-button id=\"brick-7\">getFieldsValue(name)</eo-button>\n# <eo-button id=\"brick-8\">validateField(name)</eo-button>\n# <eo-button id=\"brick-9\">resetValidateState</eo-button>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"男\",\n#       value: 0,\n#     },\n#     {\n#       label: \"女\",\n#       value: 1,\n#     },\n#   ];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.validate();\n#   });\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.setInitValue({ name: \"Mike\", sex: 0 });\n#   });\n# \n#   const brick_4 = document.getElementById(\"brick-4\");\n#   brick_4.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.resetFields();\n#   });\n# \n#   const brick_5 = document.getElementById(\"brick-5\");\n#   brick_5.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.resetFields(\"name\");\n#   });\n# \n#   const brick_6 = document.getElementById(\"brick-6\");\n#   brick_6.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.getFieldsValue();\n#   });\n# \n#   const brick_7 = document.getElementById(\"brick-7\");\n#   brick_7.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.getFieldsValue(\"name\");\n#   });\n# \n#   const brick_8 = document.getElementById(\"brick-8\");\n#   brick_8.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.validateField(\"name\");\n#   });\n# \n#   const brick_9 = document.getElementById(\"brick-9\");\n#   brick_9.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.resetValidateState();\n#   });\n# </script>\n# \n```\n\n### Theme variant Elevo\n\n```yaml preview\n# Use this container to emulate background\nbrick: ai-portal.home-container\nproperties:\n  style:\n    padding: 2em\n    backgroundColor: \"#d8d8d8\"\nchildren:\n  - brick: eo-form\n    properties:\n      themeVariant: elevo\n      layout: vertical\n      values:\n        city: 深圳\n        public: true\n        tags:\n          - 活泼\n    events:\n      validate.success:\n        useProvider: basic.show-dialog\n        args:\n          - title: 提交表单\n            type: confirm\n            content: 确定提交吗？\n            themeVariant: elevo\n    children:\n      - brick: eo-input\n        properties:\n          label: 名称\n          name: name\n          themeVariant: elevo\n          placeholder: 请输入\n      - brick: eo-textarea\n        properties:\n          label: 说明\n          name: desc\n          themeVariant: elevo\n          placeholder: 请输入\n      - brick: eo-select\n        properties:\n          label: 类型\n          name: type\n          themeVariant: elevo\n          placeholder: 请选择\n          options:\n            - 默认\n            - 其他\n      - brick: eo-radio\n        properties:\n          label: 城市\n          name: city\n          type: button\n          themeVariant: elevo\n          options:\n            - 北京\n            - 上海\n            - 深圳\n      - brick: eo-checkbox\n        properties:\n          label: 标签\n          name: tags\n          themeVariant: elevo\n          options:\n            - 活泼\n            - 开朗\n            - 好动\n      - brick: eo-switch\n        properties:\n          label: 公开\n          name: public\n          themeVariant: elevo\n      - brick: eo-submit-buttons\n        properties:\n          themeVariant: elevo\n          submitText: 提交\n          cancelText: 取消\n          submitType: primary\n          cancelType: default\n# -- YAML DELIMITER (1nbbm8) --\n# <ai-portal.home-container style=\"padding: 2em; background-color: #d8d8d8\">\n#   <eo-form\n#     theme-variant=\"elevo\"\n#     layout=\"vertical\"\n#     values=\"[object Object]\"\n#     id=\"brick-1\"\n#   >\n#     <eo-input\n#       label=\"名称\"\n#       name=\"name\"\n#       theme-variant=\"elevo\"\n#       placeholder=\"请输入\"\n#     ></eo-input>\n#     <eo-textarea\n#       label=\"说明\"\n#       name=\"desc\"\n#       theme-variant=\"elevo\"\n#       placeholder=\"请输入\"\n#     ></eo-textarea>\n#     <eo-select\n#       label=\"类型\"\n#       name=\"type\"\n#       theme-variant=\"elevo\"\n#       placeholder=\"请选择\"\n#       id=\"brick-2\"\n#     ></eo-select>\n#     <eo-radio\n#       label=\"城市\"\n#       name=\"city\"\n#       type=\"button\"\n#       theme-variant=\"elevo\"\n#       id=\"brick-3\"\n#     ></eo-radio>\n#     <eo-checkbox\n#       label=\"标签\"\n#       name=\"tags\"\n#       theme-variant=\"elevo\"\n#       id=\"brick-4\"\n#     ></eo-checkbox>\n#     <eo-switch label=\"公开\" name=\"public\" theme-variant=\"elevo\"></eo-switch>\n#     <eo-submit-buttons\n#       theme-variant=\"elevo\"\n#       submit-text=\"提交\"\n#       cancel-text=\"取消\"\n#       submit-type=\"primary\"\n#       cancel-type=\"default\"\n#     ></eo-submit-buttons>\n#   </eo-form>\n# </ai-portal.home-container>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     const provider = document.createElement(\"basic.show-dialog\");\n#     provider.resolve({\n#       title: \"提交表单\",\n#       type: \"confirm\",\n#       content: \"确定提交吗？\",\n#       themeVariant: \"elevo\",\n#     });\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\"默认\", \"其他\"];\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.options = [\"北京\", \"上海\", \"深圳\"];\n# \n#   const brick_4 = document.getElementById(\"brick-4\");\n#   brick_4.options = [\"活泼\", \"开朗\", \"好动\"];\n# </script>\n# \n```\n"
-  },
   "eo-textarea": {
     "doc": "表单多行文本输入框构件。\n\n```yaml preview\n- brick: eo-textarea\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-textarea></eo-textarea>\n# \n```\n\n## Examples\n\n### Label\n\n```yaml preview\n- brick: eo-textarea\n  properties:\n    label: 多行输入框\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-textarea label=\"多行输入框\"></eo-textarea>\n# \n```\n\n### Value\n\n```yaml preview\n- brick: eo-textarea\n  properties:\n    value: Default Value\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-textarea value=\"Default Value\"></eo-textarea>\n# \n```\n\n### Disabled\n\n```yaml preview\n- brick: eo-textarea\n  properties:\n    value: Default Value\n    disabled: true\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-textarea value=\"Default Value\" disabled></eo-textarea>\n# \n```\n\n### Placeholder\n\n```yaml preview\n- brick: eo-textarea\n  properties:\n    placeholder: This is placeholder...\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-textarea placeholder=\"This is placeholder...\"></eo-textarea>\n# \n```\n\n### max length\n\n```yaml preview\n- brick: eo-textarea\n  properties:\n    placeholder: max length = 10\n    maxLength: 10\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-textarea placeholder=\"max length = 10\" max-length=\"10\"></eo-textarea>\n# \n```\n\n### AutoSize\n\n```yaml preview\n- brick: eo-textarea\n  properties:\n    placeholder: \"autoSize: true\"\n    autoSize: true\n- brick: eo-textarea\n  properties:\n    placeholder: \"autoSize: { minRows: 3}\"\n    autoSize:\n      minRows: 3\n- brick: eo-textarea\n  properties:\n    placeholder: \"autoSize: { minRows: 3, maxRows: 5}\"\n    autoSize:\n      minRows: 3\n      maxRows: 5\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-textarea placeholder=\"autoSize: true\" id=\"brick-1\"></eo-textarea>\n# <eo-textarea placeholder=\"autoSize: { minRows: 3}\" id=\"brick-2\"></eo-textarea>\n# <eo-textarea\n#   placeholder=\"autoSize: { minRows: 3, maxRows: 5}\"\n#   id=\"brick-3\"\n# ></eo-textarea>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.autoSize = true;\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.autoSize = {\n#     minRows: 3,\n#   };\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.autoSize = {\n#     minRows: 3,\n#     maxRows: 5,\n#   };\n# </script>\n# \n```\n\n### Textarea Style\n\n```yaml preview\n- brick: eo-textarea\n  properties:\n    placeholder: \"width: 180px\"\n    textareaStyle:\n      width: 180px\n- brick: eo-textarea\n  properties:\n    placeholder: \"width: 250px\"\n    textareaStyle:\n      width: 250px\n- brick: eo-textarea\n  properties:\n    placeholder: \"border style\"\n    textareaStyle:\n      border: \"1px solid #8b2121\"\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-textarea placeholder=\"width: 180px\" id=\"brick-1\"></eo-textarea>\n# <eo-textarea placeholder=\"width: 250px\" id=\"brick-2\"></eo-textarea>\n# <eo-textarea placeholder=\"border style\" id=\"brick-3\"></eo-textarea>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.textareaStyle = {\n#     width: \"180px\",\n#   };\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.textareaStyle = {\n#     width: \"250px\",\n#   };\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.textareaStyle = {\n#     border: \"1px solid #8b2121\",\n#   };\n# </script>\n# \n```\n\n### Event\n\n```yaml preview\n- brick: eo-textarea\n  events:\n    label: Event\n    change:\n      action: message.success\n      args:\n        - <% EVENT.detail %>\n    focus:\n      action: message.success\n      args:\n        - focus\n    blur:\n      action: message.success\n      args:\n        - blur\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-textarea id=\"brick-1\"></eo-textarea>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"label\", (e) => {\n#     // WARN: encountered incompatible event handlers in HTML mode, please try YAML.\n#   });\n#   brick_1.addEventListener(\"change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"success\", message: e.detail });\n#   });\n#   brick_1.addEventListener(\"focus\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"success\", message: \"focus\" });\n#   });\n#   brick_1.addEventListener(\"blur\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"success\", message: \"blur\" });\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-textarea\n      properties:\n        label: 输入框\n        name: text\n        required: true\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-textarea label=\"输入框\" name=\"text\" required></eo-textarea>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
   },
@@ -11,12 +8,15 @@
   "eo-select": {
     "doc": "表单下拉选择构件。\n\n```yaml preview minHeight=\"250px\"\n- brick: eo-select\n  properties:\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n## Examples\n\n### Label\n\n```yaml preview minHeight=\"250px\"\n- brick: eo-select\n  properties:\n    label: city\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select label=\"city\" id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n### Value\n\n```yaml preview minHeight=\"250px\"\n- brick: eo-select\n  properties:\n    label: city\n    value: Shanghai\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select label=\"city\" id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.value = \"Shanghai\";\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n### Options\n\n```yaml preview minHeight=\"300px\"\n- brick: eo-select\n  properties:\n    label: string\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n    value: Guangzhou\n- brick: div\n  properties:\n    style:\n      height: 20px\n- brick: eo-select\n  properties:\n    label: Array<object>\n    options:\n      - label: Beijing\n        value: 0\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n    value: 2\n- brick: div\n  properties:\n    style:\n      height: 20px\n- brick: eo-select\n  properties:\n    label: boolean\n    options:\n      - true\n      - false\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select label=\"string\" id=\"brick-1\"></eo-select>\n# <div style=\"height: 20px\"></div>\n# <eo-select label=\"Array&lt;object&gt;\" id=\"brick-2\"></eo-select>\n# <div style=\"height: 20px\"></div>\n# <eo-select label=\"boolean\" id=\"brick-3\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n#   brick_1.value = \"Guangzhou\";\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n#   brick_2.value = 2;\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.options = [true, false];\n# </script>\n# \n```\n\n### Disabled\n\n```yaml preview minHeight=\"250px\"\n- brick: eo-select\n  properties:\n    options:\n      - label: Beijing\n        value: 0\n        disabled: true\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n- brick: eo-select\n  properties:\n    disabled: true\n    options:\n      - label: Beijing\n        value: 0\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select id=\"brick-1\"></eo-select>\n# <eo-select disabled id=\"brick-2\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#       disabled: true,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n# </script>\n# \n```\n\n### Multiple\n\n```yaml preview minHeight=\"250px\"\n- brick: eo-select\n  properties:\n    label: multiple\n    mode: multiple\n    value:\n      - Beijing\n      - Guangzhou\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select label=\"multiple\" mode=\"multiple\" id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.value = [\"Beijing\", \"Guangzhou\"];\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n### Tags\n\n```yaml preview minHeight=\"250px\"\n- brick: eo-select\n  properties:\n    label: tags\n    mode: tags\n    tokenSeparators:\n      - \" \"\n      - \";\"\n      - \"；\"\n    maxTagCount: 3\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select label=\"tags\" mode=\"tags\" max-tag-count=\"3\" id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.tokenSeparators = [\" \", \";\", \"；\"];\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n### Placeholder\n\n```yaml preview minHeight=\"250px\"\n- brick: eo-select\n  properties:\n    placeholder: This is placeholder...\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select placeholder=\"This is placeholder...\" id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n### Suffix\n\n```yaml preview minHeight=\"250px\"\n- brick: eo-select\n  properties:\n    placeholder: This is placeholder...\n    options:\n      - label: Beijing\n        value: 1\n        color: red\n        tag: 京\n      - label: Shanghai\n        value: 2\n        color: green\n        tag: 沪\n      - label: Guangzhou\n        value: 3\n        color: blue\n        tag: 粤\n      - label: Shenzhen\n        value: 4\n        color: yellow\n        tag: 粤\n    suffix:\n      useBrick:\n        brick: eo-tag\n        properties:\n          textContent: <% DATA.tag %>\n          color: <% DATA.color %>\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select placeholder=\"This is placeholder...\" id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 1,\n#       color: \"red\",\n#       tag: \"京\",\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 2,\n#       color: \"green\",\n#       tag: \"沪\",\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 3,\n#       color: \"blue\",\n#       tag: \"粤\",\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 4,\n#       color: \"yellow\",\n#       tag: \"粤\",\n#     },\n#   ];\n#   brick_1.suffix = {\n#     useBrick: {\n#       brick: \"eo-tag\",\n#       properties: {\n#         textContent: \"<% DATA.tag %>\",\n#         color: \"<% DATA.color %>\",\n#       },\n#     },\n#   };\n# </script>\n# \n```\n\n### GroupBy\n\n```yaml preview minHeight=\"300px\"\n- brick: eo-select\n  properties:\n    placeholder: This is placeholder...\n    groupBy: tag\n    options:\n      - label: Beijing\n        value: 1\n        color: red\n        tag: 京\n      - label: Shanghai\n        value: 2\n        color: green\n        tag: 沪\n      - label: Guangzhou\n        value: 3\n        color: blue\n        tag: 粤\n      - label: Shenzhen\n        value: 4\n        color: yellow\n        tag: 粤\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select\n#   placeholder=\"This is placeholder...\"\n#   group-by=\"tag\"\n#   id=\"brick-1\"\n# ></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 1,\n#       color: \"red\",\n#       tag: \"京\",\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 2,\n#       color: \"green\",\n#       tag: \"沪\",\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 3,\n#       color: \"blue\",\n#       tag: \"粤\",\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 4,\n#       color: \"yellow\",\n#       tag: \"粤\",\n#     },\n#   ];\n# </script>\n# \n```\n\n### caption 展示下拉候选项说明文案\n\n```yaml preview minHeight=\"300px\"\n- brick: eo-select\n  properties:\n    placeholder: This is placeholder...\n    options:\n      - caption: 如nginx、api_gateway等\n        label: 接入层\n        value: 接入层\n      - caption: 如DB等\n        label: 数据层\n        value: 数据层\n      - caption: 如业务逻辑组件\n        label: 业务层\n        value: 业务层\n      - caption: 如平台通用组件\n        label: 中台层\n        value: 中台层\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select placeholder=\"This is placeholder...\" id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       caption: \"如nginx、api_gateway等\",\n#       label: \"接入层\",\n#       value: \"接入层\",\n#     },\n#     {\n#       caption: \"如DB等\",\n#       label: \"数据层\",\n#       value: \"数据层\",\n#     },\n#     {\n#       caption: \"如业务逻辑组件\",\n#       label: \"业务层\",\n#       value: \"业务层\",\n#     },\n#     {\n#       caption: \"如平台通用组件\",\n#       label: \"中台层\",\n#       value: \"中台层\",\n#     },\n#   ];\n# </script>\n# \n```\n\n### Fields\n\n```yaml preview minHeight=\"300px\"\n- brick: eo-select\n  properties:\n    placeholder: This is placeholder...\n    fields:\n      label: name\n      value: city\n    value: 3\n    options:\n      - name: Beijing\n        city: 1\n        color: red\n        tag: 京\n      - name: Shanghai\n        city: 2\n        color: green\n        tag: 沪\n      - name: Guangzhou\n        city: 3\n        color: blue\n        tag: 粤\n      - name: Shenzhen\n        city: 4\n        color: yellow\n        tag: 粤\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select placeholder=\"This is placeholder...\" id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.fields = {\n#     label: \"name\",\n#     value: \"city\",\n#   };\n#   brick_1.value = 3;\n#   brick_1.options = [\n#     {\n#       name: \"Beijing\",\n#       city: 1,\n#       color: \"red\",\n#       tag: \"京\",\n#     },\n#     {\n#       name: \"Shanghai\",\n#       city: 2,\n#       color: \"green\",\n#       tag: \"沪\",\n#     },\n#     {\n#       name: \"Guangzhou\",\n#       city: 3,\n#       color: \"blue\",\n#       tag: \"粤\",\n#     },\n#     {\n#       name: \"Shenzhen\",\n#       city: 4,\n#       color: \"yellow\",\n#       tag: \"粤\",\n#     },\n#   ];\n# </script>\n# \n```\n\n### UseBackend\n\n```yaml preview minHeight=\"300px\"\n- brick: eo-select\n  properties:\n    label: useBackend\n    placeholder: 后端搜索\n    value: Shenzhen\n    useBackend:\n      provider: basic.http-request\n      transform: |\n        <% (data) => data %>\n      onValueChangeArgs:\n        - |\n          <% \n            (q) => \n              `//api.weatherapi.com/v1/search.json?q=${q}&key=${MISC.weather_api_key}`\n          %>\n      args:\n        - |\n          <% \n            (q) => \n              `//api.weatherapi.com/v1/search.json?q=${q ? q : \"China\"}&key=${MISC.weather_api_key}`\n          %>\n    fields:\n      label: name\n      value: name\n    suffix:\n      useBrick:\n        brick: eo-tag\n        properties:\n          textContent: <% DATA.country %>\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select label=\"useBackend\" placeholder=\"后端搜索\" id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.value = \"Shenzhen\";\n#   brick_1.useBackend = {\n#     provider: \"basic.http-request\",\n#     transform: \"<% (data) => data %>\\n\",\n#     onValueChangeArgs: [\n#       \"<% \\n  (q) => \\n    `//api.weatherapi.com/v1/search.json?q=${q}&key=${MISC.weather_api_key}`\\n%>\\n\",\n#     ],\n#     args: [\n#       '<% \\n  (q) => \\n    `//api.weatherapi.com/v1/search.json?q=${q ? q : \"China\"}&key=${MISC.weather_api_key}`\\n%>\\n',\n#     ],\n#   };\n#   brick_1.fields = {\n#     label: \"name\",\n#     value: \"name\",\n#   };\n#   brick_1.suffix = {\n#     useBrick: {\n#       brick: \"eo-tag\",\n#       properties: {\n#         textContent: \"<% DATA.country %>\",\n#       },\n#     },\n#   };\n# </script>\n# \n```\n\n### Input Style\n\n```yaml preview minHeight=\"250px\"\n- brick: eo-select\n  properties:\n    inputStyle:\n      width: 180px\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select id=\"brick-1\"></eo-select>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.inputStyle = {\n#     width: \"180px\",\n#   };\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n### Event\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-select\n  properties:\n    id: options-change-select\n    label: Single\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n  events:\n    change:\n      - action: message.success\n        args:\n          - <% JSON.stringify(EVENT.detail) %>\n    options.change:\n      - action: message.success\n        args:\n          - <% JSON.stringify(EVENT.detail) %>\n- brick: eo-select\n  properties:\n    label: Multiple\n    multiple: true\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n  events:\n    change:\n      - action: message.success\n        args:\n          - <% JSON.stringify(EVENT.detail) %>\n- brick: eo-button\n  properties:\n    textContent: Click to change options\n  events:\n    click:\n      - target: \"#options-change-select\"\n        properties:\n          options:\n            - Beijing\n            - Shanghai\n            - Guangzhou\n            - Shenzhen\n            - Hangzhou\n- brick: div\n  properties:\n    style:\n      height: 20px\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-select label=\"Single\" id=\"options-change-select\"></eo-select>\n# <eo-select label=\"Multiple\" multiple id=\"brick-1\"></eo-select>\n# <eo-button id=\"brick-2\">Click to change options</eo-button>\n# <div style=\"height: 20px\"></div>\n# \n# <script>\n#   const options_change-select = document.getElementById(\"options-change-select\");\n#   options_change-select.options = [\n#     \"Beijing\",\n#     \"Shanghai\",\n#     \"Guangzhou\",\n#     \"Shenzhen\"\n#   ];\n#   options_change-select.addEventListener(\"change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"success\", message: /* WARN: incompatible expressions in HTML, please try YAML: */\n#     \"<% JSON.stringify(EVENT.detail) %>\" });\n#   });\n#   options_change-select.addEventListener(\"options.change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"success\", message: /* WARN: incompatible expressions in HTML, please try YAML: */\n#     \"<% JSON.stringify(EVENT.detail) %>\" });\n#   });\n# \n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     \"Beijing\",\n#     \"Shanghai\",\n#     \"Guangzhou\",\n#     \"Shenzhen\"\n#   ];\n#   brick_1.addEventListener(\"change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"success\", message: /* WARN: incompatible expressions in HTML, please try YAML: */\n#     \"<% JSON.stringify(EVENT.detail) %>\" });\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#options-change-select\");\n#     brick.options = [\n#     \"Beijing\",\n#     \"Shanghai\",\n#     \"Guangzhou\",\n#     \"Shenzhen\",\n#     \"Hangzhou\"\n#   ];\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview minHeight=\"250px\"\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-select\n      properties:\n        options:\n          - Beijing\n          - Shanghai\n          - Guangzhou\n          - Shenzhen\n        label: 选择框\n        name: select\n        required: true\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-select label=\"选择框\" name=\"select\" required id=\"brick-2\"></eo-select>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n"
   },
-  "eo-checkbox": {
-    "doc": "表单复选框构件。\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"brick-1\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n## Examples\n\n### Label\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    label: city\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n      - Tianjin\n      - Hanzhou\n      - Xi'an\n      - Fuzhou\n      - Nanchan\n      - Changsha\n      - Shenyang\n      - Jinan\n      - Guiyang\n      - Wuhan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox label=\"city\" id=\"brick-1\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     \"Beijing\",\n#     \"Shanghai\",\n#     \"Guangzhou\",\n#     \"Shenzhen\",\n#     \"Tianjin\",\n#     \"Hanzhou\",\n#     \"Xi'an\",\n#     \"Fuzhou\",\n#     \"Nanchan\",\n#     \"Changsha\",\n#     \"Shenyang\",\n#     \"Jinan\",\n#     \"Guiyang\",\n#     \"Wuhan\",\n#   ];\n# </script>\n# \n```\n\n### Value\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    value:\n      - Beijing\n      - Guangzhou\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"brick-1\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.value = [\"Beijing\", \"Guangzhou\"];\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n### Options\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n    value:\n      - Guangzhou\n- brick: eo-checkbox\n  properties:\n    options:\n      - label: Beijing\n        value: 0\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n    value:\n      - 2\n      - 3\n- brick: eo-checkbox\n  properties:\n    options:\n      - true\n      - false\n    value:\n      - true\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"brick-1\"></eo-checkbox>\n# <eo-checkbox id=\"brick-2\"></eo-checkbox>\n# <eo-checkbox id=\"brick-3\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n#   brick_1.value = [\"Guangzhou\"];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n#   brick_2.value = [2, 3];\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.options = [true, false];\n#   brick_3.value = [true];\n# </script>\n# \n```\n\n### Disabled\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    options:\n      - label: Beijing\n        value: 0\n        disabled: true\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n    value:\n      - 0\n      - 2\n- brick: div\n  properties:\n    style:\n      height: 20px\n- brick: eo-checkbox\n  properties:\n    disabled: true\n    value:\n      - 1\n    options:\n      - label: Beijing\n        value: 0\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"brick-1\"></eo-checkbox>\n# <div style=\"height: 20px\"></div>\n# <eo-checkbox disabled id=\"brick-2\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#       disabled: true,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n#   brick_1.value = [0, 2];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.value = [1];\n#   brick_2.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n# </script>\n# \n```\n\n### Type\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    label: Default\n    type: default\n    options:\n      - label: Python\n        value: 0\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: python\n      - label: Javascript\n        value: 1\n        icon:\n          lib: easyops\n          category: program-language\n          icon: javascript\n      - label: Powershell\n        value: 2\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: powershell\n      - label: Shell\n        value: 3\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: shell\n- brick: div\n  properties:\n    style:\n      height: 20px\n- brick: eo-checkbox\n  properties:\n    label: Icon\n    type: icon\n    options:\n      - label: Python\n        value: 0\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: python\n      - label: Javascript\n        value: 1\n        icon:\n          lib: easyops\n          category: program-language\n          icon: javascript\n      - label: Powershell\n        value: 2\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: powershell\n      - label: Shell\n        value: 3\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: shell\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox label=\"Default\" type=\"default\" id=\"brick-1\"></eo-checkbox>\n# <div style=\"height: 20px\"></div>\n# <eo-checkbox label=\"Icon\" type=\"icon\" id=\"brick-2\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"Python\",\n#       value: 0,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"python\",\n#       },\n#     },\n#     {\n#       label: \"Javascript\",\n#       value: 1,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"program-language\",\n#         icon: \"javascript\",\n#       },\n#     },\n#     {\n#       label: \"Powershell\",\n#       value: 2,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"powershell\",\n#       },\n#     },\n#     {\n#       label: \"Shell\",\n#       value: 3,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"shell\",\n#       },\n#     },\n#   ];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\n#     {\n#       label: \"Python\",\n#       value: 0,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"python\",\n#       },\n#     },\n#     {\n#       label: \"Javascript\",\n#       value: 1,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"program-language\",\n#         icon: \"javascript\",\n#       },\n#     },\n#     {\n#       label: \"Powershell\",\n#       value: 2,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"powershell\",\n#       },\n#     },\n#     {\n#       label: \"Shell\",\n#       value: 3,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"shell\",\n#       },\n#     },\n#   ];\n# </script>\n# \n```\n\n### checkboxColor\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    options:\n      - label: Beijing\n        value: 0\n        checkboxColor: red\n      - label: Shanghai\n        value: 1\n        checkboxColor: orange\n      - label: Guangzhou\n        value: 2\n        checkboxColor: blue\n      - label: Shenzhen\n        value: 3\n        checkboxColor: green\n    value:\n      - 2\n      - 1\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"brick-1\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#       checkboxColor: \"red\",\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#       checkboxColor: \"orange\",\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#       checkboxColor: \"blue\",\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#       checkboxColor: \"green\",\n#     },\n#   ];\n#   brick_1.value = [2, 1];\n# </script>\n# \n```\n\n### optionGroups\n\n```yaml preview\n- brick: eo-checkbox\n  events:\n    change:\n      action: console.log\n  properties:\n    isGroup: true\n    label: 商品\n    name: goods\n    optionGroups:\n      - key: fruits\n        name: 水果\n        options:\n          - label: 苹果\n            value: apple\n          - label: 香蕉\n            value: banana\n      - key: vegetables\n        name: 蔬菜\n        options:\n          - label: 土豆\n            value: potato\n    value:\n      - banana\n      - potato\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox is-group label=\"商品\" name=\"goods\" id=\"brick-1\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.optionGroups = [\n#     {\n#       key: \"fruits\",\n#       name: \"水果\",\n#       options: [\n#         {\n#           label: \"苹果\",\n#           value: \"apple\",\n#         },\n#         {\n#           label: \"香蕉\",\n#           value: \"banana\",\n#         },\n#       ],\n#     },\n#     {\n#       key: \"vegetables\",\n#       name: \"蔬菜\",\n#       options: [\n#         {\n#           label: \"土豆\",\n#           value: \"potato\",\n#         },\n#       ],\n#     },\n#   ];\n#   brick_1.value = [\"banana\", \"potato\"];\n#   brick_1.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Event\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    id: option-checkbox\n    options:\n      - label: Beijing\n        value: 0\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n  events:\n    change:\n      - action: message.success\n        args:\n          - <% JSON.stringify(EVENT.detail) %>\n    options.change:\n      - action: message.success\n        args:\n          - <% JSON.stringify(EVENT.detail) %>\n- brick: eo-button\n  properties:\n    textContent: Click to Change Radio Option\n  events:\n    click:\n      - target: \"#option-checkbox\"\n        properties:\n          options:\n            - label: Beijing\n              value: 0\n            - label: Shanghai\n              value: 1\n              icon:\n                icon: \"bar-chart\"\n                lib: \"antd\"\n            - label: Guangzhou\n              value: 2\n            - label: Shenzhen\n              value: 3\n            - label: Hangzhou\n              value: 4\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"option-checkbox\"></eo-checkbox>\n# <eo-button id=\"brick-1\">Click to Change Radio Option</eo-button>\n# \n# <script>\n#   const option_checkbox = document.getElementById(\"option-checkbox\");\n#   option_checkbox.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n#   option_checkbox.addEventListener(\"change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"success\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message: \"<% JSON.stringify(EVENT.detail) %>\",\n#     });\n#   });\n#   option_checkbox.addEventListener(\"options.change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"success\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message: \"<% JSON.stringify(EVENT.detail) %>\",\n#     });\n#   });\n# \n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#option-checkbox\");\n#     brick.options = [\n#       {\n#         label: \"Beijing\",\n#         value: 0,\n#       },\n#       {\n#         label: \"Shanghai\",\n#         value: 1,\n#         icon: {\n#           icon: \"bar-chart\",\n#           lib: \"antd\",\n#         },\n#       },\n#       {\n#         label: \"Guangzhou\",\n#         value: 2,\n#       },\n#       {\n#         label: \"Shenzhen\",\n#         value: 3,\n#       },\n#       {\n#         label: \"Hangzhou\",\n#         value: 4,\n#       },\n#     ];\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-checkbox\n      properties:\n        name: city\n        label: 城市\n        required: true\n        options:\n          - Beijing\n          - Shanghai\n          - Guangzhou\n          - Shenzhen\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-checkbox name=\"city\" label=\"城市\" required id=\"brick-2\"></eo-checkbox>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n"
+  "eo-form": {
+    "doc": "表单构件。\n\n## Examples\n\n### Layout\n\n```yaml preview\n- brick: eo-form\n  properties:\n    layout: inline\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            label: input\n        - brick: eo-select\n          properties:\n            label: select\n- brick: div\n  properties:\n    style:\n      height: 1px\n      background: \"#abc\"\n      margin: \"20px 0\"\n- brick: eo-form\n  properties:\n    layout: horizontal\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            label: input\n        - brick: eo-select\n          properties:\n            label: select\n- brick: div\n  properties:\n    style:\n      height: 1px\n      background: \"#abc\"\n      margin: \"20px 0\"\n- brick: eo-form\n  properties:\n    layout: vertical\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            label: input\n        - brick: eo-select\n          properties:\n            label: select\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form layout=\"inline\">\n#   <eo-input label=\"input\"></eo-input>\n#   <eo-select label=\"select\"></eo-select>\n# </eo-form>\n# <div style=\"height: 1px; background: #abc; margin: 20px 0\"></div>\n# <eo-form layout=\"horizontal\">\n#   <eo-input label=\"input\"></eo-input>\n#   <eo-select label=\"select\"></eo-select>\n# </eo-form>\n# <div style=\"height: 1px; background: #abc; margin: 20px 0\"></div>\n# <eo-form layout=\"vertical\">\n#   <eo-input label=\"input\"></eo-input>\n#   <eo-select label=\"select\"></eo-select>\n# </eo-form>\n# \n```\n\n### Values\n\n```yaml preview\n- brick: eo-form\n  properties:\n    values:\n      input: This is default value\n      select: Beijing\n      radio: Guangzhou\n      checkbox:\n        - C\n        - D\n      textarea: \"Hello World! \\nNice to see you!\"\n      dynamicForm:\n        - input: beijing\n          select: Guangzhou\n        - input: shenzhen\n          select: Shenzhen\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            label: input\n            name: input\n        - brick: eo-select\n          properties:\n            label: select\n            name: select\n            options:\n              - Beijing\n              - Shanghai\n        - brick: eo-radio\n          properties:\n            label: radio\n            name: radio\n            options:\n              - Guangzhou\n              - Shenzhen\n        - brick: eo-checkbox\n          properties:\n            name: checkbox\n            label: checkbox\n            options:\n              - A\n              - B\n              - C\n              - D\n        - brick: eo-textarea\n          properties:\n            name: textarea\n            label: textarea\n            autoSize:\n              minRows: 3\n        - brick: eo-dynamic-form-item\n          properties:\n            label: dynamic-form\n            name: dynamicForm\n            useBrick:\n              - brick: eo-input\n                properties:\n                  name: input\n              - brick: eo-select\n                properties:\n                  name: select\n                  options:\n                    - Beijing\n                    - Shanghai\n                    - Guangzhou\n                    - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form values=\"[object Object]\">\n#   <eo-input label=\"input\" name=\"input\"></eo-input>\n#   <eo-select label=\"select\" name=\"select\" id=\"brick-1\"></eo-select>\n#   <eo-radio label=\"radio\" name=\"radio\" id=\"brick-2\"></eo-radio>\n#   <eo-checkbox name=\"checkbox\" label=\"checkbox\" id=\"brick-3\"></eo-checkbox>\n#   <eo-textarea name=\"textarea\" label=\"textarea\" id=\"brick-4\"></eo-textarea>\n#   <eo-dynamic-form-item\n#     label=\"dynamic-form\"\n#     name=\"dynamicForm\"\n#     id=\"brick-5\"\n#   ></eo-dynamic-form-item>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\"];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\"Guangzhou\", \"Shenzhen\"];\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.options = [\"A\", \"B\", \"C\", \"D\"];\n# \n#   const brick_4 = document.getElementById(\"brick-4\");\n#   brick_4.autoSize = {\n#     minRows: 3,\n#   };\n# \n#   const brick_5 = document.getElementById(\"brick-5\");\n#   brick_5.useBrick = [\n#     {\n#       brick: \"eo-input\",\n#       properties: {\n#         name: \"input\",\n#       },\n#     },\n#     {\n#       brick: \"eo-select\",\n#       properties: {\n#         name: \"select\",\n#         options: [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"],\n#       },\n#     },\n#   ];\n# </script>\n# \n```\n\n### Events\n\n```yaml preview\n- brick: eo-form\n  events:\n    values.change:\n      - action: console.log\n    validate.success:\n      - action: message.success\n        args:\n          - 表单提交成功\n    validate.error:\n      - action: message.error\n        args:\n          - 表单校验失败\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            required: true\n            name: name\n            label: 姓名\n            max: 6\n            min: 2\n            message:\n              required: 一定要填写姓名哟\n              max: 不能超过 6 个字符哟\n              min: 最少填写 2 个字符哟\n        - brick: eo-select\n          properties:\n            required: true\n            name: sex\n            label: 性别\n            options:\n              - label: 男\n                value: 0\n              - label: 女\n                value: 1\n        - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-input\n#     required\n#     name=\"name\"\n#     label=\"姓名\"\n#     max=\"6\"\n#     min=\"2\"\n#     id=\"brick-2\"\n#   ></eo-input>\n#   <eo-select required name=\"sex\" label=\"性别\" id=\"brick-3\"></eo-select>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"success\", message: \"表单提交成功\" });\n#   });\n#   brick_1.addEventListener(\"validate.error\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"error\", message: \"表单校验失败\" });\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.message = {\n#     required: \"一定要填写姓名哟\",\n#     max: \"不能超过 6 个字符哟\",\n#     min: \"最少填写 2 个字符哟\",\n#   };\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.options = [\n#     {\n#       label: \"男\",\n#       value: 0,\n#     },\n#     {\n#       label: \"女\",\n#       value: 1,\n#     },\n#   ];\n# </script>\n# \n```\n\n### Method\n\n```yaml preview\n- brick: eo-form\n  properties:\n    id: form\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-input\n          properties:\n            required: true\n            name: name\n            label: 姓名\n            max: 6\n            min: 2\n        - brick: eo-select\n          properties:\n            required: true\n            name: sex\n            label: 性别\n            options:\n              - label: 男\n                value: 0\n              - label: 女\n                value: 1\n- brick: eo-button\n  properties:\n    textContent: validateFields\n  events:\n    click:\n      - target: \"#form\"\n        method: validate\n- brick: eo-button\n  properties:\n    textContent: setInitValue\n  events:\n    click:\n      - target: \"#form\"\n        method: setInitValue\n        args:\n          - name: Mike\n            sex: 0\n- brick: eo-button\n  properties:\n    textContent: resetFields\n  events:\n    click:\n      - target: \"#form\"\n        method: resetFields\n- brick: eo-button\n  properties:\n    textContent: resetFields(name)\n  events:\n    click:\n      - target: \"#form\"\n        method: resetFields\n        args:\n          - name\n- brick: eo-button\n  properties:\n    textContent: getFieldsValue\n  events:\n    click:\n      - target: \"#form\"\n        method: getFieldsValue\n        callback:\n          success:\n            - action: console.log\n- brick: eo-button\n  properties:\n    textContent: getFieldsValue(name)\n  events:\n    click:\n      - target: \"#form\"\n        method: getFieldsValue\n        args:\n          - name\n        callback:\n          success:\n            - action: console.log\n- brick: eo-button\n  properties:\n    textContent: validateField(name)\n  events:\n    click:\n      - target: \"#form\"\n        method: validateField\n        args:\n          - name\n- brick: eo-button\n  properties:\n    textContent: resetValidateState\n  events:\n    click:\n      - target: \"#form\"\n        method: resetValidateState\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"form\">\n#   <eo-input required name=\"name\" label=\"姓名\" max=\"6\" min=\"2\"></eo-input>\n#   <eo-select required name=\"sex\" label=\"性别\" id=\"brick-1\"></eo-select>\n# </eo-form>\n# <eo-button id=\"brick-2\">validateFields</eo-button>\n# <eo-button id=\"brick-3\">setInitValue</eo-button>\n# <eo-button id=\"brick-4\">resetFields</eo-button>\n# <eo-button id=\"brick-5\">resetFields(name)</eo-button>\n# <eo-button id=\"brick-6\">getFieldsValue</eo-button>\n# <eo-button id=\"brick-7\">getFieldsValue(name)</eo-button>\n# <eo-button id=\"brick-8\">validateField(name)</eo-button>\n# <eo-button id=\"brick-9\">resetValidateState</eo-button>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"男\",\n#       value: 0,\n#     },\n#     {\n#       label: \"女\",\n#       value: 1,\n#     },\n#   ];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.validate();\n#   });\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.setInitValue({ name: \"Mike\", sex: 0 });\n#   });\n# \n#   const brick_4 = document.getElementById(\"brick-4\");\n#   brick_4.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.resetFields();\n#   });\n# \n#   const brick_5 = document.getElementById(\"brick-5\");\n#   brick_5.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.resetFields(\"name\");\n#   });\n# \n#   const brick_6 = document.getElementById(\"brick-6\");\n#   brick_6.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.getFieldsValue();\n#   });\n# \n#   const brick_7 = document.getElementById(\"brick-7\");\n#   brick_7.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.getFieldsValue(\"name\");\n#   });\n# \n#   const brick_8 = document.getElementById(\"brick-8\");\n#   brick_8.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.validateField(\"name\");\n#   });\n# \n#   const brick_9 = document.getElementById(\"brick-9\");\n#   brick_9.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#form\");\n#     brick.resetValidateState();\n#   });\n# </script>\n# \n```\n\n### Theme variant Elevo\n\n```yaml preview\n# Use this container to emulate background\nbrick: ai-portal.home-container\nproperties:\n  style:\n    padding: 2em\n    backgroundColor: \"#d8d8d8\"\nchildren:\n  - brick: eo-form\n    properties:\n      themeVariant: elevo\n      layout: vertical\n      values:\n        city: 深圳\n        public: true\n        tags:\n          - 活泼\n    events:\n      validate.success:\n        useProvider: basic.show-dialog\n        args:\n          - title: 提交表单\n            type: confirm\n            content: 确定提交吗？\n            themeVariant: elevo\n    children:\n      - brick: eo-input\n        properties:\n          label: 名称\n          name: name\n          themeVariant: elevo\n          placeholder: 请输入\n      - brick: eo-textarea\n        properties:\n          label: 说明\n          name: desc\n          themeVariant: elevo\n          placeholder: 请输入\n      - brick: eo-select\n        properties:\n          label: 类型\n          name: type\n          themeVariant: elevo\n          placeholder: 请选择\n          options:\n            - 默认\n            - 其他\n      - brick: eo-radio\n        properties:\n          label: 城市\n          name: city\n          type: button\n          themeVariant: elevo\n          options:\n            - 北京\n            - 上海\n            - 深圳\n      - brick: eo-checkbox\n        properties:\n          label: 标签\n          name: tags\n          themeVariant: elevo\n          options:\n            - 活泼\n            - 开朗\n            - 好动\n      - brick: eo-switch\n        properties:\n          label: 公开\n          name: public\n          themeVariant: elevo\n      - brick: eo-submit-buttons\n        properties:\n          themeVariant: elevo\n          submitText: 提交\n          cancelText: 取消\n          submitType: primary\n          cancelType: default\n# -- YAML DELIMITER (1nbbm8) --\n# <ai-portal.home-container style=\"padding: 2em; background-color: #d8d8d8\">\n#   <eo-form\n#     theme-variant=\"elevo\"\n#     layout=\"vertical\"\n#     values=\"[object Object]\"\n#     id=\"brick-1\"\n#   >\n#     <eo-input\n#       label=\"名称\"\n#       name=\"name\"\n#       theme-variant=\"elevo\"\n#       placeholder=\"请输入\"\n#     ></eo-input>\n#     <eo-textarea\n#       label=\"说明\"\n#       name=\"desc\"\n#       theme-variant=\"elevo\"\n#       placeholder=\"请输入\"\n#     ></eo-textarea>\n#     <eo-select\n#       label=\"类型\"\n#       name=\"type\"\n#       theme-variant=\"elevo\"\n#       placeholder=\"请选择\"\n#       id=\"brick-2\"\n#     ></eo-select>\n#     <eo-radio\n#       label=\"城市\"\n#       name=\"city\"\n#       type=\"button\"\n#       theme-variant=\"elevo\"\n#       id=\"brick-3\"\n#     ></eo-radio>\n#     <eo-checkbox\n#       label=\"标签\"\n#       name=\"tags\"\n#       theme-variant=\"elevo\"\n#       id=\"brick-4\"\n#     ></eo-checkbox>\n#     <eo-switch label=\"公开\" name=\"public\" theme-variant=\"elevo\"></eo-switch>\n#     <eo-submit-buttons\n#       theme-variant=\"elevo\"\n#       submit-text=\"提交\"\n#       cancel-text=\"取消\"\n#       submit-type=\"primary\"\n#       cancel-type=\"default\"\n#     ></eo-submit-buttons>\n#   </eo-form>\n# </ai-portal.home-container>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     const provider = document.createElement(\"basic.show-dialog\");\n#     provider.resolve({\n#       title: \"提交表单\",\n#       type: \"confirm\",\n#       content: \"确定提交吗？\",\n#       themeVariant: \"elevo\",\n#     });\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\"默认\", \"其他\"];\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.options = [\"北京\", \"上海\", \"深圳\"];\n# \n#   const brick_4 = document.getElementById(\"brick-4\");\n#   brick_4.options = [\"活泼\", \"开朗\", \"好动\"];\n# </script>\n# \n```\n"
   },
   "eo-submit-buttons": {
     "doc": "表单提交按钮。\n(tips: 通常在于 eo-form 构件搭配使用)\n\n```yaml preview\n- brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-submit-buttons></eo-submit-buttons>\n# \n```\n\n## Examples\n\n### Basic\n\n```yaml preview\n- brick: eo-submit-buttons\n  properties:\n    submitText: Submit\n    cancelText: Cancel\n  events:\n    submit:\n      - action: message.success\n        args:\n          - Submit\n    cancel:\n      - action: message.warn\n        args:\n          - Cancel\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-submit-buttons\n#   submit-text=\"Submit\"\n#   cancel-text=\"Cancel\"\n#   id=\"brick-1\"\n# ></eo-submit-buttons>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"submit\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"success\", message: \"Submit\" });\n#   });\n#   brick_1.addEventListener(\"cancel\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"warn\", message: \"Cancel\" });\n#   });\n# </script>\n# \n```\n\n### Button types\n\n```yaml preview\n- brick: eo-submit-buttons\n  properties:\n    submitText: Submit\n    cancelText: Cancel\n    submitType: primary\n    cancelType: default\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-submit-buttons\n#   submit-text=\"Submit\"\n#   cancel-text=\"Cancel\"\n#   submit-type=\"primary\"\n#   cancel-type=\"default\"\n# ></eo-submit-buttons>\n# \n```\n\n### Disable submit button\n\n```yaml preview\n- brick: eo-submit-buttons\n  properties:\n    submitText: Submit\n    cancelText: Cancel\n    submitDisabled: true\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-submit-buttons\n#   submit-text=\"Submit\"\n#   cancel-text=\"Cancel\"\n#   submit-disabled\n# ></eo-submit-buttons>\n# \n```\n"
   },
+  "eo-checkbox": {
+    "doc": "表单复选框构件。\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"brick-1\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n## Examples\n\n### Label\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    label: city\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n      - Tianjin\n      - Hanzhou\n      - Xi'an\n      - Fuzhou\n      - Nanchan\n      - Changsha\n      - Shenyang\n      - Jinan\n      - Guiyang\n      - Wuhan\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox label=\"city\" id=\"brick-1\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     \"Beijing\",\n#     \"Shanghai\",\n#     \"Guangzhou\",\n#     \"Shenzhen\",\n#     \"Tianjin\",\n#     \"Hanzhou\",\n#     \"Xi'an\",\n#     \"Fuzhou\",\n#     \"Nanchan\",\n#     \"Changsha\",\n#     \"Shenyang\",\n#     \"Jinan\",\n#     \"Guiyang\",\n#     \"Wuhan\",\n#   ];\n# </script>\n# \n```\n\n### Value\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    value:\n      - Beijing\n      - Guangzhou\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"brick-1\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.value = [\"Beijing\", \"Guangzhou\"];\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n### Options\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n    value:\n      - Guangzhou\n- brick: eo-checkbox\n  properties:\n    options:\n      - label: Beijing\n        value: 0\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n    value:\n      - 2\n      - 3\n- brick: eo-checkbox\n  properties:\n    options:\n      - true\n      - false\n    value:\n      - true\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"brick-1\"></eo-checkbox>\n# <eo-checkbox id=\"brick-2\"></eo-checkbox>\n# <eo-checkbox id=\"brick-3\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n#   brick_1.value = [\"Guangzhou\"];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n#   brick_2.value = [2, 3];\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.options = [true, false];\n#   brick_3.value = [true];\n# </script>\n# \n```\n\n### Disabled\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    options:\n      - label: Beijing\n        value: 0\n        disabled: true\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n    value:\n      - 0\n      - 2\n- brick: div\n  properties:\n    style:\n      height: 20px\n- brick: eo-checkbox\n  properties:\n    disabled: true\n    value:\n      - 1\n    options:\n      - label: Beijing\n        value: 0\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"brick-1\"></eo-checkbox>\n# <div style=\"height: 20px\"></div>\n# <eo-checkbox disabled id=\"brick-2\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#       disabled: true,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n#   brick_1.value = [0, 2];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.value = [1];\n#   brick_2.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n# </script>\n# \n```\n\n### Type\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    label: Default\n    type: default\n    options:\n      - label: Python\n        value: 0\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: python\n      - label: Javascript\n        value: 1\n        icon:\n          lib: easyops\n          category: program-language\n          icon: javascript\n      - label: Powershell\n        value: 2\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: powershell\n      - label: Shell\n        value: 3\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: shell\n- brick: div\n  properties:\n    style:\n      height: 20px\n- brick: eo-checkbox\n  properties:\n    label: Icon\n    type: icon\n    options:\n      - label: Python\n        value: 0\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: python\n      - label: Javascript\n        value: 1\n        icon:\n          lib: easyops\n          category: program-language\n          icon: javascript\n      - label: Powershell\n        value: 2\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: powershell\n      - label: Shell\n        value: 3\n        icon:\n          lib: easyops\n          category: colored-common\n          icon: shell\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox label=\"Default\" type=\"default\" id=\"brick-1\"></eo-checkbox>\n# <div style=\"height: 20px\"></div>\n# <eo-checkbox label=\"Icon\" type=\"icon\" id=\"brick-2\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"Python\",\n#       value: 0,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"python\",\n#       },\n#     },\n#     {\n#       label: \"Javascript\",\n#       value: 1,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"program-language\",\n#         icon: \"javascript\",\n#       },\n#     },\n#     {\n#       label: \"Powershell\",\n#       value: 2,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"powershell\",\n#       },\n#     },\n#     {\n#       label: \"Shell\",\n#       value: 3,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"shell\",\n#       },\n#     },\n#   ];\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\n#     {\n#       label: \"Python\",\n#       value: 0,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"python\",\n#       },\n#     },\n#     {\n#       label: \"Javascript\",\n#       value: 1,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"program-language\",\n#         icon: \"javascript\",\n#       },\n#     },\n#     {\n#       label: \"Powershell\",\n#       value: 2,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"powershell\",\n#       },\n#     },\n#     {\n#       label: \"Shell\",\n#       value: 3,\n#       icon: {\n#         lib: \"easyops\",\n#         category: \"colored-common\",\n#         icon: \"shell\",\n#       },\n#     },\n#   ];\n# </script>\n# \n```\n\n### checkboxColor\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    options:\n      - label: Beijing\n        value: 0\n        checkboxColor: red\n      - label: Shanghai\n        value: 1\n        checkboxColor: orange\n      - label: Guangzhou\n        value: 2\n        checkboxColor: blue\n      - label: Shenzhen\n        value: 3\n        checkboxColor: green\n    value:\n      - 2\n      - 1\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"brick-1\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#       checkboxColor: \"red\",\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#       checkboxColor: \"orange\",\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#       checkboxColor: \"blue\",\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#       checkboxColor: \"green\",\n#     },\n#   ];\n#   brick_1.value = [2, 1];\n# </script>\n# \n```\n\n### optionGroups\n\n```yaml preview\n- brick: eo-checkbox\n  events:\n    change:\n      action: console.log\n  properties:\n    isGroup: true\n    label: 商品\n    name: goods\n    optionGroups:\n      - key: fruits\n        name: 水果\n        options:\n          - label: 苹果\n            value: apple\n          - label: 香蕉\n            value: banana\n      - key: vegetables\n        name: 蔬菜\n        options:\n          - label: 土豆\n            value: potato\n    value:\n      - banana\n      - potato\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox is-group label=\"商品\" name=\"goods\" id=\"brick-1\"></eo-checkbox>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.optionGroups = [\n#     {\n#       key: \"fruits\",\n#       name: \"水果\",\n#       options: [\n#         {\n#           label: \"苹果\",\n#           value: \"apple\",\n#         },\n#         {\n#           label: \"香蕉\",\n#           value: \"banana\",\n#         },\n#       ],\n#     },\n#     {\n#       key: \"vegetables\",\n#       name: \"蔬菜\",\n#       options: [\n#         {\n#           label: \"土豆\",\n#           value: \"potato\",\n#         },\n#       ],\n#     },\n#   ];\n#   brick_1.value = [\"banana\", \"potato\"];\n#   brick_1.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Event\n\n```yaml preview\n- brick: eo-checkbox\n  properties:\n    id: option-checkbox\n    options:\n      - label: Beijing\n        value: 0\n      - label: Shanghai\n        value: 1\n      - label: Guangzhou\n        value: 2\n      - label: Shenzhen\n        value: 3\n  events:\n    change:\n      - action: message.success\n        args:\n          - <% JSON.stringify(EVENT.detail) %>\n    options.change:\n      - action: message.success\n        args:\n          - <% JSON.stringify(EVENT.detail) %>\n- brick: eo-button\n  properties:\n    textContent: Click to Change Radio Option\n  events:\n    click:\n      - target: \"#option-checkbox\"\n        properties:\n          options:\n            - label: Beijing\n              value: 0\n            - label: Shanghai\n              value: 1\n              icon:\n                icon: \"bar-chart\"\n                lib: \"antd\"\n            - label: Guangzhou\n              value: 2\n            - label: Shenzhen\n              value: 3\n            - label: Hangzhou\n              value: 4\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-checkbox id=\"option-checkbox\"></eo-checkbox>\n# <eo-button id=\"brick-1\">Click to Change Radio Option</eo-button>\n# \n# <script>\n#   const option_checkbox = document.getElementById(\"option-checkbox\");\n#   option_checkbox.options = [\n#     {\n#       label: \"Beijing\",\n#       value: 0,\n#     },\n#     {\n#       label: \"Shanghai\",\n#       value: 1,\n#     },\n#     {\n#       label: \"Guangzhou\",\n#       value: 2,\n#     },\n#     {\n#       label: \"Shenzhen\",\n#       value: 3,\n#     },\n#   ];\n#   option_checkbox.addEventListener(\"change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"success\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message: \"<% JSON.stringify(EVENT.detail) %>\",\n#     });\n#   });\n#   option_checkbox.addEventListener(\"options.change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"success\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message: \"<% JSON.stringify(EVENT.detail) %>\",\n#     });\n#   });\n# \n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"click\", (e) => {\n#     const brick = document.querySelector(\"#option-checkbox\");\n#     brick.options = [\n#       {\n#         label: \"Beijing\",\n#         value: 0,\n#       },\n#       {\n#         label: \"Shanghai\",\n#         value: 1,\n#         icon: {\n#           icon: \"bar-chart\",\n#           lib: \"antd\",\n#         },\n#       },\n#       {\n#         label: \"Guangzhou\",\n#         value: 2,\n#       },\n#       {\n#         label: \"Shenzhen\",\n#         value: 3,\n#       },\n#       {\n#         label: \"Hangzhou\",\n#         value: 4,\n#       },\n#     ];\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-checkbox\n      properties:\n        name: city\n        label: 城市\n        required: true\n        options:\n          - Beijing\n          - Shanghai\n          - Guangzhou\n          - Shenzhen\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-checkbox name=\"city\" label=\"城市\" required id=\"brick-2\"></eo-checkbox>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n"
+  },
   "eo-dynamic-form-item": {
     "doc": "动态表单构件。\n\n```yaml preview\n- brick: eo-form\n  properties:\n    layout: vertical\n    values:\n      id: request_5XXX\n      dimension:\n        - dimensionName: one\n          dimensionId: one\n          dimensionValue: 1\n  children:\n    - brick: eo-input\n      properties:\n        name: id\n        label: 指标ID\n        required: true\n    - brick: eo-dynamic-form-item\n      properties:\n        name: dimension\n        label: 维度\n        useBrick:\n          - brick: eo-input\n            properties:\n              name: dimensionName\n              required: true\n              message:\n                required: 维度名称为必填项\n              label: 维度名称\n          - brick: eo-input\n            properties:\n              name: dimensionId\n              required: true\n              message:\n                required: 维度id为必填项\n              label: 维度id\n              unique: true\n              validator: '<% (value) => (value.length > 5 ? \"维度id不能超过5\" : \"\") %>'\n          - brick: eo-input\n            properties:\n              name: dimensionValue\n              label: 维度值\n    - brick: eo-submit-buttons\n      properties:\n        cancelText: 取消\n        submitText: 提交\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form layout=\"vertical\" values=\"[object Object]\">\n#   <eo-input name=\"id\" label=\"指标ID\" required></eo-input>\n#   <eo-dynamic-form-item\n#     name=\"dimension\"\n#     label=\"维度\"\n#     id=\"brick-1\"\n#   ></eo-dynamic-form-item>\n#   <eo-submit-buttons cancel-text=\"取消\" submit-text=\"提交\"></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.useBrick = [\n#     {\n#       brick: \"eo-input\",\n#       properties: {\n#         name: \"dimensionName\",\n#         required: true,\n#         message: {\n#           required: \"维度名称为必填项\",\n#         },\n#         label: \"维度名称\",\n#       },\n#     },\n#     {\n#       brick: \"eo-input\",\n#       properties: {\n#         name: \"dimensionId\",\n#         required: true,\n#         message: {\n#           required: \"维度id为必填项\",\n#         },\n#         label: \"维度id\",\n#         unique: true,\n#         validator:\n#           '<% (value) => (value.length > 5 ? \"维度id不能超过5\" : \"\") %>',\n#       },\n#     },\n#     {\n#       brick: \"eo-input\",\n#       properties: {\n#         name: \"dimensionValue\",\n#         label: \"维度值\",\n#       },\n#     },\n#   ];\n# </script>\n# \n```\n\n## Examples\n\n### Label\n\n```yaml preview\n- brick: eo-dynamic-form-item\n  properties:\n    label: Label\n    useBrick:\n      - brick: eo-input\n        properties:\n          name: input\n      - brick: eo-select\n        properties:\n          name: select\n          options:\n            - Beijing\n            - Shanghai\n            - Guangzhou\n            - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-dynamic-form-item label=\"Label\" id=\"brick-1\"></eo-dynamic-form-item>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.useBrick = [\n#     {\n#       brick: \"eo-input\",\n#       properties: {\n#         name: \"input\",\n#       },\n#     },\n#     {\n#       brick: \"eo-select\",\n#       properties: {\n#         name: \"select\",\n#         options: [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"],\n#       },\n#     },\n#   ];\n# </script>\n# \n```\n\n### Value\n\n```yaml preview\n- brick: eo-dynamic-form-item\n  properties:\n    value:\n      - input: 北京\n        select: Beijing\n      - input: 上海\n        select: Shanghai\n    useBrick:\n      - brick: eo-input\n        properties:\n          name: input\n      - brick: eo-select\n        properties:\n          name: select\n          options:\n            - Beijing\n            - Shanghai\n            - Guangzhou\n            - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-dynamic-form-item id=\"brick-1\"></eo-dynamic-form-item>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.value = [\n#     {\n#       input: \"北京\",\n#       select: \"Beijing\",\n#     },\n#     {\n#       input: \"上海\",\n#       select: \"Shanghai\",\n#     },\n#   ];\n#   brick_1.useBrick = [\n#     {\n#       brick: \"eo-input\",\n#       properties: {\n#         name: \"input\",\n#       },\n#     },\n#     {\n#       brick: \"eo-select\",\n#       properties: {\n#         name: \"select\",\n#         options: [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"],\n#       },\n#     },\n#   ];\n# </script>\n# \n```\n\n### Hide or disable buttons\n\n```yaml preview\n- brick: eo-dynamic-form-item\n  properties:\n    hideAddButton: <% (value)=>value.length===5 %>\n    disabledAddButton: <% (value)=>value.length===4 %>\n    hideRemoveButton: <% (value,row)=>row===1 %>\n    disabledRemoveButton: <% (value,row)=>row===0 %>\n    value:\n      - input: hello1\n        select: abc1\n      - input: hello2\n        select: abc2\n      - input: hello3\n        select: abc3\n    useBrick:\n      - brick: eo-input\n        properties:\n          name: input\n      - brick: eo-select\n        properties:\n          name: select\n          options:\n            - abc1\n            - abc2\n            - abc3\n            - abc4\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-dynamic-form-item id=\"brick-1\"></eo-dynamic-form-item>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.hideAddButton = \"<% (value)=>value.length===5 %>\";\n#   brick_1.disabledAddButton = \"<% (value)=>value.length===4 %>\";\n#   brick_1.hideRemoveButton = \"<% (value,row)=>row===1 %>\";\n#   brick_1.disabledRemoveButton = \"<% (value,row)=>row===0 %>\";\n#   brick_1.value = [\n#     {\n#       input: \"hello1\",\n#       select: \"abc1\",\n#     },\n#     {\n#       input: \"hello2\",\n#       select: \"abc2\",\n#     },\n#     {\n#       input: \"hello3\",\n#       select: \"abc3\",\n#     },\n#   ];\n#   brick_1.useBrick = [\n#     {\n#       brick: \"eo-input\",\n#       properties: {\n#         name: \"input\",\n#       },\n#     },\n#     {\n#       brick: \"eo-select\",\n#       properties: {\n#         name: \"select\",\n#         options: [\"abc1\", \"abc2\", \"abc3\", \"abc4\"],\n#       },\n#     },\n#   ];\n# </script>\n# \n```\n\n### Event\n\n```yaml preview\n- brick: eo-dynamic-form-item\n  properties:\n    name: dynamicForm\n    useBrick:\n      - brick: eo-input\n        properties:\n          name: input\n      - brick: eo-select\n        properties:\n          name: select\n          options:\n            - Beijing\n            - Shanghai\n            - Guangzhou\n            - Shenzhen\n  events:\n    row.remove:\n      action: console.log\n    row.add:\n      action: console.log\n    change:\n      - action: message.success\n        args:\n          - <% JSON.stringify(EVENT.detail) %>\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-dynamic-form-item name=\"dynamicForm\" id=\"brick-1\"></eo-dynamic-form-item>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.useBrick = [\n#     {\n#       brick: \"eo-input\",\n#       properties: {\n#         name: \"input\",\n#       },\n#     },\n#     {\n#       brick: \"eo-select\",\n#       properties: {\n#         name: \"select\",\n#         options: [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"],\n#       },\n#     },\n#   ];\n#   brick_1.addEventListener(\"row.remove\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"row.add\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"change\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({\n#       type: \"success\",\n#       /* WARN: incompatible expressions in HTML, please try YAML: */\n#       message: \"<% JSON.stringify(EVENT.detail) %>\",\n#     });\n#   });\n# </script>\n# \n```\n"
   },
@@ -32,18 +32,18 @@
   "eo-upload-image": {
     "doc": "上传图片构件\n\n## Examples\n\n### Basic\n\n```yaml preview\n- brick: eo-upload-image\n  events:\n    change:\n      action: console.log\n      args:\n        - \"<% EVENT.detail %>\"\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-upload-image id=\"brick-1\"></eo-upload-image>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-upload-image\n      properties:\n        label: 文件\n        name: file\n        required: true\n      events:\n        change:\n          - action: console.log\n            args:\n              - <% EVENT.detail %>\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-upload-image\n#     label=\"文件\"\n#     name=\"file\"\n#     required\n#     id=\"brick-2\"\n#   ></eo-upload-image>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
   },
-  "eo-upload-file": {
-    "doc": "上传文件\n\n## Examples\n\n### Basic\n\n```yaml preview\nbrick: eo-upload-file\nproperties:\n  style:\n    width: 300px\n  uploadDraggable: true\n  maxCount: 2\n  multiple: true\n  accept: image/*\n  draggableUploadTip: 支持上传2张图片\nevents:\n  change:\n    - action: console.log\n      args:\n        - <% EVENT.detail %>\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-upload-file\n#   style=\"width: 300px\"\n#   upload-draggable\n#   max-count=\"2\"\n#   multiple\n#   accept=\"image/*\"\n#   draggable-upload-tip=\"支持上传2张图片\"\n#   id=\"brick-1\"\n# ></eo-upload-file>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-upload-file\n      properties:\n        label: 文件\n        name: file\n        required: true\n        style:\n          width: 300px\n        uploadDraggable: true\n        maxCount: 2\n        multiple: true\n        accept: image/*\n        draggableUploadTip: 支持上传图片\n      events:\n        change:\n          - action: console.log\n            args:\n              - <% EVENT.detail %>\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-upload-file\n#     label=\"文件\"\n#     name=\"file\"\n#     required\n#     style=\"width: 300px\"\n#     upload-draggable\n#     max-count=\"2\"\n#     multiple\n#     accept=\"image/*\"\n#     draggable-upload-tip=\"支持上传图片\"\n#     id=\"brick-2\"\n#   ></eo-upload-file>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
-  },
   "eo-auto-complete": {
     "doc": "构件 `eo-auto-complete`\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=500px\n- brick: eo-auto-complete\n  properties:\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-auto-complete id=\"brick-1\"></eo-auto-complete>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n### caption\n\n```yaml preview\n- brick: eo-auto-complete\n  properties:\n    options:\n      - label: 选项1\n        value: \"1\"\n        caption: 说明1\n      - label: 选项2\n        value: \"2\"\n        caption: 说明2\n      - label: 选项3\n        value: \"3\"\n        caption: 说明3\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-auto-complete id=\"brick-1\"></eo-auto-complete>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"选项1\",\n#       value: \"1\",\n#       caption: \"说明1\",\n#     },\n#     {\n#       label: \"选项2\",\n#       value: \"2\",\n#       caption: \"说明2\",\n#     },\n#     {\n#       label: \"选项3\",\n#       value: \"3\",\n#       caption: \"说明3\",\n#     },\n#   ];\n# </script>\n# \n```\n\n### 分组\n\n```yaml preview\n- brick: eo-auto-complete\n  properties:\n    options:\n      - label: 选项1\n        value: \"1\"\n        caption: 说明1\n      - label: 选项2\n        value: \"2\"\n        caption: 说明2\n      - label: 分组1\n        options:\n          - label: 选项3-1\n            value: 3-1\n            caption: 说明3-1\n          - label: 选项3-1\n            value: 3-2\n            caption: 说明3-2\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-auto-complete id=\"brick-1\"></eo-auto-complete>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"选项1\",\n#       value: \"1\",\n#       caption: \"说明1\",\n#     },\n#     {\n#       label: \"选项2\",\n#       value: \"2\",\n#       caption: \"说明2\",\n#     },\n#     {\n#       label: \"分组1\",\n#       options: [\n#         {\n#           label: \"选项3-1\",\n#           value: \"3-1\",\n#           caption: \"说明3-1\",\n#         },\n#         {\n#           label: \"选项3-1\",\n#           value: \"3-2\",\n#           caption: \"说明3-2\",\n#         },\n#       ],\n#     },\n#   ];\n# </script>\n# \n```\n\n### filterByCaption\n\n```yaml preview\n- brick: eo-auto-complete\n  properties:\n    filterByCaption: true\n    options:\n      - label: 选项1\n        value: \"1\"\n        caption: 说明1\n      - label: 选项2\n        value: \"2\"\n        caption: 说明2\n      - label: 分组1\n        options:\n          - label: 选项3-1\n            value: 3-1\n            caption: 说明3-1\n          - label: 选项3-1\n            value: 3-2\n            caption: 说明3-2\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-auto-complete filter-by-caption id=\"brick-1\"></eo-auto-complete>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"选项1\",\n#       value: \"1\",\n#       caption: \"说明1\",\n#     },\n#     {\n#       label: \"选项2\",\n#       value: \"2\",\n#       caption: \"说明2\",\n#     },\n#     {\n#       label: \"分组1\",\n#       options: [\n#         {\n#           label: \"选项3-1\",\n#           value: \"3-1\",\n#           caption: \"说明3-1\",\n#         },\n#         {\n#           label: \"选项3-1\",\n#           value: \"3-2\",\n#           caption: \"说明3-2\",\n#         },\n#       ],\n#     },\n#   ];\n# </script>\n# \n```\n\n### disabled\n\n```yaml preview\n- brick: eo-auto-complete\n  properties:\n    disabled: true\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-auto-complete disabled id=\"brick-1\"></eo-auto-complete>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n\n### events\n\n```yaml preview\n- brick: eo-auto-complete\n  events:\n    change:\n      - action: console.log\n  properties:\n    options:\n      - Beijing\n      - Shanghai\n      - Guangzhou\n      - Shenzhen\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-auto-complete id=\"brick-1\"></eo-auto-complete>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n#   brick_1.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview minHeight=500px\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-auto-complete\n      properties:\n        name: city\n        label: 城市\n        required: true\n        options:\n          - Beijing\n          - Shanghai\n          - Guangzhou\n          - Shenzhen\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-auto-complete\n#     name=\"city\"\n#     label=\"城市\"\n#     required\n#     id=\"brick-2\"\n#   ></eo-auto-complete>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.options = [\"Beijing\", \"Shanghai\", \"Guangzhou\", \"Shenzhen\"];\n# </script>\n# \n```\n"
   },
-  "eo-time-picker": {
-    "doc": "构件 `eo-time-picker`\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-time-picker\n  properties:\n    label: time\n    placeholder: 选择时间\n    value: \"12:30:01\"\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-time-picker\n#   label=\"time\"\n#   placeholder=\"选择时间\"\n#   value=\"12:30:01\"\n# ></eo-time-picker>\n# \n```\n\n### 国际化\n\n```yaml preview minHeight=\"400px\"\n- brick: div\n  properties:\n    style:\n      display: grid\n      gap: 1em\n  children:\n    - brick: eo-time-picker\n    - brick: eo-button\n      properties:\n        textContent: 中文\n      events:\n        click:\n          useProvider: basic.change-language\n          args:\n            - zh\n          callback:\n            success:\n              action: message.success\n              args:\n                - '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>'\n    - brick: eo-button\n      properties:\n        textContent: English\n      events:\n        click:\n          useProvider: basic.change-language\n          args:\n            - en\n          callback:\n            success:\n              action: message.success\n              args:\n                - '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>'\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"display: grid; gap: 1em\">\n#   <eo-time-picker></eo-time-picker>\n#   <eo-button id=\"brick-1\">中文</eo-button>\n#   <eo-button id=\"brick-2\">English</eo-button>\n# </div>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"click\", (e) => {\n#     const provider = document.createElement(\"basic.change-language\");\n#     const promise = Promise.resolve(provider.resolve(\"zh\"));\n#     promise.then((r) => {\n#       const message = document.createElement(\"basic.show-notification\");\n#       message.resolve({\n#         type: \"success\",\n#         /* WARN: incompatible expressions in HTML, please try YAML: */\n#         message: '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>',\n#       });\n#     });\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const provider = document.createElement(\"basic.change-language\");\n#     const promise = Promise.resolve(provider.resolve(\"en\"));\n#     promise.then((r) => {\n#       const message = document.createElement(\"basic.show-notification\");\n#       message.resolve({\n#         type: \"success\",\n#         /* WARN: incompatible expressions in HTML, please try YAML: */\n#         message: '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>',\n#       });\n#     });\n#   });\n# </script>\n# \n```\n\n### event\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-time-picker\n  events:\n    change:\n      action: console.log\n    open:\n      action: console.log\n    close:\n      action: console.log\n  properties:\n    label: time\n    placeholder: 选择时间\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-time-picker\n#   label=\"time\"\n#   placeholder=\"选择时间\"\n#   id=\"brick-1\"\n# ></eo-time-picker>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"open\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"close\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-time-picker\n      properties:\n        label: 时间\n        name: time\n        required: true\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-time-picker label=\"时间\" name=\"time\" required></eo-time-picker>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
+  "eo-upload-file": {
+    "doc": "上传文件\n\n## Examples\n\n### Basic\n\n```yaml preview\nbrick: eo-upload-file\nproperties:\n  style:\n    width: 300px\n  uploadDraggable: true\n  maxCount: 2\n  multiple: true\n  accept: image/*\n  draggableUploadTip: 支持上传2张图片\nevents:\n  change:\n    - action: console.log\n      args:\n        - <% EVENT.detail %>\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-upload-file\n#   style=\"width: 300px\"\n#   upload-draggable\n#   max-count=\"2\"\n#   multiple\n#   accept=\"image/*\"\n#   draggable-upload-tip=\"支持上传2张图片\"\n#   id=\"brick-1\"\n# ></eo-upload-file>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-upload-file\n      properties:\n        label: 文件\n        name: file\n        required: true\n        style:\n          width: 300px\n        uploadDraggable: true\n        maxCount: 2\n        multiple: true\n        accept: image/*\n        draggableUploadTip: 支持上传图片\n      events:\n        change:\n          - action: console.log\n            args:\n              - <% EVENT.detail %>\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-upload-file\n#     label=\"文件\"\n#     name=\"file\"\n#     required\n#     style=\"width: 300px\"\n#     upload-draggable\n#     max-count=\"2\"\n#     multiple\n#     accept=\"image/*\"\n#     draggable-upload-tip=\"支持上传图片\"\n#     id=\"brick-2\"\n#   ></eo-upload-file>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
   },
   "eo-date-picker": {
     "doc": "构件 `eo-date-picker`\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"450px\"\n- brick: eo-date-picker\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-date-picker></eo-date-picker>\n# \n```\n\n### picker\n\n```yaml preview minHeight=\"550px\"\n- brick: eo-radio\n  events:\n    change:\n      - target: \"#datePicker\"\n        properties:\n          picker: <% EVENT.detail.value %>\n  properties:\n    options:\n      - label: 天\n        value: date\n      - label: 周\n        value: week\n      - label: 月\n        value: month\n      - label: 季度\n        value: quarter\n      - label: 年\n        value: year\n- brick: div\n  properties:\n    style:\n      display: grid\n      gap: 1em\n  children:\n    - brick: eo-button\n      properties:\n        textContent: 中文\n      events:\n        click:\n          useProvider: basic.change-language\n          args:\n            - zh\n          callback:\n            success:\n              action: message.success\n              args:\n                - '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>'\n    - brick: eo-button\n      properties:\n        textContent: English\n      events:\n        click:\n          useProvider: basic.change-language\n          args:\n            - en\n          callback:\n            success:\n              action: message.success\n              args:\n                - '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>'\n- brick: eo-date-picker\n  properties:\n    id: datePicker\n    useFastSelectBtn: true\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-radio id=\"brick-1\"></eo-radio>\n# <div style=\"display: grid; gap: 1em\">\n#   <eo-button id=\"brick-2\">中文</eo-button>\n#   <eo-button id=\"brick-3\">English</eo-button>\n# </div>\n# <eo-date-picker use-fast-select-btn id=\"datePicker\"></eo-date-picker>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     {\n#       label: \"天\",\n#       value: \"date\",\n#     },\n#     {\n#       label: \"周\",\n#       value: \"week\",\n#     },\n#     {\n#       label: \"月\",\n#       value: \"month\",\n#     },\n#     {\n#       label: \"季度\",\n#       value: \"quarter\",\n#     },\n#     {\n#       label: \"年\",\n#       value: \"year\",\n#     },\n#   ];\n#   brick_1.addEventListener(\"change\", (e) => {\n#     const brick = document.querySelector(\"#datePicker\");\n#     brick.picker = \"<% EVENT.detail.value %>\";\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const provider = document.createElement(\"basic.change-language\");\n#     const promise = Promise.resolve(provider.resolve(\"zh\"));\n#     promise.then((r) => {\n#       const message = document.createElement(\"basic.show-notification\");\n#       message.resolve({\n#         type: \"success\",\n#         /* WARN: incompatible expressions in HTML, please try YAML: */\n#         message: '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>',\n#       });\n#     });\n#   });\n# \n#   const brick_3 = document.getElementById(\"brick-3\");\n#   brick_3.addEventListener(\"click\", (e) => {\n#     const provider = document.createElement(\"basic.change-language\");\n#     const promise = Promise.resolve(provider.resolve(\"en\"));\n#     promise.then((r) => {\n#       const message = document.createElement(\"basic.show-notification\");\n#       message.resolve({\n#         type: \"success\",\n#         /* WARN: incompatible expressions in HTML, please try YAML: */\n#         message: '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>',\n#       });\n#     });\n#   });\n# </script>\n# \n```\n\n### showTime\n\n```yaml preview minHeight=\"450px\"\n- brick: eo-date-picker\n  events:\n    ok:\n      action: console.log\n    change:\n      action: console.log\n  properties:\n    showTime: true\n    value: \"2020-02-01 14:30:00\"\n    format: \"YYYY-MM-DD HH:mm:ss\"\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-date-picker\n#   show-time\n#   value=\"2020-02-01 14:30:00\"\n#   format=\"YYYY-MM-DD HH:mm:ss\"\n#   id=\"brick-1\"\n# ></eo-date-picker>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"ok\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### 禁用日期\n\n```yaml preview minHeight=\"450px\"\n- brick: eo-date-picker\n  events:\n    ok:\n      action: console.log\n    change:\n      action: console.log\n  properties:\n    disabledDate:\n      - weekday: 4\n      - date: 10-15\n        year: 2010-2020\n      - hour: 12-18\n        minute: 0-29\n        weekday: 3\n    format: \"YYYY-MM-DD HH:mm:ss\"\n    showTime: true\n    value: \"2019-10-01 00:00:00\"\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-date-picker\n#   format=\"YYYY-MM-DD HH:mm:ss\"\n#   show-time\n#   value=\"2019-10-01 00:00:00\"\n#   id=\"brick-1\"\n# ></eo-date-picker>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.disabledDate = [\n#     {\n#       weekday: 4,\n#     },\n#     {\n#       date: \"10-15\",\n#       year: \"2010-2020\",\n#     },\n#     {\n#       hour: \"12-18\",\n#       minute: \"0-29\",\n#       weekday: 3,\n#     },\n#   ];\n#   brick_1.addEventListener(\"ok\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview minHeight=\"450px\"\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-date-picker\n      properties:\n        label: 日期\n        name: date\n        required: true\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-date-picker label=\"日期\" name=\"date\" required></eo-date-picker>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
   },
+  "eo-time-picker": {
+    "doc": "构件 `eo-time-picker`\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-time-picker\n  properties:\n    label: time\n    placeholder: 选择时间\n    value: \"12:30:01\"\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-time-picker\n#   label=\"time\"\n#   placeholder=\"选择时间\"\n#   value=\"12:30:01\"\n# ></eo-time-picker>\n# \n```\n\n### 国际化\n\n```yaml preview minHeight=\"400px\"\n- brick: div\n  properties:\n    style:\n      display: grid\n      gap: 1em\n  children:\n    - brick: eo-time-picker\n    - brick: eo-button\n      properties:\n        textContent: 中文\n      events:\n        click:\n          useProvider: basic.change-language\n          args:\n            - zh\n          callback:\n            success:\n              action: message.success\n              args:\n                - '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>'\n    - brick: eo-button\n      properties:\n        textContent: English\n      events:\n        click:\n          useProvider: basic.change-language\n          args:\n            - en\n          callback:\n            success:\n              action: message.success\n              args:\n                - '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>'\n# -- YAML DELIMITER (1nbbm8) --\n# <div style=\"display: grid; gap: 1em\">\n#   <eo-time-picker></eo-time-picker>\n#   <eo-button id=\"brick-1\">中文</eo-button>\n#   <eo-button id=\"brick-2\">English</eo-button>\n# </div>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"click\", (e) => {\n#     const provider = document.createElement(\"basic.change-language\");\n#     const promise = Promise.resolve(provider.resolve(\"zh\"));\n#     promise.then((r) => {\n#       const message = document.createElement(\"basic.show-notification\");\n#       message.resolve({\n#         type: \"success\",\n#         /* WARN: incompatible expressions in HTML, please try YAML: */\n#         message: '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>',\n#       });\n#     });\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"click\", (e) => {\n#     const provider = document.createElement(\"basic.change-language\");\n#     const promise = Promise.resolve(provider.resolve(\"en\"));\n#     promise.then((r) => {\n#       const message = document.createElement(\"basic.show-notification\");\n#       message.resolve({\n#         type: \"success\",\n#         /* WARN: incompatible expressions in HTML, please try YAML: */\n#         message: '<% I18N_TEXT({ zh: \"你好\", \"en\": \"Hello\" }) %>',\n#       });\n#     });\n#   });\n# </script>\n# \n```\n\n### event\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-time-picker\n  events:\n    change:\n      action: console.log\n    open:\n      action: console.log\n    close:\n      action: console.log\n  properties:\n    label: time\n    placeholder: 选择时间\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-time-picker\n#   label=\"time\"\n#   placeholder=\"选择时间\"\n#   id=\"brick-1\"\n# ></eo-time-picker>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"open\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"close\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-time-picker\n      properties:\n        label: 时间\n        name: time\n        required: true\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-time-picker label=\"时间\" name=\"time\" required></eo-time-picker>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
+  },
   "eo-time-range-picker": {
     "doc": "构件 `eo-time-range-picker`\n\n## Examples\n\n### Basic\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-time-range-picker\n  properties:\n    label: hello\n    name: time\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-time-range-picker label=\"hello\" name=\"time\"></eo-time-range-picker>\n# \n```\n\n### rangeType\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-radio\n  properties:\n    options:\n      - time\n      - date\n      - dateTime\n      - hmTime\n      - week\n      - month\n      - quarter\n      - year\n  events:\n    change:\n      - target: \"#rangePicker\"\n        properties:\n          rangeType: <% EVENT.detail.value %>\n- brick: eo-time-range-picker\n  properties:\n    label: hello\n    name: time\n    id: rangePicker\n    rangeType: date\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-radio id=\"brick-1\"></eo-radio>\n# <eo-time-range-picker\n#   label=\"hello\"\n#   name=\"time\"\n#   id=\"rangePicker\"\n# ></eo-time-range-picker>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.options = [\n#     \"time\",\n#     \"date\",\n#     \"dateTime\",\n#     \"hmTime\",\n#     \"week\",\n#     \"month\",\n#     \"quarter\",\n#     \"year\",\n#   ];\n#   brick_1.addEventListener(\"change\", (e) => {\n#     const brick = document.querySelector(\"#rangePicker\");\n#     brick.rangeType = \"<% EVENT.detail.value %>\";\n#   });\n# \n#   const rangePicker = document.getElementById(\"rangePicker\");\n#   rangePicker.rangeType = \"date\";\n# </script>\n# \n```\n\n### presetRanges\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-time-range-picker\n  properties:\n    label: hello\n    name: time\n    rangeType: week\n    required: true\n    presetRanges:\n      - 本周\n      - 本月\n      - 本季度\n      - 今年\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-time-range-picker\n#   label=\"hello\"\n#   name=\"time\"\n#   required\n#   id=\"brick-1\"\n# ></eo-time-range-picker>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.rangeType = \"week\";\n#   brick_1.presetRanges = [\"本周\", \"本月\", \"本季度\", \"今年\"];\n# </script>\n# \n```\n\n### validate\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-form\n  events:\n    values.change:\n      - action: console.log\n    validate.success:\n      - action: message.success\n        args:\n          - 表单提交成功\n    validate.error:\n      - action: message.error\n        args:\n          - 表单校验失败\n  slots:\n    \"\":\n      bricks:\n        - brick: eo-time-range-picker\n          events:\n            change:\n              action: console.log\n          properties:\n            label: hello\n            name: time\n            required: true\n        - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-time-range-picker\n#     label=\"hello\"\n#     name=\"time\"\n#     required\n#     id=\"brick-2\"\n#   ></eo-time-range-picker>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"success\", message: \"表单提交成功\" });\n#   });\n#   brick_1.addEventListener(\"validate.error\", (e) => {\n#     const message = document.createElement(\"basic.show-notification\");\n#     message.resolve({ type: \"error\", message: \"表单校验失败\" });\n#   });\n# \n#   const brick_2 = document.getElementById(\"brick-2\");\n#   brick_2.addEventListener(\"change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### selectNearDays\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-time-range-picker\n  events:\n    - action: console.log\n  properties:\n    label: hello\n    name: time\n    selectNearDays: 10\n    rangeType: date\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-time-range-picker\n#   label=\"hello\"\n#   name=\"time\"\n#   select-near-days=\"10\"\n#   id=\"brick-1\"\n# ></eo-time-range-picker>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.rangeType = \"date\";\n#   brick_1.addEventListener(\"0\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### Events\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-time-range-picker\n  events:\n    - action: console.log\n  properties:\n    label: hello\n    name: time\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-time-range-picker\n#   label=\"hello\"\n#   name=\"time\"\n#   id=\"brick-1\"\n# ></eo-time-range-picker>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"0\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n\n### With Form\n\n```yaml preview minHeight=\"400px\"\n- brick: eo-form\n  events:\n    validate.success:\n      - action: console.log\n    values.change:\n      - action: console.log\n  children:\n    - brick: eo-time-range-picker\n      properties:\n        label: 时间\n        name: time\n        required: true\n    - brick: eo-submit-buttons\n# -- YAML DELIMITER (1nbbm8) --\n# <eo-form id=\"brick-1\">\n#   <eo-time-range-picker\n#     label=\"时间\"\n#     name=\"time\"\n#     required\n#   ></eo-time-range-picker>\n#   <eo-submit-buttons></eo-submit-buttons>\n# </eo-form>\n# \n# <script>\n#   const brick_1 = document.getElementById(\"brick-1\");\n#   brick_1.addEventListener(\"validate.success\", (e) => {\n#     console.log(e.detail);\n#   });\n#   brick_1.addEventListener(\"values.change\", (e) => {\n#     console.log(e.detail);\n#   });\n# </script>\n# \n```\n"
   },