fds-vue-core 7.1.9 → 7.2.2

package/components.d.ts

@@ -31,6 +31,7 @@ import type { FdsCheckboxProps } from './src/components/Form/FdsCheckbox/types'
 import type { FdsInputProps } from './src/components/Form/FdsInput/types'
 import type { FdsRadioProps } from './src/components/Form/FdsRadio/types'
 import type { FdsSelectProps } from './src/components/Form/FdsSelect/types'
+import type { FdsPhonenumberEmits, FdsPhonenumberProps } from './src/components/Form/FdsPhonenumber/types'
 import type { FdsTextareaEmits, FdsTextareaProps } from './src/components/Form/FdsTextarea/types'
 import type { FdsTableProps } from './src/components/Table/FdsTable/types'
 import type { FdsTableHeadProps } from './src/components/Table/FdsTableHead/types'
@@ -62,6 +63,7 @@ declare module 'vue' {
     FdsInput: DefineComponent<FdsInputProps>
     FdsCheckbox: DefineComponent<FdsCheckboxProps>
     FdsTextarea: DefineComponent<FdsTextareaProps, {}, {}, {}, {}, {}, {}, FdsTextareaEmits>
+    FdsPhonenumber: DefineComponent<FdsPhonenumberProps, {}, {}, {}, {}, {}, {}, FdsPhonenumberEmits>
     FdsSelect: DefineComponent<FdsSelectProps>
     FdsTable: DefineComponent<FdsTableProps>
     FdsTableHead: DefineComponent<FdsTableHeadProps>

package/dist/components/Form/FdsPhonenumber/FdsPhonenumber.stories.d.ts

@@ -0,0 +1,10 @@
+import { Meta, StoryObj } from '@storybook/vue3';
+import { default as FdsPhonenumber } from './FdsPhonenumber.vue';
+declare const meta: Meta<typeof FdsPhonenumber>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const InvalidNumber: Story;
+export declare const AllowAnyNumberType: Story;
+export declare const EnglishLocale: Story;
+export declare const ValidSwedishNumber: Story;

package/dist/components/Form/FdsPhonenumber/FdsPhonenumber.vue.d.ts

@@ -0,0 +1,36 @@
+import { FdsPhonenumberProps } from './types';
+type __VLS_Props = FdsPhonenumberProps;
+type __VLS_PublicProps = {
+    modelValue?: string;
+    'country'?: string;
+} & __VLS_Props;
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    blur: (ev: FocusEvent) => any;
+    valid: (value: boolean | null) => any;
+    "update:modelValue": (value: string) => any;
+    noCountryResults: (value: boolean) => any;
+    "update:country": (...args: unknown[]) => any;
+    "update:e164": (phoneNumber: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onBlur?: ((ev: FocusEvent) => any) | undefined;
+    onValid?: ((value: boolean | null) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onNoCountryResults?: ((value: boolean) => any) | undefined;
+    "onUpdate:country"?: ((...args: unknown[]) => any) | undefined;
+    "onUpdate:e164"?: ((phoneNumber: string) => any) | undefined;
+}>, {
+    disabled: boolean;
+    dataTestid: string;
+    label: string;
+    meta: string;
+    valid: boolean | null;
+    optional: boolean;
+    invalidMessage: string;
+    inputClass: string;
+    locale: string;
+    defaultCountry: string;
+    countries: import('./countries').CountryPhoneOption[];
+    numberType: import('./types').FdsPhonenumberNumberType;
+    selectClass: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/Form/FdsPhonenumber/FdsPhonenumberCountryPicker.vue.d.ts

@@ -0,0 +1,30 @@
+import { HTMLAttributes } from 'vue';
+import { CountryPhoneOption } from './countries';
+type __VLS_Props = {
+    items: CountryPhoneOption[];
+    valid?: boolean | null;
+    disabled?: boolean;
+    ariaLabel?: string;
+    dataTestid?: string;
+    class?: HTMLAttributes['class'];
+};
+type __VLS_PublicProps = {
+    modelValue: string;
+} & __VLS_Props;
+declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+    noCountryResults: (value: boolean) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onNoCountryResults?: ((value: boolean) => any) | undefined;
+}>, {
+    disabled: boolean;
+    dataTestid: string;
+    class: string | false | Record<string, any> | import('vue').ClassValue[] | null;
+    valid: boolean | null;
+    ariaLabel: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    rootRef: HTMLDivElement;
+    inputRef: HTMLInputElement;
+}, HTMLDivElement>;
+export default _default;

package/dist/components/Form/FdsPhonenumber/countries.d.ts

@@ -0,0 +1,14 @@
+export interface CountryPhoneOption {
+    value: string;
+    label: string;
+    countryCode: string;
+    countryName: string;
+}
+export declare const PRIORITIZED_COUNTRIES: readonly ["SE", "NO", "DK", "FI"];
+export declare function isPrioritizedCountry(iso2: string): boolean;
+export declare function sortCountryOptionsByName(options: CountryPhoneOption[], locale?: string, _preferredCountry?: string): CountryPhoneOption[];
+/** Country options for phone fields; SE/NO/DK/FI first, then alphabetical by name. */
+export declare function buildCountryOptions(locale?: string, preferredCountry?: string): CountryPhoneOption[];
+/** ISO 3166-1 alpha-2 to regional indicator flag emoji, e.g. `SE` → 🇸🇪 */
+export declare function countryCodeToFlag(iso2: string): string;
+export declare function filterCountryOptions(options: CountryPhoneOption[], query: string): CountryPhoneOption[];

package/dist/components/Form/FdsPhonenumber/types.d.ts

@@ -0,0 +1,36 @@
+import { CountryPhoneOption } from './countries';
+/**
+ * `mobile` – mobile numbers only (Google libphonenumber metadata).
+ * `any` – mobile and fixed-line numbers.
+ */
+export type FdsPhonenumberNumberType = 'mobile' | 'any';
+export interface FdsPhonenumberProps {
+    label?: string;
+    meta?: string;
+    optional?: boolean;
+    valid?: boolean | null;
+    invalidMessage?: string;
+    /** National number (without country calling code). */
+    modelValue?: string;
+    /** ISO 3166-1 alpha-2 country code, e.g. `SE`. */
+    country?: string;
+    /** ISO2 code shown first in the country select. */
+    defaultCountry?: string;
+    /** Override built-in country list (default from libphonenumber-js). */
+    countries?: CountryPhoneOption[];
+    /** BCP 47 locale for country names in the list, e.g. `sv-SE` or `en`. Falls back to FDS i18n locale. */
+    locale?: string;
+    /** Which number types are accepted when validating with libphonenumber-js. */
+    numberType?: FdsPhonenumberNumberType;
+    disabled?: boolean;
+    dataTestid?: string;
+    selectClass?: string;
+    inputClass?: string;
+}
+export interface FdsPhonenumberEmits {
+    'update:country': [country: string];
+    'update:e164': [phoneNumber: string];
+    valid: [value: boolean | null];
+    noCountryResults: [value: boolean];
+    blur: [ev: FocusEvent];
+}

package/dist/components/Form/FdsPhonenumber/validatePhone.d.ts

@@ -0,0 +1,16 @@
+import { FdsPhonenumberNumberType } from './types';
+interface ValidatePhoneOptions {
+    numberType?: FdsPhonenumberNumberType;
+}
+/** Result shape kept stable for consumers (same fields as previous `phone` package integration). */
+export interface PhoneValidationResult {
+    isValid: boolean;
+    phoneNumber: string | null;
+    countryIso2: string | null;
+    countryIso3: string | null;
+    countryCode: string | null;
+}
+export declare function validatePhoneNumber(nationalNumber: string, countryIso2: string, options?: ValidatePhoneOptions): PhoneValidationResult;
+/** `null` when empty, otherwise whether the number is valid for the selected country. */
+export declare function getPhoneValidationState(nationalNumber: string, countryIso2: string, options?: ValidatePhoneOptions): boolean | null;
+export {};

package/dist/composables/useIsPid.d.ts

@@ -1,10 +1,21 @@
 import { Ref } from 'vue';
+/** Strip separators; keep digits and letters (suffix may contain letters). */
+export declare function normalizePidSearchValue(value: string): string;
 /**
  * Check if a string looks like a personnummer (Swedish personal identity number)
  * @param value - String value to check
  * @returns Boolean indicating if the value looks like a personnummer
  */
 export declare function isPidString(value: string): boolean;
+/** Format as yyyymmdd-nnnn; last four may be alphanumeric (e.g. coordination numbers). */
+export declare function formatPidWithDash(value: string): string;
+export declare const PID_MASK = "00000000-XXXX";
+export declare const PID_MASK_OPTIONS: {
+    readonly lazy: true;
+    readonly definitions: {
+        readonly X: RegExp;
+    };
+};
 /**
  * Composable for detecting if a string looks like a personnummer (Swedish personal identity number)
  * @param value - Reactive string value to check (Ref<string>)