@opentiny/vue-docs 3.17.2 → 3.17.4

package/demos/pc/app/icon/iconGroups.js

@@ -1,42 +1,249 @@
 export const iconGroups = {
-  Arrow: [
-    'IconArrowDown',
+  Left: [
+    'IconAngleLeft',
     'IconArrowLeft',
-    'IconArrowRight',
-    'IconArrowUp',
-    'IconAscending',
-    'IconChevronDown',
     'IconChevronLeft',
-    'IconChevronRight',
-    'IconChevronUp',
     'IconDefault',
-    'IconDeltaDownO',
-    'IconDeltaDown',
     'IconDeltaLeftO',
-    'IconDeltaLeft',
-    'IconDeltaRightO',
-    'IconDeltaRight',
-    'IconDeltaUpO',
-    'IconDeltaUp',
     'IconDoubleLeft',
-    'IconDoubleRight',
-    'IconDownO',
-    'IconDown',
-    'IconDownWard',
-    'IconEnd',
+    'IconLeft',
     'IconLeftO',
     'IconLeftWard',
     'IconLeftWardArrow',
-    'IconLeft',
-    'IconPopup',
-    'IconRightO',
+    'IconDeltaLeft',
+    'IconPagerFirst',
+    'IconPagerPrev',
+    'IconRichTextAlignLeft',
+    'IconSplitLeft',
+    'IconUndo'
+  ],
+  Right: [
+    'IconArrowRight',
+    'IconAngleRight',
+    'IconChevronRight',
+    'IconDeltaRight',
+    'IconDeltaRightO',
+    'IconDoubleRight',
+    'IconEnd',
+    'IconPagerLast',
+    'IconPagerNext',
+    'IconRedo',
     'IconRight',
+    'IconRightO',
+    'IconRichTextRedo',
+    'IconRichTextAlignRight',
     'IconRightward',
-    'IconTriangleDown',
-    'IconUpO',
+    'IconSplitRight',
+    'IconStart',
+    'IconTransform'
+  ],
+  TextAlign: [
+    'IconAlignCenter',
+    'IconAlignLeft',
+    'IconAlignJustify',
+    'IconAlignRight',
+    'IconAlignStretch',
+    'IconStreamSolid',
+    'IconRichTextAddColumnAfter',
+    'IconRichTextAddColumnBefore',
+    'IconRichTextAddRowAfter',
+    'IconRichTextAddRowBefore',
+    'IconRichTextAlignCenter',
+    'IconRichTextDeleteColumn',
+    'IconRichTextDeleteRow',
+    'IconRichTextLineHeight',
+    'IconRichTextListOrdered',
+    'IconRichTextListUnordered',
+    'IconRichTextMergeCells',
+    'IconRichTextMergeCellsVertical',
+    'IconRichTextSplitCellsHorizontal',
+    'IconRichTextSplitCellsVertical',
+    'IconRichTextTable',
+    'IconRichTextTaskList',
+    'IconSplit'
+  ],
+  Upward: [
+    'IconArrowUp',
+    'IconChevronUp',
+    'IconDeltaUp',
+    'IconDeltaUpO',
+    'IconFreeze',
     'IconUp',
+    'IconUpO',
     'IconUpWard'
   ],
+  Downward: [
+    'IconArrowBottom',
+    'IconArrowDown',
+    'IconChevronDown',
+    'IconDeltaDown',
+    'IconDeltaDownO',
+    'IconDown',
+    'IconDownO',
+    'IconDownWard',
+    'IconTriangleDown'
+  ],
+  Back: ['IconEditorUndo', 'IconGoBack', 'IconImport', 'IconRichTextUndo'],
+  Cycle: [
+    'IconConmentRefresh',
+    'IconDownload',
+    'IconGenerating',
+    'IconGroupTransfer',
+    'IconReplace',
+    'IconRefres',
+    'IconRefresh',
+    'IconRepeat',
+    'IconUpload'
+  ],
+  Sort: [
+    'IconAscending',
+    'IconDescending',
+    'IconSort',
+    'IconSortDefault',
+    'IconSortO',
+    'IconSortTriangle',
+    'IconSortTriangleAscending',
+    'IconSortTriangleDescending'
+  ],
+  Filter: ['IconBefilter', 'IconClearFilter', 'IconDefinedFiltration', 'IconFilter', 'IconFiltered', 'IconUnfilter'],
+  Reduce: [
+    'IconExpand',
+    'IconMinus',
+    'IconMinusCircle',
+    'IconMinusSquare',
+    'IconNodeOpen',
+    'IconPanelMini',
+    'IconStop',
+    'IconZoomOut'
+  ],
+  Add: [
+    'IconAdd',
+    'IconAddCircle',
+    'IconNew',
+    'IconNode',
+    'IconPlus',
+    'IconPlusSquare',
+    'IconPlusCircle',
+    'IconPutAway',
+    'IconView',
+    'IconZoomIn'
+  ],
+  Check: [
+    'IconCheck',
+    'IconHalfchecked',
+    'IconHalfselect',
+    'IconMobileCheckbox',
+    'IconMobileCheckboxHalf',
+    'IconPreChecked'
+  ],
+  Success: [
+    'IconCheckedLinear',
+    'IconCheckedSur',
+    'IconDone',
+    'IconFinish',
+    'IconMobileCheckboxSelected',
+    'IconSubScript',
+    'IconSuccess',
+    'IconSuccessful',
+    'IconYes'
+  ],
+  Fail: [
+    'IconClose',
+    'IconCloseCircle',
+    'IconCloseSquare',
+    'IconDelete',
+    'IconError',
+    'IconOperationfaild',
+    'IconOperationfaildL',
+    'IconStepsError'
+  ],
+  Warn: [
+    'IconCueL',
+    'IconCueLO',
+    'IconExceptionO',
+    'IconExclamation',
+    'IconWarn',
+    'IconWarning',
+    'IconWarningO',
+    'IconWarningTriangle'
+  ],
+  Question: ['IconHelpCircle', 'IconHelpQuery', 'IconUnknow', 'IconUnknown'],
+  Prompt: [
+    'IconInfo',
+    'IconInfoCircle',
+    'IconInfoSolid',
+    'IconHelp',
+    'IconHelpSolid',
+    'IconPrompt',
+    'IconPromptExclamation'
+  ],
+  Stretchable: [
+    'IconFullscreenLeft',
+    'IconMinscreenLeft',
+    'IconMinscreenRight',
+    'IconStretch',
+    'IconStretchCrosswise',
+    'IconStretchUpright'
+  ],
+  More: ['IconEllipsis', 'IconMore', 'IconPopup'],
+  Dot: [
+    'IconDotIpv4',
+    'IconLeave',
+    'IconOffLine',
+    'IconOnLine',
+    'IconBusy',
+    'IconDoneMini',
+    'IconOnGoing',
+    'IconOnGoingMini',
+    'IconMobileRadio',
+    'IconExceptionMiniO',
+    'IconMobileRadioSelected',
+    'IconOperation',
+    'IconRadio',
+    'IconRadioselected'
+  ],
+  Location: ['IconLocation', 'IconLocationNumber', 'IconMarkOn'],
+  Letter: [
+    'IconEditorBold',
+    'IconEditorDeleteline',
+    'IconEditorItalic',
+    'IconEditorSub',
+    'IconEditorSubtitle',
+    'IconEditorSuper',
+    'IconEditorTitle',
+    'IconEditorUnderline',
+    'IconFontColor',
+    'IconFontSize',
+    'IconFontStyle',
+    'IconFontWeight',
+    'IconRichTextBold',
+    'IconRichTextFontSize',
+    'IconRichTextFormatClear',
+    'IconRichTextH1',
+    'IconRichTextH2',
+    'IconRichTextH3',
+    'IconRichTextH4',
+    'IconRichTextH5',
+    'IconRichTextH6',
+    'IconRichTextHeading',
+    'IconRichTextItalic',
+    'IconRichTextStrikeThrough',
+    'IconRichTextSubscript',
+    'IconRichTextSuperscript',
+    'IconRichTextUnderline',
+    'IconTextDecoration',
+    'IconUnderline'
+  ],
+  Mall: [
+    'IconPurchasePlannedOrder',
+    'IconShipped',
+    'IconShoppingCard',
+    'IconSoldOut',
+    'IconSurchargeSettled',
+    'IconSurchargeSettled',
+    'IconWaitForDeliveryO',
+    'IconWaitingToPick'
+  ],
   Brands: ['IconAngularjs', 'IconEspaceAuto', 'IconEspace', 'IconNodejs', 'IconReactjs', 'IconVuejs'],
   Charts: ['IconAreaChart', 'IconDotChart', 'IconLineChart', 'IconPieChart', 'IconStatistics'],
   Editor: [
@@ -44,11 +251,8 @@ export const iconGroups = {
     'IconEditorAlignLeft',
     'IconEditorAlignRight',
     'IconEditorBackground',
-    'IconEditorBold',
     'IconEditorCode',
-    'IconEditorDeleteline',
     'IconEditorEraser',
-    'IconEditorItalic',
     'IconEditorLeftBorder',
     'IconEditorList',
     'IconEditorListDot',
@@ -58,51 +262,64 @@ export const iconGroups = {
     'IconEditorQuote',
     'IconEditorRedo',
     'IconEditorRightBorder',
-    'IconEditorSub',
-    'IconEditorSubtitle',
-    'IconEditorSuper',
     'IconEditorTable',
     'IconEditorTextcolor',
-    'IconEditorTitle',
-    'IconEditorUnderline',
-    'IconEditorUndo',
+    'IconExport',
     'IconEditorVideo',
-    'IconOperationfaildL',
+    'IconFilletExternalLink',
     'IconOuterLink',
-    'IconTextDecoration',
-    'IconUnderline',
     'IconWriting'
   ],
   IT: [
     'IconAdministrator',
     'IconDataSource',
     'IconDesktopView',
-    'IconEmailAdd',
-    'IconEmailCircle',
-    'IconExcel',
     'IconException',
-    'IconExclamation',
     'IconLanguage',
-    'IconMailContent',
-    'IconMail',
-    'IconMarkOn',
     'IconMobileView',
     'IconMobile',
     'IconPrintPreview',
-    'IconReplies',
-    'IconSent',
     'IconShare',
     'IconShareArrow',
-    'IconShoppingCard',
     'IconTabletView',
     'IconUnlock',
-    'IconUnsent',
     'IconUser',
     'IconVersiontree',
     'IconWebPlus',
     'IconJs'
   ],
+  Clock: ['IconClockWork', 'IconProcessing', 'IconTime'],
+  Email: ['IconEmailAdd', 'IconEmailCircle', 'IconMailContent', 'IconMail', 'IconReplies', 'IconSent', 'IconUnsent'],
+  Folder: ['IconFileCloudupload', 'IconFolder', 'IconFolderClosed', 'IconFolderOpened'],
+  File: [
+    'IconCloudUpload',
+    'IconDocument',
+    'IconExcel',
+    'IconExcelType',
+    'IconFileExcel',
+    'IconFile',
+    'IconFilesCircle',
+    'IconFiles',
+    'IconFiletext',
+    'IconFileType',
+    'IconFileupload',
+    'IconFinishO',
+    'IconHistoryRecord',
+    'IconOtherType',
+    'IconPdfType',
+    'IconPptType',
+    'IconTextType',
+    'IconText',
+    'IconTextAlign',
+    'IconTextTab',
+    'IconVideoType',
+    'IconWordType',
+    'IconXml',
+    'IconZipType'
+  ],
+  Image: ['IconAddPicture', 'IconImageAdd', 'IconPicture', 'IconPictureType', 'IconRichTextImage'],
   Media: [
+    'IconAudio',
     'IconCourse',
     'IconCustom',
     'IconCustomerService',
@@ -110,161 +327,89 @@ export const iconGroups = {
     'IconDialog2',
     'IconInformation',
     'IconMessageCircle',
-    'IconPagerFirst',
-    'IconPagerLast',
-    'IconPagerNext',
-    'IconPagerPrev',
+    'IconMic',
     'IconPauseCircle',
     'IconPause',
-    'IconPicture',
     'IconStartCircle',
-    'IconStart',
-    'IconTime'
+    'IconStartO',
+    'IconTurnOn'
   ],
-  Objects: [
+  Object: [
     'IconBoat',
     'IconCalculator',
     'IconCalendar',
-    'IconClockWork',
     'IconCloudDownload',
-    'IconCloudUpload',
     'IconCoin',
     'IconTaskCooperation',
     'IconTelephoneCircle',
     'IconTelephone'
   ],
-  Symbols: [
-    'IconBusy',
-    'IconCheck',
-    'IconCheckedLinear',
-    'IconCheckedSur',
-    'IconCloseCircle',
-    'IconCloseSquare',
+  Symbol: [
     'IconCode',
     'IconCommission',
-    'IconCueL',
     'IconCrop',
-    'IconDotIpv4',
-    'IconEllipsis',
-    'IconError',
     'IconEyeclose',
     'IconEyeopen',
     'IconFrownO',
     'IconFrown',
     'IconGroup',
     'IconHeartempty',
-    'IconHelpCircle',
-    'IconHelpQuery',
-    'IconHelpSolid',
-    'IconHelp',
     'IconHelpful',
-    'IconLeave',
     'IconLoading',
     'IconLock',
     'IconMale',
     'IconMeh',
-    'IconMore',
-    'IconPlus',
-    'IconNodeOpen',
-    'IconNode',
     'IconNone',
-    'IconOffLine',
-    'IconOnLine',
     'IconPanelMax',
-    'IconPanelMini',
     'IconPanelNormal',
-    'IconRadio',
-    'IconRadioselected',
     'IconSmileO',
     'IconSmile',
     'IconStarActive',
     'IconStarDisable',
-    'IconStarO',
-    'IconStop',
-    'IconSuccess',
-    'IconSuccessful',
-    'IconInfoSolid',
-    'IconInfoCircle',
-    'IconInfo',
-    'IconOperationfaild',
-    'IconUnknow',
-    'IconUnknown',
-    'IconWarning',
-    'IconWarningTriangle',
-    'IconClose',
-    'IconYes'
+    'IconStarO'
   ],
-  Tools: [
-    'IconAdd',
-    'IconAddPicture',
+  Tool: [
+    'IconConfig',
+    'IconSetting',
     'IconAlignBaseline',
-    'IconAlignCenter',
     'IconAlignFlexCenter',
     'IconAlignFlexEnd',
     'IconAlignFlexStart',
-    'IconAlignJustify',
-    'IconAlignLeft',
-    'IconAlignRight',
-    'IconAlignStretch',
     'IconApp',
     'IconApplication',
     'IconAssociation',
     'IconAttachment',
     'IconBarChart',
-    'IconBefilter',
     'IconBoxSolid',
     'IconCheckOut',
     'IconCheckedTrue',
-    'IconClearFilter',
-    'IconConmentRefresh',
     'IconCopySolid',
     'IconCopy',
-    'IconDefinedFiltration',
     'IconDel',
+    'IconDeleteL',
     'IconDeleted',
     'IconDerive',
     'IconDeletePage',
-    'IconDescending',
     'IconColReverse',
     'IconDirectionCol',
     'IconDirectionRow',
     'IconRowReverse',
     'IconDownloadCloud',
     'IconDownloadLink',
-    'IconDownload',
     'IconDraft',
     'IconEdit',
+    'IconEditor',
     'IconEditorTab',
-    'IconExport',
     'IconExpressSearch',
-    'IconFileCloudupload',
-    'IconFileExcel',
-    'IconFile',
-    'IconFilesCircle',
-    'IconFiles',
-    'IconFiletext',
-    'IconFileupload',
-    'IconFiltered',
     'IconFlag',
-    'IconFolderClosed',
-    'IconFolderOpened',
-    'IconFontColor',
     'IconFontFamily',
-    'IconFontSize',
-    'IconFontStyle',
-    'IconFontWeight',
     'IconFreezeLeft',
     'IconFreezeRight',
     'IconFullscreen',
-    'IconFullscreenLeft',
     'IconGrade',
-    'IconGroupTransfer',
-    'IconHalfchecked',
-    'IconHalfselect',
     'IconHideLeft',
     'IconHideRight',
     'IconHideTopleft',
-    'IconImport',
     'IconJusitfyCenter',
     'IconJusitfyFlexEnd',
     'IconJusitfySpaceAround',
@@ -274,24 +419,13 @@ export const iconGroups = {
     'IconLineHeight',
     'IconLineThrought',
     'IconLink',
-    'IconMinscreenLeft',
     'IconMinscreen',
-    'IconMinusCircle',
-    'IconMinusSquare',
-    'IconMinus',
-    'IconNew',
     'IconNoPremission',
     'IconPagelink',
-    'IconPlusCircle',
-    'IconPlusSquare',
-    'IconPreChecked',
     'IconPushpin',
-    'IconRedo',
-    'IconRefres',
     'IconRenew',
-    'IconRepeat',
-    'IconReplace',
     'IconRightFrozen',
+    'IconRichTextNodeDelete',
     'IconSandwichCollapse',
     'IconSandwichExpand',
     'IconSave',
@@ -299,21 +433,8 @@ export const iconGroups = {
     'IconSearch',
     'IconSelect',
     'IconSeparate',
-    'IconSetting',
-    'IconSortDefault',
-    'IconSort',
-    'IconStreamSolid',
-    'IconTextAlign',
-    'IconTextTab',
-    'IconText',
     'IconTotal',
     'IconUndelete',
-    'IconUndo',
-    'IconUnfilter',
-    'IconUnfreeze',
-    'IconUpload',
-    'IconView',
-    'IconZoomIn',
-    'IconZoomOut'
+    'IconUnfreeze'
   ]
 }

package/demos/pc/app/input/basic-usage.spec.ts

@@ -3,7 +3,7 @@ import { test, expect } from '@playwright/test'
 test('[Input]basic-usage: placeholder, focus-style, v-model', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('input#basic-usage')
-  const input = await page.locator('.demo-input > .tiny-input > .tiny-input-display-only > input')
+  const input = page.locator('.demo-input > .tiny-input > .tiny-input-display-only > input')
 
   await expect(input).toBeVisible()
   await expect(input).toHaveAttribute('placeholder', 'Please input')

package/demos/pc/app/input/show-tooltip-composition-api.vue

@@ -0,0 +1,27 @@
+<template>
+  <div class="demo-input">
+    是否悬浮提示：<tiny-switch v-model="showTooltip"></tiny-switch>
+    <tiny-input v-model="input" display-only :show-tooltip="showTooltip"></tiny-input>
+  </div>
+</template>
+
+<script setup>
+import { Input as TinyInput, Switch as TinySwitch } from '@opentiny/vue'
+import { ref } from 'vue'
+
+const showTooltip = ref(false)
+
+const input = ref(
+  '内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多'
+)
+</script>
+
+<style scoped>
+.demo-input {
+  width: 200px;
+  display: inline-block;
+}
+.tiny-input {
+  margin-top: 12px;
+}
+</style>

package/demos/pc/app/input/show-tooltip.spec.ts

@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('只读态悬浮提示', async ({ page }) => {
+  page.on('pageerror', (exception) => expect(exception).toBeNull())
+  await page.goto('input#show-tooltip')
+
+  const demo = page.locator('#show-tooltip')
+  await demo.locator('.tiny-input .tiny-input-display-only__content').hover()
+  await expect(page.locator('.tiny-tooltip.tiny-tooltip__popper')).not.toBeVisible()
+})

package/demos/pc/app/input/show-tooltip.vue

@@ -0,0 +1,34 @@
+<template>
+  <div class="demo-input">
+    是否悬浮提示：<tiny-switch v-model="showTooltip"></tiny-switch>
+    <tiny-input v-model="input" display-only :show-tooltip="showTooltip"></tiny-input>
+  </div>
+</template>
+
+<script>
+import { Input, Switch } from '@opentiny/vue'
+
+export default {
+  components: {
+    TinyInput: Input,
+    TinySwitch: Switch
+  },
+  data() {
+    return {
+      showTooltip: false,
+      input:
+        '内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多内容很多'
+    }
+  }
+}
+</script>
+
+<style scoped>
+.demo-input {
+  width: 200px;
+  display: inline-block;
+}
+.tiny-input {
+  margin-top: 12px;
+}
+</style>

package/demos/pc/app/input/webdoc/input.js

@@ -41,6 +41,19 @@ export default {
       },
       codeFiles: ['show-password.vue']
     },
+    {
+      demoId: 'show-tooltip',
+      name: {
+        'zh-CN': '只读态悬浮提示',
+        'en-US': 'Show Tooltip'
+      },
+      desc: {
+        'zh-CN': '<p>通过 <code>show-tooltip</code> 配置当文本超长时，是否显示悬浮提示。</p>\n',
+        'en-US':
+          '<p>Use <code>show-tooltip</code> to configure whether to display a floating tip when the text is too long. </p>\n'
+      },
+      codeFiles: ['show-tooltip.vue']
+    },
     {
       demoId: 'size',
       name: {

package/demos/pc/app/numeric/numeric-size-composition-api.vue

@@ -5,6 +5,8 @@
     <tiny-numeric v-model="value" size="small"></tiny-numeric>
     <br /><br />
     <tiny-numeric v-model="value" size="mini"></tiny-numeric>
+    <br /><br />
+    <tiny-numeric v-model="value"></tiny-numeric>
   </div>
 </template>