@webitel/ui-sdk 26.6.17 → 26.6.19

package/src/modules/ObjectPermissions/_internals/components/permissions-role-select.vue

@@ -1,23 +1,22 @@
 <template>
-  <wt-select
+  <wt-single-select
     class="permissions-role-select"
     option-label="name"
     v-bind="attrs"
-    :value="model"
-    @input="model = $event"
+    v-model:model-value="model"
   >
-    <template #singleLabel="{ option, optionLabel }">
-      <role-row :role="option">
-        {{ option[optionLabel] || option }}
+    <template #value="{ value, getOptionLabel }">
+      <role-row :role="value">
+        {{ getOptionLabel(value) || value }}
       </role-row>
     </template>
 
-    <template #option="{ option, optionLabel }">
+    <template #option="{ option, getOptionLabel }">
       <role-row :role="option">
-        {{ option[optionLabel] || option }}
+        {{ getOptionLabel(option) || option }}
       </role-row>
     </template>
-  </wt-select>
+  </wt-single-select>
 </template>
 
 <script setup>

package/src/modules/ObjectPermissions/components/permissions-tab.vue

@@ -45,32 +45,32 @@
           </template>
 
           <template #read="{ item }">
-            <wt-select
-              :clearable="false"
+            <wt-single-select
+              :show-clear="false"
               :disabled="!access.edit"
               :options="accessOptions"
-              :value="item.access.r"
-              @input="changeAccessMode({ item, ruleName: 'r', mode: $event })"
+              :model-value="item.access.r"
+              @update:model-value="changeAccessMode({ item, ruleName: 'r', mode: $event })"
             />
           </template>
 
           <template #edit="{ item }">
-            <wt-select
-              :clearable="false"
+            <wt-single-select
+              :show-clear="false"
               :disabled="!access.edit"
               :options="accessOptions"
-              :value="item.access.w"
-              @input="changeAccessMode({ item, ruleName: 'w', mode: $event })"
+              :model-value="item.access.w"
+              @update:model-value="changeAccessMode({ item, ruleName: 'w', mode: $event })"
             />
           </template>
 
           <template #delete="{ item }">
-            <wt-select
-              :clearable="false"
+            <wt-single-select
+              :show-clear="false"
               :disabled="!access.edit"
               :options="accessOptions"
-              :value="item.access.d"
-              @input="changeAccessMode({ item, ruleName: 'd', mode: $event })"
+              :model-value="item.access.d"
+              @update:model-value="changeAccessMode({ item, ruleName: 'd', mode: $event })"
             />
           </template>
           <template #actions="{ item }">

package/src/modules/QueryFilters/components/abstract-api-filter.vue

@@ -1,20 +1,42 @@
 <template>
-  <wt-select
-    :close-on-select="filterSchema.closeOnSelect"
+  <wt-single-select
+    v-if="!filterSchema.multiple"
     :label="label"
-    :multiple="filterSchema.multiple"
     :search-method="search"
-    :track-by="filterSchema.storedProp"
-    :value="filterSchema.value"
+    :data-key="filterSchema.storedProp"
+    :model-value="filterSchema.value"
     v-bind="$attrs"
-    @closed="
+    @hide="
       setValueToQuery({
         value,
         filterQuery,
         storedProp: filterSchema.storedProp,
       })
     "
-    @input="setValue({ filter: filterQuery, value: $event })"
+    @update:model-value="setValue({ filter: filterQuery, value: $event })"
+    @reset="
+      setValueToQuery({
+        value,
+        filterQuery,
+        storedProp: filterSchema.storedProp,
+      })
+    "
+  />
+
+  <wt-multi-select
+    :label="label"
+    :search-method="search"
+    :data-key="filterSchema.storedProp"
+    :model-value="filterSchema.value"
+    v-bind="$attrs"
+    @hide="
+      setValueToQuery({
+        value,
+        filterQuery,
+        storedProp: filterSchema.storedProp,
+      })
+    "
+    @update:model-value="setValue({ filter: filterQuery, value: $event })"
     @reset="
       setValueToQuery({
         value,

package/src/modules/QueryFilters/components/abstract-enum-filter.vue

@@ -1,20 +1,45 @@
 <template>
-  <wt-select
+  <wt-single-select
+    v-if="!filterSchema.multiple"
     :allow-custom-values="allowCustomValues"
     :label="label"
-    :multiple="filterSchema.multiple"
     :options="localizedOptions"
-    :track-by="filterSchema.storedProp"
-    :value="value"
+    :data-key="filterSchema.storedProp"
+    :model-value="value"
     v-bind="$attrs"
-    @closed="
+    @hide="
       setValueToQuery({
         value,
         filterQuery,
         storedProp: filterSchema.storedProp,
       })
     "
-    @input="setValue({ filter: filterQuery, value: $event })"
+    @update:model-value="setValue({ filter: filterQuery, value: $event })"
+    @reset="
+      setValueToQuery({
+        value,
+        filterQuery,
+        storedProp: filterSchema.storedProp,
+      })
+    "
+  />
+
+  <wt-multi-select
+    v-else
+    :allow-custom-values="allowCustomValues"
+    :label="label"
+    :options="localizedOptions"
+    :data-key="filterSchema.storedProp"
+    :model-value="value"
+    v-bind="$attrs"
+    @hide="
+      setValueToQuery({
+        value,
+        filterQuery,
+        storedProp: filterSchema.storedProp,
+      })
+    "
+    @update:model-value="setValue({ filter: filterQuery, value: $event })"
     @reset="
       setValueToQuery({
         value,

package/src/modules/UploadCsvPopup/components/wt-upload-csv-popup.vue

@@ -26,9 +26,9 @@
         />
 
         <form class="wt-upload-csv-popup-form__form">
-          <wt-select
-            v-model="charset"
-            :clearable="false"
+          <wt-single-select
+            v-model:model-value="charset"
+            :show-clear="false"
             :label="t('objects.CSV.charSet')"
             :options="charsetOptions"
             disabled
@@ -83,18 +83,18 @@
               {{ t(field.locale) }}<span v-if="field.required">*</span>
             </p>
 
-            <wt-select
+            <wt-single-select
               v-if="!field.multiple"
-              v-model="field.csv"
-              :clearable="!field.required"
+              v-model:model-value="field.csv"
+              :show-clear="!field.required"
               :options="csvColumns"
               :placeholder="t(field.locale)"
-              :track-by="null"
+              :data-key="null"
               class="wt-upload-csv-popup-mapping-item__select"
             />
-            <wt-tags-input
+            <wt-multi-select
               v-else
-              v-model="field.csv"
+              v-model:model-value="field.csv"
               :options="csvColumns"
               :placeholder="t(field.locale)"
               class="wt-upload-csv-popup-mapping-item__select"

package/types/components/on-demand/wt-type-extension-value-input/wt-type-extension-value-input.vue.d.ts

@@ -22,7 +22,7 @@ declare var __VLS_18: "bool", __VLS_19: {
     defaultProps: {
         value: unknown;
         clearable: boolean;
-        trackBy: string;
+        dataKey: string;
         searchMethod: () => (params: any) => any;
         label: string;
         required: boolean;
@@ -31,9 +31,8 @@ declare var __VLS_18: "bool", __VLS_19: {
 }, __VLS_40: "list", __VLS_41: {
     defaultProps: {
         value: unknown;
-        multiple: boolean;
         clearable: boolean;
-        trackBy: string;
+        dataKey: string;
         searchMethod: () => (params: any) => any;
         label: string;
         required: boolean;

package/types/modules/AppConfig/index.d.ts

@@ -0,0 +1,31 @@
+import type { PartialDeep } from 'type-fest';
+import { fetchConfig } from './scripts/fetchConfig';
+export interface AppConfigModule<T> {
+    /**
+     * Returns the resolved config, initializing it on first access.
+     */
+    getConfig: () => Promise<T>;
+    /**
+     * Fetches and resolves the config, replacing any previously cached value.
+     */
+    initializeConfig: () => Promise<T>;
+}
+/**
+ * Creates a reusable app config module.
+ *
+ * Each application provides its own config type `T` and a `defaultConfig` used
+ * as the base. The fetched runtime config (see {@link fetchConfig}) is deep-merged
+ * over the defaults.
+ *
+ * @example
+ * ```ts
+ * import { createAppConfig } from '@webitel/ui-sdk/modules/AppConfig';
+ * import { defaultConfig } from './defaults/defaultConfig';
+ * import type { AppConfig } from './types/AppConfig';
+ *
+ * export const { getConfig, initializeConfig } = createAppConfig<AppConfig>(defaultConfig);
+ * ```
+ */
+export declare function createAppConfig<T>(defaultConfig: PartialDeep<T>): AppConfigModule<T>;
+export { fetchConfig };
+export type { PartialDeep };

package/types/modules/AppConfig/scripts/fetchConfig.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Fetches the application runtime config from static files served next to the app.
+ *
+ * Looks up `config.{json,jsonc}` and an optional `config.local.{json,jsonc}` overlay,
+ * with the local file taking priority. The shape of the returned object is
+ * application-specific, so the concrete type is provided by the caller.
+ */
+export declare function fetchConfig<T>(): Promise<Partial<T>>;