quasar 2.10.2 → 2.11.0

package/dist/types/index.d.ts

@@ -1139,6 +1139,196 @@ export interface QBreadcrumbsElSlots {
 export interface QBreadcrumbsEl
   extends ComponentPublicInstance<QBreadcrumbsElProps> {}
 
+export interface QBtnProps {
+  /**
+   * Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)
+   */
+  size?: string | undefined;
+  /**
+   * 1) Define the button native type attribute (submit, reset, button) or 2) render component with <a> tag so you can access events even if disable or 3) Use 'href' prop and specify 'type' as a media tag
+   * Default value: button
+   */
+  type?: string | undefined;
+  /**
+   * Equivalent to Vue Router <router-link> 'to' property; Superseded by 'href' prop if used
+   */
+  to?: string | any | undefined;
+  /**
+   * Equivalent to Vue Router <router-link> 'replace' property; Superseded by 'href' prop if used
+   */
+  replace?: boolean | undefined;
+  /**
+   * Native <a> link href attribute; Has priority over the 'to' and 'replace' props
+   */
+  href?: string | undefined;
+  /**
+   * Native <a> link target attribute; Use it only with 'to' or 'href' props
+   */
+  target?: string | undefined;
+  /**
+   * The text that will be shown on the button
+   */
+  label?: string | number | undefined;
+  /**
+   * Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix; If 'none' (String) is used as value then no icon is rendered (but screen real estate will still be used for it)
+   */
+  icon?: string | undefined;
+  /**
+   * Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix; If 'none' (String) is used as value then no icon is rendered (but screen real estate will still be used for it)
+   */
+  iconRight?: string | undefined;
+  /**
+   * Use 'outline' design
+   */
+  outline?: boolean | undefined;
+  /**
+   * Use 'flat' design
+   */
+  flat?: boolean | undefined;
+  /**
+   * Remove shadow
+   */
+  unelevated?: boolean | undefined;
+  /**
+   * Applies a more prominent border-radius for a squared shape button
+   */
+  rounded?: boolean | undefined;
+  /**
+   * Use 'push' design
+   */
+  push?: boolean | undefined;
+  /**
+   * Removes border-radius so borders are squared
+   */
+  square?: boolean | undefined;
+  /**
+   * Applies a glossy effect
+   */
+  glossy?: boolean | undefined;
+  /**
+   * Makes button size and shape to fit a Floating Action Button
+   */
+  fab?: boolean | undefined;
+  /**
+   * Makes button size and shape to fit a small Floating Action Button
+   */
+  fabMini?: boolean | undefined;
+  /**
+   * Apply custom padding (vertical [horizontal]); Size in CSS units, including unit name or standard size name (none|xs|sm|md|lg|xl); Also removes the min width and height when set
+   */
+  padding?: string | undefined;
+  /**
+   * Color name for component from the Quasar Color Palette
+   */
+  color?: string | undefined;
+  /**
+   * Overrides text color (if needed); Color name from the Quasar Color Palette
+   */
+  textColor?: string | undefined;
+  /**
+   * Avoid turning label text into caps (which happens by default)
+   */
+  noCaps?: boolean | undefined;
+  /**
+   * Avoid label text wrapping
+   */
+  noWrap?: boolean | undefined;
+  /**
+   * Dense mode; occupies less space
+   */
+  dense?: boolean | undefined;
+  /**
+   * Configure material ripple (disable it by setting it to 'false' or supply a config object)
+   * Default value: true
+   */
+  ripple?: boolean | any | undefined;
+  /**
+   * Tabindex HTML attribute value
+   */
+  tabindex?: number | string | undefined;
+  /**
+   * Label or content alignment
+   * Default value: center
+   */
+  align?:
+    | "left"
+    | "right"
+    | "center"
+    | "around"
+    | "between"
+    | "evenly"
+    | undefined;
+  /**
+   * Stack icon and label vertically instead of on same line (like it is by default)
+   */
+  stack?: boolean | undefined;
+  /**
+   * When used on flexbox parent, button will stretch to parent's height
+   */
+  stretch?: boolean | undefined;
+  /**
+   * Put button into loading state (displays a QSpinner -- can be overridden by using a 'loading' slot)
+   */
+  loading?: boolean | undefined;
+  /**
+   * Put component in disabled mode
+   */
+  disable?: boolean | undefined;
+  /**
+   * Makes a circle shaped button
+   */
+  round?: boolean | undefined;
+  /**
+   * Percentage (0.0 < x < 100.0); To be used along 'loading' prop; Display a progress bar on the background
+   */
+  percentage?: number | undefined;
+  /**
+   * Progress bar on the background should have dark color; To be used along with 'percentage' and 'loading' props
+   */
+  darkPercentage?: boolean | undefined;
+  /**
+   * Emitted when the component is clicked
+   * @param evt JS event object; If you are using route navigation ('to'/'replace' props) and you want to cancel navigation then call evt.preventDefault() synchronously in your event handler
+   * @param go Available ONLY if you are using route navigation ('to'/'replace' props); When you need to control the time at which the component should trigger the route navigation then call evt.preventDefault() synchronously and then call this function at your convenience; Useful if you have async work to be done before the actual route navigation or if you want to redirect somewhere else
+   */
+  onClick?: (
+    evt: Event,
+    go?: (opts?: {
+      /**
+       * Equivalent to Vue Router <router-link> 'to' property; Specify it explicitly otherwise it will be set with same value as component's 'to' prop
+       */
+      to?: string | any;
+      /**
+       * Equivalent to Vue Router <router-link> 'replace' property; Specify it explicitly otherwise it will be set with same value as component's 'replace' prop
+       */
+      replace?: boolean;
+      /**
+       * Return the router error, if any; Otherwise the returned Promise will always fulfill
+       */
+      returnRouterError?: boolean;
+    }) => Promise<any>
+  ) => void;
+}
+
+export interface QBtnSlots {
+  /**
+   * Use for custom content, instead of relying on 'icon' and 'label' props
+   */
+  default: () => VNode[];
+  /**
+   * Override the default QSpinner when in 'loading' state
+   */
+  loading: () => VNode[];
+}
+
+export interface QBtn extends ComponentPublicInstance<QBtnProps> {
+  /**
+   * Emulate click on QBtn
+   * @param evt JS event object
+   */
+  click: (evt?: Event) => void;
+}
+
 export interface QBtnDropdownProps {
   /**
    * One of Quasar's embedded transitions
@@ -1653,196 +1843,6 @@ export interface QBtnToggleSlots {
 
 export interface QBtnToggle extends ComponentPublicInstance<QBtnToggleProps> {}
 
-export interface QBtnProps {
-  /**
-   * Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)
-   */
-  size?: string | undefined;
-  /**
-   * 1) Define the button native type attribute (submit, reset, button) or 2) render component with <a> tag so you can access events even if disable or 3) Use 'href' prop and specify 'type' as a media tag
-   * Default value: button
-   */
-  type?: string | undefined;
-  /**
-   * Equivalent to Vue Router <router-link> 'to' property; Superseded by 'href' prop if used
-   */
-  to?: string | any | undefined;
-  /**
-   * Equivalent to Vue Router <router-link> 'replace' property; Superseded by 'href' prop if used
-   */
-  replace?: boolean | undefined;
-  /**
-   * Native <a> link href attribute; Has priority over the 'to' and 'replace' props
-   */
-  href?: string | undefined;
-  /**
-   * Native <a> link target attribute; Use it only with 'to' or 'href' props
-   */
-  target?: string | undefined;
-  /**
-   * The text that will be shown on the button
-   */
-  label?: string | number | undefined;
-  /**
-   * Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix; If 'none' (String) is used as value then no icon is rendered (but screen real estate will still be used for it)
-   */
-  icon?: string | undefined;
-  /**
-   * Icon name following Quasar convention; Make sure you have the icon library installed unless you are using 'img:' prefix; If 'none' (String) is used as value then no icon is rendered (but screen real estate will still be used for it)
-   */
-  iconRight?: string | undefined;
-  /**
-   * Use 'outline' design
-   */
-  outline?: boolean | undefined;
-  /**
-   * Use 'flat' design
-   */
-  flat?: boolean | undefined;
-  /**
-   * Remove shadow
-   */
-  unelevated?: boolean | undefined;
-  /**
-   * Applies a more prominent border-radius for a squared shape button
-   */
-  rounded?: boolean | undefined;
-  /**
-   * Use 'push' design
-   */
-  push?: boolean | undefined;
-  /**
-   * Removes border-radius so borders are squared
-   */
-  square?: boolean | undefined;
-  /**
-   * Applies a glossy effect
-   */
-  glossy?: boolean | undefined;
-  /**
-   * Makes button size and shape to fit a Floating Action Button
-   */
-  fab?: boolean | undefined;
-  /**
-   * Makes button size and shape to fit a small Floating Action Button
-   */
-  fabMini?: boolean | undefined;
-  /**
-   * Apply custom padding (vertical [horizontal]); Size in CSS units, including unit name or standard size name (none|xs|sm|md|lg|xl); Also removes the min width and height when set
-   */
-  padding?: string | undefined;
-  /**
-   * Color name for component from the Quasar Color Palette
-   */
-  color?: string | undefined;
-  /**
-   * Overrides text color (if needed); Color name from the Quasar Color Palette
-   */
-  textColor?: string | undefined;
-  /**
-   * Avoid turning label text into caps (which happens by default)
-   */
-  noCaps?: boolean | undefined;
-  /**
-   * Avoid label text wrapping
-   */
-  noWrap?: boolean | undefined;
-  /**
-   * Dense mode; occupies less space
-   */
-  dense?: boolean | undefined;
-  /**
-   * Configure material ripple (disable it by setting it to 'false' or supply a config object)
-   * Default value: true
-   */
-  ripple?: boolean | any | undefined;
-  /**
-   * Tabindex HTML attribute value
-   */
-  tabindex?: number | string | undefined;
-  /**
-   * Label or content alignment
-   * Default value: center
-   */
-  align?:
-    | "left"
-    | "right"
-    | "center"
-    | "around"
-    | "between"
-    | "evenly"
-    | undefined;
-  /**
-   * Stack icon and label vertically instead of on same line (like it is by default)
-   */
-  stack?: boolean | undefined;
-  /**
-   * When used on flexbox parent, button will stretch to parent's height
-   */
-  stretch?: boolean | undefined;
-  /**
-   * Put button into loading state (displays a QSpinner -- can be overridden by using a 'loading' slot)
-   */
-  loading?: boolean | undefined;
-  /**
-   * Put component in disabled mode
-   */
-  disable?: boolean | undefined;
-  /**
-   * Makes a circle shaped button
-   */
-  round?: boolean | undefined;
-  /**
-   * Percentage (0.0 < x < 100.0); To be used along 'loading' prop; Display a progress bar on the background
-   */
-  percentage?: number | undefined;
-  /**
-   * Progress bar on the background should have dark color; To be used along with 'percentage' and 'loading' props
-   */
-  darkPercentage?: boolean | undefined;
-  /**
-   * Emitted when the component is clicked
-   * @param evt JS event object; If you are using route navigation ('to'/'replace' props) and you want to cancel navigation then call evt.preventDefault() synchronously in your event handler
-   * @param go Available ONLY if you are using route navigation ('to'/'replace' props); When you need to control the time at which the component should trigger the route navigation then call evt.preventDefault() synchronously and then call this function at your convenience; Useful if you have async work to be done before the actual route navigation or if you want to redirect somewhere else
-   */
-  onClick?: (
-    evt: Event,
-    go?: (opts?: {
-      /**
-       * Equivalent to Vue Router <router-link> 'to' property; Specify it explicitly otherwise it will be set with same value as component's 'to' prop
-       */
-      to?: string | any;
-      /**
-       * Equivalent to Vue Router <router-link> 'replace' property; Specify it explicitly otherwise it will be set with same value as component's 'replace' prop
-       */
-      replace?: boolean;
-      /**
-       * Return the router error, if any; Otherwise the returned Promise will always fulfill
-       */
-      returnRouterError?: boolean;
-    }) => Promise<any>
-  ) => void;
-}
-
-export interface QBtnSlots {
-  /**
-   * Use for custom content, instead of relying on 'icon' and 'label' props
-   */
-  default: () => VNode[];
-  /**
-   * Override the default QSpinner when in 'loading' state
-   */
-  loading: () => VNode[];
-}
-
-export interface QBtn extends ComponentPublicInstance<QBtnProps> {
-  /**
-   * Emulate click on QBtn
-   * @param evt JS event object
-   */
-  click: (evt?: Event) => void;
-}
-
 export interface QCardProps {
   /**
    * Notify the component that the background is a dark color
@@ -4669,7 +4669,7 @@ export interface QFile extends ComponentPublicInstance<QFileProps> {
    * DEPRECATED; Access 'nativeEl' directly; Gets the native input DOM Element
    * @returns The underlying native input DOM Element
    */
-  getNativeElement: () => Element;
+  getNativeElement: () => QFileNativeElement;
   /**
    * Whether the component is in error state
    */
@@ -4677,7 +4677,7 @@ export interface QFile extends ComponentPublicInstance<QFileProps> {
   /**
    * The native input DOM Element
    */
-  readonly nativeEl: Element;
+  readonly nativeEl: QFileNativeElement;
 }
 
 export interface QFooterProps {
@@ -5467,7 +5467,7 @@ export interface QInput extends ComponentPublicInstance<QInputProps> {
    * DEPRECATED; Access 'nativeEl' directly instead; Get the native input/textarea DOM Element
    * @returns The underlying native input/textarea DOM Element
    */
-  getNativeElement: () => Element;
+  getNativeElement: () => QInputNativeElement;
   /**
    * Whether the component is in error state
    */
@@ -5475,7 +5475,7 @@ export interface QInput extends ComponentPublicInstance<QInputProps> {
   /**
    * The native input/textarea DOM Element
    */
-  readonly nativeEl: Element;
+  readonly nativeEl: QInputNativeElement;
 }
 
 export interface QIntersectionProps {
@@ -6371,6 +6371,42 @@ export interface QOptionGroupSlots {
 export interface QOptionGroup
   extends ComponentPublicInstance<QOptionGroupProps> {}
 
+export interface QPageProps {
+  /**
+   * Applies a default responsive page padding
+   */
+  padding?: boolean | undefined;
+  /**
+   * Override default CSS style applied to the component (sets minHeight); Function(offset: Number) => CSS props/value: Object; For best performance, reference it from your scope and do not define it inline
+   * Default value: (see source code)
+   * @param offset Header + Footer height (in pixels)
+   * @param height Value in pixels of container height (if containerized) or window height otherwise
+   * @returns Object with CSS properties to apply to Page DOM element
+   */
+  styleFn?: ((offset: number, height: number) => any) | undefined;
+}
+
+export interface QPageSlots {
+  /**
+   * Default slot in the devland unslotted content of the component
+   */
+  default: () => VNode[];
+}
+
+export interface QPage extends ComponentPublicInstance<QPageProps> {}
+
+export interface QPageContainerProps {}
+
+export interface QPageContainerSlots {
+  /**
+   * Encapsulates a QPage (either directly or through <router-view>)
+   */
+  default: () => VNode[];
+}
+
+export interface QPageContainer
+  extends ComponentPublicInstance<QPageContainerProps> {}
+
 export interface QPageScrollerProps {
   /**
    * Page side/corner to stick to
@@ -6456,42 +6492,6 @@ export interface QPageStickySlots {
 export interface QPageSticky
   extends ComponentPublicInstance<QPageStickyProps> {}
 
-export interface QPageProps {
-  /**
-   * Applies a default responsive page padding
-   */
-  padding?: boolean | undefined;
-  /**
-   * Override default CSS style applied to the component (sets minHeight); Function(offset: Number) => CSS props/value: Object; For best performance, reference it from your scope and do not define it inline
-   * Default value: (see source code)
-   * @param offset Header + Footer height (in pixels)
-   * @param height Value in pixels of container height (if containerized) or window height otherwise
-   * @returns Object with CSS properties to apply to Page DOM element
-   */
-  styleFn?: ((offset: number, height: number) => any) | undefined;
-}
-
-export interface QPageSlots {
-  /**
-   * Default slot in the devland unslotted content of the component
-   */
-  default: () => VNode[];
-}
-
-export interface QPage extends ComponentPublicInstance<QPageProps> {}
-
-export interface QPageContainerProps {}
-
-export interface QPageContainerSlots {
-  /**
-   * Encapsulates a QPage (either directly or through <router-view>)
-   */
-  default: () => VNode[];
-}
-
-export interface QPageContainer
-  extends ComponentPublicInstance<QPageContainerProps> {}
-
 export interface QPaginationProps {
   /**
    * Current page (must be between min/max)
@@ -13676,6 +13676,8 @@ import { VueStyleObjectProp } from "./api";
 import { QEditorCaret } from "./api";
 import { ValidationRule } from "./api";
 import { QRejectedEntry } from "./api";
+import { QFileNativeElement } from "./api";
+import { QInputNativeElement } from "./api";
 import { QPopupProxyInnerComponent } from "./api";
 import { SliderMarkerLabels } from "./api";
 import { SliderMarkerLabelConfig } from "./api";
@@ -13806,13 +13808,13 @@ declare module "@vue/runtime-core" {
       QBreadcrumbsElProps,
       QBreadcrumbsElSlots
     >;
+    QBtn: GlobalComponentConstructor<QBtnProps, QBtnSlots>;
     QBtnDropdown: GlobalComponentConstructor<
       QBtnDropdownProps,
       QBtnDropdownSlots
     >;
     QBtnGroup: GlobalComponentConstructor<QBtnGroupProps, QBtnGroupSlots>;
     QBtnToggle: GlobalComponentConstructor<QBtnToggleProps, QBtnToggleSlots>;
-    QBtn: GlobalComponentConstructor<QBtnProps, QBtnSlots>;
     QCard: GlobalComponentConstructor<QCardProps, QCardSlots>;
     QCardActions: GlobalComponentConstructor<
       QCardActionsProps,
@@ -13899,16 +13901,16 @@ declare module "@vue/runtime-core" {
       QOptionGroupProps,
       QOptionGroupSlots
     >;
-    QPageScroller: GlobalComponentConstructor<
-      QPageScrollerProps,
-      QPageScrollerSlots
-    >;
-    QPageSticky: GlobalComponentConstructor<QPageStickyProps, QPageStickySlots>;
     QPage: GlobalComponentConstructor<QPageProps, QPageSlots>;
     QPageContainer: GlobalComponentConstructor<
       QPageContainerProps,
       QPageContainerSlots
     >;
+    QPageScroller: GlobalComponentConstructor<
+      QPageScrollerProps,
+      QPageScrollerSlots
+    >;
+    QPageSticky: GlobalComponentConstructor<QPageStickyProps, QPageStickySlots>;
     QPagination: GlobalComponentConstructor<QPaginationProps, QPaginationSlots>;
     QParallax: GlobalComponentConstructor<QParallaxProps, QParallaxSlots>;
     QPopupEdit: GlobalComponentConstructor<QPopupEditProps, QPopupEditSlots>;
@@ -14094,10 +14096,10 @@ declare module "./lang" {
     is: true;
     it: true;
     ja: true;
+    kz: true;
     km: true;
     "ko-KR": true;
     "kur-CKB": true;
-    kz: true;
     lt: true;
     lu: true;
     lv: true;
@@ -14174,10 +14176,10 @@ export const QBanner: ComponentConstructor<QBanner>;
 export const QBar: ComponentConstructor<QBar>;
 export const QBreadcrumbs: ComponentConstructor<QBreadcrumbs>;
 export const QBreadcrumbsEl: ComponentConstructor<QBreadcrumbsEl>;
+export const QBtn: ComponentConstructor<QBtn>;
 export const QBtnDropdown: ComponentConstructor<QBtnDropdown>;
 export const QBtnGroup: ComponentConstructor<QBtnGroup>;
 export const QBtnToggle: ComponentConstructor<QBtnToggle>;
-export const QBtn: ComponentConstructor<QBtn>;
 export const QCard: ComponentConstructor<QCard>;
 export const QCardActions: ComponentConstructor<QCardActions>;
 export const QCardSection: ComponentConstructor<QCardSection>;
@@ -14219,10 +14221,10 @@ export const QMarkupTable: ComponentConstructor<QMarkupTable>;
 export const QMenu: ComponentConstructor<QMenu>;
 export const QNoSsr: ComponentConstructor<QNoSsr>;
 export const QOptionGroup: ComponentConstructor<QOptionGroup>;
-export const QPageScroller: ComponentConstructor<QPageScroller>;
-export const QPageSticky: ComponentConstructor<QPageSticky>;
 export const QPage: ComponentConstructor<QPage>;
 export const QPageContainer: ComponentConstructor<QPageContainer>;
+export const QPageScroller: ComponentConstructor<QPageScroller>;
+export const QPageSticky: ComponentConstructor<QPageSticky>;
 export const QPagination: ComponentConstructor<QPagination>;
 export const QParallax: ComponentConstructor<QParallax>;
 export const QPopupEdit: ComponentConstructor<QPopupEdit>;
@@ -14300,10 +14302,10 @@ declare module "./plugin" {
     QBar?: ComponentConstructor<QBar>;
     QBreadcrumbs?: ComponentConstructor<QBreadcrumbs>;
     QBreadcrumbsEl?: ComponentConstructor<QBreadcrumbsEl>;
+    QBtn?: ComponentConstructor<QBtn>;
     QBtnDropdown?: ComponentConstructor<QBtnDropdown>;
     QBtnGroup?: ComponentConstructor<QBtnGroup>;
     QBtnToggle?: ComponentConstructor<QBtnToggle>;
-    QBtn?: ComponentConstructor<QBtn>;
     QCard?: ComponentConstructor<QCard>;
     QCardActions?: ComponentConstructor<QCardActions>;
     QCardSection?: ComponentConstructor<QCardSection>;
@@ -14345,10 +14347,10 @@ declare module "./plugin" {
     QMenu?: ComponentConstructor<QMenu>;
     QNoSsr?: ComponentConstructor<QNoSsr>;
     QOptionGroup?: ComponentConstructor<QOptionGroup>;
-    QPageScroller?: ComponentConstructor<QPageScroller>;
-    QPageSticky?: ComponentConstructor<QPageSticky>;
     QPage?: ComponentConstructor<QPage>;
     QPageContainer?: ComponentConstructor<QPageContainer>;
+    QPageScroller?: ComponentConstructor<QPageScroller>;
+    QPageSticky?: ComponentConstructor<QPageSticky>;
     QPagination?: ComponentConstructor<QPagination>;
     QParallax?: ComponentConstructor<QParallax>;
     QPopupEdit?: ComponentConstructor<QPopupEdit>;