@sabrenski/spire-ui-vue 0.3.0 → 0.3.1

package/README.md

@@ -99,8 +99,8 @@ app.use(SpireUI, {
     },
     // Badge component
     badge: {
-      variant: 'solid',   // 'solid' | 'flat' | 'faded' | 'outline'
-      color: 'default',   // 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger'
+      variant: 'solid',   // 'solid' | 'flat' | 'outline'
+      color: 'default',   // 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info'
       size: 'md',         // 'sm' | 'md' | 'lg'
     },
     // Avatar component
@@ -308,8 +308,8 @@ import { useToast, useRovingFocus, useVirtualScroll, useComponentDefault } from
 | Prop | Type | Default | Description |
 |------|------|---------|-------------|
 | `content` | `string \| number` | - | Badge content |
-| `variant` | `'solid' \| 'flat' \| 'faded' \| 'outline'` | `'solid'` | Visual style |
-| `color` | `'default' \| 'primary' \| 'secondary' \| 'success' \| 'warning' \| 'danger'` | `'default'` | Color |
+| `variant` | `'solid' \| 'flat' \| 'outline'` | `'solid'` | Visual style |
+| `color` | `'default' \| 'primary' \| 'secondary' \| 'success' \| 'warning' \| 'danger' \| 'info'` | `'default'` | Color |
 | `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Size |
 | `dot` | `boolean` | `false` | Show as dot |
 

package/dist/components/Autocomplete/Autocomplete.vue.d.ts

@@ -33,6 +33,7 @@ declare const __VLS_component: import('vue').DefineComponent<AutocompleteProps,
 }>, {
     multiple: boolean;
     disabled: boolean;
+    placement: import('../..').Placement;
     loading: boolean;
     placeholder: string;
     invalid: boolean;
@@ -45,6 +46,7 @@ declare const __VLS_component: import('vue').DefineComponent<AutocompleteProps,
     maxChips: number;
     emptyMessage: string;
     loadingMessage: string;
+    strategy: "absolute" | "fixed";
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     inputRef: HTMLInputElement;
 }, any>;

package/dist/components/Autocomplete/types.d.ts

@@ -1,4 +1,5 @@
 import { InjectionKey, Ref, Component } from 'vue';
+import { Placement } from '../../composables';
 export type AutocompleteSize = 'sm' | 'md' | 'lg';
 export type AutocompleteVariant = 'outline' | 'filled' | 'underline';
 export interface AutocompleteOptionData {
@@ -51,6 +52,10 @@ export interface AutocompleteProps {
     emptyMessage?: string;
     /** Message while loading */
     loadingMessage?: string;
+    /** Placement of the dropdown relative to the trigger */
+    placement?: Placement;
+    /** Positioning strategy for the dropdown */
+    strategy?: 'absolute' | 'fixed';
 }
 export interface AutocompleteOptionProps {
     value: string;

package/dist/components/Badge/types.d.ts

@@ -1,6 +1,6 @@
 import { Component } from 'vue';
-export type BadgeVariant = 'solid' | 'flat' | 'faded' | 'outline';
-export type BadgeColor = 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger';
+export type BadgeVariant = 'solid' | 'flat' | 'outline';
+export type BadgeColor = 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info';
 export type BadgeSize = 'sm' | 'md' | 'lg';
 export type BadgeShape = 'circle' | 'rectangle';
 export type BadgePlacement = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';

package/dist/components/DatePicker/DatePicker.vue.d.ts

@@ -10,9 +10,11 @@ declare const _default: import('vue').DefineComponent<DatePickerProps, {}, {}, {
     size: DatePickerSize;
     variant: DatePickerVariant;
     disabled: boolean;
+    placement: import('../..').Placement;
     placeholder: string;
     clearable: boolean;
     readonly: boolean;
+    strategy: "absolute" | "fixed";
     locale: string;
     mode: import('..').CalendarMode;
     firstDayOfWeek: 0 | 1;

package/dist/components/DatePicker/types.d.ts

@@ -1,4 +1,5 @@
 import { CalendarMode, DateRange, DateRangePreset } from '../Calendar/types';
+import { Placement } from '../../composables';
 export type DatePickerSize = 'sm' | 'md' | 'lg';
 export type DatePickerVariant = 'outline' | 'filled' | 'underline';
 export interface DatePickerProps {
@@ -38,4 +39,8 @@ export interface DatePickerProps {
     firstDayOfWeek?: 0 | 1;
     /** Locale for formatting */
     locale?: string;
+    /** Placement of the dropdown relative to the trigger */
+    placement?: Placement;
+    /** Positioning strategy for the dropdown */
+    strategy?: 'absolute' | 'fixed';
 }

package/dist/components/LineChart/LineChartTooltip.vue.d.ts

@@ -1,10 +1,12 @@
 import { LineChartTooltipData } from './types';
 export interface LineChartTooltipProps {
     data: LineChartTooltipData;
+    /** X position relative to container */
     x: number;
+    /** Y position relative to container */
     y: number;
-    containerWidth: number;
-    containerHeight: number;
+    /** Container's bounding rect for viewport positioning */
+    containerRect: DOMRect;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -18,10 +20,10 @@ declare function __VLS_template(): {
         }): any;
     };
     refs: {};
-    rootEl: HTMLDivElement;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import('vue').DefineComponent<LineChartTooltipProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<LineChartTooltipProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const __VLS_component: import('vue').DefineComponent<LineChartTooltipProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<LineChartTooltipProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/PhoneInput/PhoneInput.vue.d.ts

@@ -18,10 +18,12 @@ declare const _default: import('vue').DefineComponent<PhoneInputProps, {
     size: PhoneInputSize;
     variant: PhoneInputVariant;
     disabled: boolean;
+    placement: import('../..').Placement;
     placeholder: string;
     invalid: boolean;
     readonly: boolean;
     debounceMs: number;
+    strategy: "absolute" | "fixed";
     defaultCountry: string;
     searchPlaceholder: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {

package/dist/components/PhoneInput/types.d.ts

@@ -1,4 +1,5 @@
 import { InjectionKey, Ref } from 'vue';
+import { Placement } from '../../composables';
 export type PhoneInputSize = 'sm' | 'md' | 'lg';
 export type PhoneInputVariant = 'outline' | 'filled' | 'underline';
 export interface PhoneInputValue {
@@ -44,6 +45,10 @@ export interface PhoneInputProps {
     searchPlaceholder?: string;
     /** Debounce delay for search input in milliseconds */
     debounceMs?: number;
+    /** Placement of the dropdown relative to the trigger */
+    placement?: Placement;
+    /** Positioning strategy for the dropdown */
+    strategy?: 'absolute' | 'fixed';
 }
 export interface PhoneInputCountryProps {
     /** Country data to display */

package/dist/components/Select/Select.vue.d.ts

@@ -114,6 +114,7 @@ declare const __VLS_component: import('vue').DefineComponent<SelectProps, {}, {}
 }>, {
     multiple: boolean;
     disabled: boolean;
+    placement: import('../..').Placement;
     loading: boolean;
     placeholder: string;
     invalid: boolean;
@@ -121,6 +122,7 @@ declare const __VLS_component: import('vue').DefineComponent<SelectProps, {}, {}
     chips: boolean;
     maxChips: number;
     emptyMessage: string;
+    strategy: "absolute" | "fixed";
     searchable: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     searchInputRef: ({

package/dist/components/Select/types.d.ts

@@ -1,4 +1,5 @@
 import { InjectionKey, Ref, Component } from 'vue';
+import { Placement } from '../../composables';
 export type SelectSize = 'xs' | 'sm' | 'md' | 'lg';
 export type SelectVariant = 'outline' | 'filled' | 'underline';
 export interface SelectOptionData {
@@ -24,6 +25,10 @@ export interface SelectProps {
     filterFn?: (query: string, option: SelectOptionData) => boolean;
     loading?: boolean;
     emptyMessage?: string;
+    /** Placement of the dropdown relative to the trigger */
+    placement?: Placement;
+    /** Positioning strategy for the dropdown */
+    strategy?: 'absolute' | 'fixed';
 }
 export interface SelectOptionProps {
     value: string;

package/dist/components/TimeInput/TimeInput.vue.d.ts

@@ -11,10 +11,12 @@ declare const _default: import('vue').DefineComponent<TimeInputProps, {}, {}, {}
     size: TimeInputSize;
     variant: TimeInputVariant;
     disabled: boolean;
+    placement: import('../..').Placement;
     placeholder: string;
     invalid: boolean;
     clearable: boolean;
     readonly: boolean;
+    strategy: "absolute" | "fixed";
     mode: import('./types').TimeInputMode;
     format: import('./types').TimeInputFormat;
     showSeconds: boolean;

package/dist/components/TimeInput/types.d.ts

@@ -1,3 +1,4 @@
+import { Placement } from '../../composables';
 export type TimeInputSize = 'sm' | 'md' | 'lg';
 export type TimeInputVariant = 'outline' | 'filled' | 'underline';
 export type TimeInputFormat = '12' | '24';
@@ -39,6 +40,10 @@ export interface TimeInputProps {
     invalid?: boolean;
     /** Show clear button */
     clearable?: boolean;
+    /** Placement of the dropdown relative to the trigger */
+    placement?: Placement;
+    /** Positioning strategy for the dropdown */
+    strategy?: 'absolute' | 'fixed';
 }
 export interface TimeInputColumnsProps {
     /** Selected hour (1-12 for 12h, 0-23 for 24h) */