From 97cfbbb65d3e63c32d720e01c7368c68616bb531 Mon Sep 17 00:00:00 2001 From: Sean Perkins Date: Wed, 25 May 2022 14:06:19 -0400 Subject: [PATCH] fix(types): improve intellisense with colors (#25347) --- core/api.txt | 72 ++++++++++++++++++++--------------------- core/src/interface.d.ts | 5 ++- 2 files changed, 40 insertions(+), 37 deletions(-) diff --git a/core/api.txt b/core/api.txt index 52477ca83f..0c5bcdcf33 100644 --- a/core/api.txt +++ b/core/api.txt @@ -103,7 +103,7 @@ ion-avatar,shadow ion-avatar,css-prop,--border-radius ion-back-button,shadow -ion-back-button,prop,color,string | undefined,undefined,false,true +ion-back-button,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-back-button,prop,defaultHref,string | undefined,undefined,false,false ion-back-button,prop,disabled,boolean,false,false,true ion-back-button,prop,icon,null | string | undefined,undefined,false,false @@ -154,7 +154,7 @@ ion-backdrop,prop,visible,boolean,true,false,false ion-backdrop,event,ionBackdropTap,void,true ion-badge,shadow -ion-badge,prop,color,string | undefined,undefined,false,true +ion-badge,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-badge,prop,mode,"ios" | "md",undefined,false,false ion-badge,css-prop,--background ion-badge,css-prop,--color @@ -165,7 +165,7 @@ ion-badge,css-prop,--padding-top ion-breadcrumb,shadow ion-breadcrumb,prop,active,boolean,false,false,false -ion-breadcrumb,prop,color,string | undefined,undefined,false,false +ion-breadcrumb,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,false ion-breadcrumb,prop,disabled,boolean,false,false,false ion-breadcrumb,prop,download,string | undefined,undefined,false,false ion-breadcrumb,prop,href,string | undefined,undefined,false,false @@ -187,7 +187,7 @@ ion-breadcrumb,part,native ion-breadcrumb,part,separator ion-breadcrumbs,shadow -ion-breadcrumbs,prop,color,string | undefined,undefined,false,false +ion-breadcrumbs,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,false ion-breadcrumbs,prop,itemsAfterCollapse,number,1,false,false ion-breadcrumbs,prop,itemsBeforeCollapse,number,1,false,false ion-breadcrumbs,prop,maxItems,number | undefined,undefined,false,false @@ -198,7 +198,7 @@ ion-breadcrumbs,css-prop,--color ion-button,shadow ion-button,prop,buttonType,string,'button',false,false -ion-button,prop,color,string | undefined,undefined,false,true +ion-button,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-button,prop,disabled,boolean,false,false,true ion-button,prop,download,string | undefined,undefined,false,false ion-button,prop,expand,"block" | "full" | undefined,undefined,false,true @@ -245,7 +245,7 @@ ion-buttons,prop,collapse,boolean,false,false,false ion-card,shadow ion-card,prop,button,boolean,false,false,false -ion-card,prop,color,string | undefined,undefined,false,true +ion-card,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-card,prop,disabled,boolean,false,false,false ion-card,prop,download,string | undefined,undefined,false,false ion-card,prop,href,string | undefined,undefined,false,false @@ -263,23 +263,23 @@ ion-card-content,none ion-card-content,prop,mode,"ios" | "md",undefined,false,false ion-card-header,shadow -ion-card-header,prop,color,string | undefined,undefined,false,true +ion-card-header,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-card-header,prop,mode,"ios" | "md",undefined,false,false ion-card-header,prop,translucent,boolean,false,false,false ion-card-subtitle,shadow -ion-card-subtitle,prop,color,string | undefined,undefined,false,true +ion-card-subtitle,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-card-subtitle,prop,mode,"ios" | "md",undefined,false,false ion-card-subtitle,css-prop,--color ion-card-title,shadow -ion-card-title,prop,color,string | undefined,undefined,false,true +ion-card-title,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-card-title,prop,mode,"ios" | "md",undefined,false,false ion-card-title,css-prop,--color ion-checkbox,shadow ion-checkbox,prop,checked,boolean,false,false,false -ion-checkbox,prop,color,string | undefined,undefined,false,true +ion-checkbox,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-checkbox,prop,disabled,boolean,false,false,false ion-checkbox,prop,indeterminate,boolean,false,false,false ion-checkbox,prop,mode,"ios" | "md",undefined,false,false @@ -303,7 +303,7 @@ ion-checkbox,part,container ion-checkbox,part,mark ion-chip,shadow -ion-chip,prop,color,string | undefined,undefined,false,true +ion-chip,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-chip,prop,disabled,boolean,false,false,false ion-chip,prop,mode,"ios" | "md",undefined,false,false ion-chip,prop,outline,boolean,false,false,false @@ -344,7 +344,7 @@ ion-col,css-prop,--ion-grid-column-padding-xs ion-col,css-prop,--ion-grid-columns ion-content,shadow -ion-content,prop,color,string | undefined,undefined,false,true +ion-content,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-content,prop,forceOverscroll,boolean | undefined,undefined,false,false ion-content,prop,fullscreen,boolean,false,false,false ion-content,prop,scrollEvents,boolean,false,false,false @@ -373,7 +373,7 @@ ion-content,part,scroll ion-datetime,shadow ion-datetime,prop,cancelText,string,'Cancel',false,false ion-datetime,prop,clearText,string,'Clear',false,false -ion-datetime,prop,color,string | undefined,'primary',false,false +ion-datetime,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,'primary',false,false ion-datetime,prop,dayValues,number | number[] | string | undefined,undefined,false,false ion-datetime,prop,disabled,boolean,false,false,false ion-datetime,prop,doneText,string,'Done',false,false @@ -418,7 +418,7 @@ ion-fab,method,close,close() => Promise ion-fab-button,shadow ion-fab-button,prop,activated,boolean,false,false,false ion-fab-button,prop,closeIcon,string,close,false,false -ion-fab-button,prop,color,string | undefined,undefined,false,true +ion-fab-button,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-fab-button,prop,disabled,boolean,false,false,false ion-fab-button,prop,download,string | undefined,undefined,false,false ion-fab-button,prop,href,string | undefined,undefined,false,false @@ -515,7 +515,7 @@ ion-input,prop,autocorrect,"off" | "on",'off',false,false ion-input,prop,autofocus,boolean,false,false,false ion-input,prop,clearInput,boolean,false,false,false ion-input,prop,clearOnEdit,boolean | undefined,undefined,false,false -ion-input,prop,color,string | undefined,undefined,false,true +ion-input,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-input,prop,debounce,number,0,false,false ion-input,prop,disabled,boolean,false,false,false ion-input,prop,enterkeyhint,"done" | "enter" | "go" | "next" | "previous" | "search" | "send" | undefined,undefined,false,false @@ -555,7 +555,7 @@ ion-input,css-prop,--placeholder-opacity ion-item,shadow ion-item,prop,button,boolean,false,false,false -ion-item,prop,color,string | undefined,undefined,false,true +ion-item,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-item,prop,counter,boolean,false,false,false ion-item,prop,counterFormatter,((inputLength: number, maxLength: number) => string) | undefined,undefined,false,false ion-item,prop,detail,boolean | undefined,undefined,false,false @@ -611,7 +611,7 @@ ion-item,part,detail-icon ion-item,part,native ion-item-divider,shadow -ion-item-divider,prop,color,string | undefined,undefined,false,true +ion-item-divider,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-item-divider,prop,mode,"ios" | "md",undefined,false,false ion-item-divider,prop,sticky,boolean,false,false,false ion-item-divider,css-prop,--background @@ -628,7 +628,7 @@ ion-item-divider,css-prop,--padding-top ion-item-group,none ion-item-option,shadow -ion-item-option,prop,color,string | undefined,undefined,false,true +ion-item-option,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-item-option,prop,disabled,boolean,false,false,false ion-item-option,prop,download,string | undefined,undefined,false,false ion-item-option,prop,expandable,boolean,false,false,false @@ -655,7 +655,7 @@ ion-item-sliding,method,open,open(side: Side | undefined) => Promise ion-item-sliding,event,ionDrag,any,true ion-label,scoped -ion-label,prop,color,string | undefined,undefined,false,true +ion-label,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-label,prop,mode,"ios" | "md",undefined,false,false ion-label,prop,position,"fixed" | "floating" | "stacked" | undefined,undefined,false,false ion-label,css-prop,--color @@ -667,7 +667,7 @@ ion-list,prop,mode,"ios" | "md",undefined,false,false ion-list,method,closeSlidingItems,closeSlidingItems() => Promise ion-list-header,shadow -ion-list-header,prop,color,string | undefined,undefined,false,true +ion-list-header,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-list-header,prop,lines,"full" | "inset" | "none" | undefined,undefined,false,false ion-list-header,prop,mode,"ios" | "md",undefined,false,false ion-list-header,css-prop,--background @@ -739,7 +739,7 @@ ion-menu,part,container ion-menu-button,shadow ion-menu-button,prop,autoHide,boolean,true,false,false -ion-menu-button,prop,color,string | undefined,undefined,false,true +ion-menu-button,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-menu-button,prop,disabled,boolean,false,false,false ion-menu-button,prop,menu,string | undefined,undefined,false,false ion-menu-button,prop,mode,"ios" | "md",undefined,false,false @@ -842,7 +842,7 @@ ion-nav-link,prop,routerAnimation,((baseEl: any, opts?: any) => Animation) | und ion-nav-link,prop,routerDirection,"back" | "forward" | "root",'forward',false,false ion-note,shadow -ion-note,prop,color,string | undefined,undefined,false,true +ion-note,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-note,prop,mode,"ios" | "md",undefined,false,false ion-note,css-prop,--color @@ -933,7 +933,7 @@ ion-popover,part,content ion-progress-bar,shadow ion-progress-bar,prop,buffer,number,1,false,false -ion-progress-bar,prop,color,string | undefined,undefined,false,true +ion-progress-bar,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-progress-bar,prop,mode,"ios" | "md",undefined,false,false ion-progress-bar,prop,reversed,boolean,false,false,false ion-progress-bar,prop,type,"determinate" | "indeterminate",'determinate',false,false @@ -946,7 +946,7 @@ ion-progress-bar,part,stream ion-progress-bar,part,track ion-radio,shadow -ion-radio,prop,color,string | undefined,undefined,false,true +ion-radio,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-radio,prop,disabled,boolean,false,false,false ion-radio,prop,mode,"ios" | "md",undefined,false,false ion-radio,prop,name,string,this.inputId,false,false @@ -967,7 +967,7 @@ ion-radio-group,prop,value,any,undefined,false,false ion-radio-group,event,ionChange,RadioGroupChangeEventDetail,true ion-range,shadow -ion-range,prop,color,string | undefined,undefined,false,true +ion-range,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-range,prop,debounce,number,0,false,false ion-range,prop,disabled,boolean,false,false,false ion-range,prop,dualKnobs,boolean,false,false,false @@ -1058,7 +1058,7 @@ ion-router,event,ionRouteDidChange,RouterEventDetail,true ion-router,event,ionRouteWillChange,RouterEventDetail,true ion-router-link,shadow -ion-router-link,prop,color,string | undefined,undefined,false,true +ion-router-link,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-router-link,prop,href,string | undefined,undefined,false,false ion-router-link,prop,rel,string | undefined,undefined,false,false ion-router-link,prop,routerAnimation,((baseEl: any, opts?: any) => Animation) | undefined,undefined,false,false @@ -1081,7 +1081,7 @@ ion-searchbar,prop,autocorrect,"off" | "on",'off',false,false ion-searchbar,prop,cancelButtonIcon,string,config.get('backButtonIcon', arrowBackSharp) as string,false,false ion-searchbar,prop,cancelButtonText,string,'Cancel',false,false ion-searchbar,prop,clearIcon,string | undefined,undefined,false,false -ion-searchbar,prop,color,string | undefined,undefined,false,true +ion-searchbar,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-searchbar,prop,debounce,number,250,false,false ion-searchbar,prop,disabled,boolean,false,false,false ion-searchbar,prop,enterkeyhint,"done" | "enter" | "go" | "next" | "previous" | "search" | "send" | undefined,undefined,false,false @@ -1115,7 +1115,7 @@ ion-searchbar,css-prop,--placeholder-font-weight ion-searchbar,css-prop,--placeholder-opacity ion-segment,shadow -ion-segment,prop,color,string | undefined,undefined,false,true +ion-segment,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-segment,prop,disabled,boolean,false,false,false ion-segment,prop,mode,"ios" | "md",undefined,false,false ion-segment,prop,scrollable,boolean,false,false,false @@ -1249,7 +1249,7 @@ ion-slides,css-prop,--scroll-bar-background ion-slides,css-prop,--scroll-bar-background-active ion-spinner,shadow -ion-spinner,prop,color,string | undefined,undefined,false,true +ion-spinner,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-spinner,prop,duration,number | undefined,undefined,false,false ion-spinner,prop,name,"bubbles" | "circles" | "circular" | "crescent" | "dots" | "lines" | "lines-sharp" | "lines-sharp-small" | "lines-small" | undefined,undefined,false,false ion-spinner,prop,paused,boolean,false,false,false @@ -1271,7 +1271,7 @@ ion-tab,prop,tab,string,undefined,true,false ion-tab,method,setActive,setActive() => Promise ion-tab-bar,shadow -ion-tab-bar,prop,color,string | undefined,undefined,false,true +ion-tab-bar,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-tab-bar,prop,mode,"ios" | "md",undefined,false,false ion-tab-bar,prop,selectedTab,string | undefined,undefined,false,false ion-tab-bar,prop,translucent,boolean,false,false,false @@ -1310,7 +1310,7 @@ ion-tabs,event,ionTabsDidChange,{ tab: string; },false ion-tabs,event,ionTabsWillChange,{ tab: string; },false ion-text,shadow -ion-text,prop,color,string | undefined,undefined,false,true +ion-text,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-text,prop,mode,"ios" | "md",undefined,false,false ion-textarea,scoped @@ -1318,7 +1318,7 @@ ion-textarea,prop,autoGrow,boolean,false,false,false ion-textarea,prop,autocapitalize,string,'none',false,false ion-textarea,prop,autofocus,boolean,false,false,false ion-textarea,prop,clearOnEdit,boolean,false,false,false -ion-textarea,prop,color,string | undefined,undefined,false,true +ion-textarea,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-textarea,prop,cols,number | undefined,undefined,false,false ion-textarea,prop,debounce,number,0,false,false ion-textarea,prop,disabled,boolean,false,false,false @@ -1358,14 +1358,14 @@ ion-thumbnail,css-prop,--border-radius ion-thumbnail,css-prop,--size ion-title,shadow -ion-title,prop,color,string | undefined,undefined,false,true +ion-title,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-title,prop,size,"large" | "small" | undefined,undefined,false,false ion-title,css-prop,--color ion-toast,shadow ion-toast,prop,animated,boolean,true,false,false ion-toast,prop,buttons,(string | ToastButton)[] | undefined,undefined,false,false -ion-toast,prop,color,string | undefined,undefined,false,true +ion-toast,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-toast,prop,cssClass,string | string[] | undefined,undefined,false,false ion-toast,prop,duration,number,0,false,false ion-toast,prop,enterAnimation,((baseEl: any, opts?: any) => Animation) | undefined,undefined,false,false @@ -1411,7 +1411,7 @@ ion-toast,part,message ion-toggle,shadow ion-toggle,prop,checked,boolean,false,false,false -ion-toggle,prop,color,string | undefined,undefined,false,true +ion-toggle,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-toggle,prop,disabled,boolean,false,false,false ion-toggle,prop,mode,"ios" | "md",undefined,false,false ion-toggle,prop,name,string,this.inputId,false,false @@ -1435,7 +1435,7 @@ ion-toggle,part,handle ion-toggle,part,track ion-toolbar,shadow -ion-toolbar,prop,color,string | undefined,undefined,false,true +ion-toolbar,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record | undefined,undefined,false,true ion-toolbar,prop,mode,"ios" | "md",undefined,false,false ion-toolbar,css-prop,--background ion-toolbar,css-prop,--border-color diff --git a/core/src/interface.d.ts b/core/src/interface.d.ts index 74ca4b274a..ad929d324e 100644 --- a/core/src/interface.d.ts +++ b/core/src/interface.d.ts @@ -133,7 +133,10 @@ export type PredefinedColors = | 'light' | 'medium' | 'dark'; -export type Color = PredefinedColors | string; + +type LiteralUnion = T | (U & Record); + +export type Color = LiteralUnion; export type Mode = 'ios' | 'md'; export type ComponentTags = string; // eslint-disable-next-line