@integration-app/react 2.1.3 → 2.1.4

package/dist/esm/ui-kit/styled/popover.mjs

@@ -3,7 +3,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.1.3
+ * v2.1.4
  */
 'use client';
 

package/dist/esm/ui-kit/styled/skeleton.mjs

@@ -3,7 +3,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.1.3
+ * v2.1.4
  */
 'use client';
 

package/dist/esm/ui-kit/styled/spinner.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.1.3
+ * v2.1.4
  */
 'use client';
 

package/dist/esm/ui-kit/styled/text.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.1.3
+ * v2.1.4
  */
 'use client';
 

package/dist/esm/ui-kit/styled/tooltip.mjs

@@ -3,7 +3,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.1.3
+ * v2.1.4
  */
 'use client';
 

package/dist/esm/ui-kit/styled/utils/create-style-context.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.1.3
+ * v2.1.4
  */
 'use client';
 

package/dist/styles.css

@@ -9300,22 +9300,214 @@
 @layer iap_utilities{
   @layer compositions{
 
-    .iap-textStyle_sm {
-      font-size: var(--iap-font-sizes-sm);
-      line-height: 1.25rem;
-}
-
     .iap-textStyle_md {
       font-size: var(--iap-font-sizes-md);
       line-height: 1.5rem;
 }
 
+    .iap-textStyle_sm {
+      font-size: var(--iap-font-sizes-sm);
+      line-height: 1.25rem;
+}
+
     .iap-textStyle_xs {
       font-size: var(--iap-font-sizes-xs);
       line-height: 1.125rem;
 }
 }
 
+  .iap-ring_none {
+    outline: var(--iap-borders-none);
+}
+
+  .iap-d_flex {
+    display: flex;
+}
+
+  .iap-ov_hidden {
+    overflow: hidden;
+}
+
+  .iap-bg_white {
+    background: var(--iap-colors-white);
+}
+
+  .iap-bx-sh_xl {
+    box-shadow: var(--iap-shadows-xl);
+}
+
+  .iap-bdr_lg {
+    border-radius: var(--iap-radii-lg);
+}
+
+  .iap-p_0 {
+    padding: var(--iap-spacing-0);
+}
+
+  .iap-max-w_none {
+    max-width: none;
+}
+
+  .iap-max-h_var\(--available-height\) {
+    max-height: var(--available-height);
+}
+
+  .iap-h_full {
+    height: var(--iap-sizes-full);
+}
+
+  .iap-w_fit-content {
+    width: fit-content;
+}
+
+  .iap-p_1\.5 {
+    padding: var(--iap-spacing-1\.5);
+}
+
+  .iap-w_full {
+    width: var(--iap-sizes-full);
+}
+
+  .iap-min-w_56 {
+    min-width: var(--iap-sizes-56);
+}
+
+  .iap-max-w_min\(65em\,_90vw\) {
+    max-width: min(65em, 90vw);
+}
+
+  .iap-max-h_inherit {
+    max-height: inherit;
+}
+
+  .iap-min-h_8 {
+    min-height: var(--iap-sizes-8);
+}
+
+  .iap-bdr_none {
+    border-radius: var(--iap-radii-none);
+}
+
+  .iap-bd_none {
+    border: var(--iap-borders-none);
+}
+
+  .iap-px_2 {
+    padding-inline: var(--iap-spacing-2);
+}
+
+  .iap-py_1\.5 {
+    padding-block: var(--iap-spacing-1\.5);
+}
+
+  .iap-pos_relative {
+    position: relative;
+}
+
+  .iap-max-w_md {
+    max-width: var(--iap-sizes-md);
+}
+
+  .iap-p_2 {
+    padding: var(--iap-spacing-2);
+}
+
+  .iap-c_slate\.11 {
+    color: var(--iap-colors-slate-11);
+}
+
+  .iap-tt_uppercase {
+    text-transform: uppercase;
+}
+
+  .iap-ls_wide {
+    letter-spacing: var(--iap-letter-spacings-wide);
+}
+
+  .iap-pos_sticky {
+    position: sticky;
+}
+
+  .iap-z_docked {
+    z-index: var(--iap-z-index-docked);
+}
+
+  .iap-min-h_auto {
+    min-height: auto;
+}
+
+  .iap-pointer-events_none {
+    pointer-events: none;
+}
+
+  .iap-gap_1\.5 {
+    gap: var(--iap-spacing-1\.5);
+}
+
+  .iap-py_1 {
+    padding-block: var(--iap-spacing-1);
+}
+
+  .iap-cursor_pointer {
+    cursor: pointer;
+}
+
+  .iap-min-h_6 {
+    min-height: var(--iap-sizes-6);
+}
+
+  .iap-bdr_md {
+    border-radius: var(--iap-radii-md);
+}
+
+  .iap-gap_1 {
+    gap: var(--iap-spacing-1);
+}
+
+  .iap-max-w_full {
+    max-width: var(--iap-sizes-full);
+}
+
+  .iap-ov-wrap_break-word {
+    overflow-wrap: break-word;
+}
+
+  .iap-c_slate\.10 {
+    color: var(--iap-colors-slate-10);
+}
+
+  .iap-c_tomato\.10 {
+    color: var(--iap-colors-tomato-10);
+}
+
+  .iap-h_7 {
+    height: var(--iap-sizes-7);
+}
+
+  .iap-w_7 {
+    width: var(--iap-sizes-7);
+}
+
+  .iap-c_fg\.default {
+    color: var(--iap-colors-fg-default);
+}
+
+  .iap-h_6 {
+    height: var(--iap-sizes-6);
+}
+
+  .iap-w_6 {
+    width: var(--iap-sizes-6);
+}
+
+  .iap-h_5 {
+    height: var(--iap-sizes-5);
+}
+
+  .iap-w_3\/5 {
+    width: 60%;
+}
+
   .iap-op_0 {
     opacity: 0;
 }
@@ -9471,30 +9663,10 @@
     padding-inline: var(--iap-spacing-1\.5);
 }
 
-  .iap-py_1 {
-    padding-block: var(--iap-spacing-1);
-}
-
-  .iap-h_6 {
-    height: var(--iap-sizes-6);
-}
-
-  .iap-w_6 {
-    width: var(--iap-sizes-6);
-}
-
   .iap-min-w_unset {
     min-width: unset;
 }
 
-  .iap-bdr_md {
-    border-radius: var(--iap-radii-md);
-}
-
-  .iap-c_slate\.11 {
-    color: var(--iap-colors-slate-11);
-}
-
   .iap-w_4 {
     width: var(--iap-sizes-4);
 }
@@ -9503,14 +9675,6 @@
     height: var(--iap-sizes-4);
 }
 
-  .iap-d_flex {
-    display: flex;
-}
-
-  .iap-bdr_lg {
-    border-radius: var(--iap-radii-lg);
-}
-
   .iap-p_1 {
     padding: var(--iap-spacing-1);
 }
@@ -9523,170 +9687,6 @@
     background: linear-gradient(#ffffff 33%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), #ffffff 66%) 0 100%, radial-gradient(farthest-side at 50% 0, rgba(34, 34, 34, 0.5), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 50% 100%, rgba(34, 34, 34, 0.5), rgba(0, 0, 0, 0)) 0 100%;
 }
 
-  .iap-ring_none {
-    outline: var(--iap-borders-none);
-}
-
-  .iap-ov_hidden {
-    overflow: hidden;
-}
-
-  .iap-bg_white {
-    background: var(--iap-colors-white);
-}
-
-  .iap-bx-sh_xl {
-    box-shadow: var(--iap-shadows-xl);
-}
-
-  .iap-p_0 {
-    padding: var(--iap-spacing-0);
-}
-
-  .iap-max-w_none {
-    max-width: none;
-}
-
-  .iap-max-h_var\(--available-height\) {
-    max-height: var(--available-height);
-}
-
-  .iap-h_full {
-    height: var(--iap-sizes-full);
-}
-
-  .iap-w_fit-content {
-    width: fit-content;
-}
-
-  .iap-p_1\.5 {
-    padding: var(--iap-spacing-1\.5);
-}
-
-  .iap-w_full {
-    width: var(--iap-sizes-full);
-}
-
-  .iap-min-w_56 {
-    min-width: var(--iap-sizes-56);
-}
-
-  .iap-max-w_min\(65em\,_90vw\) {
-    max-width: min(65em, 90vw);
-}
-
-  .iap-max-h_inherit {
-    max-height: inherit;
-}
-
-  .iap-min-h_8 {
-    min-height: var(--iap-sizes-8);
-}
-
-  .iap-bdr_none {
-    border-radius: var(--iap-radii-none);
-}
-
-  .iap-bd_none {
-    border: var(--iap-borders-none);
-}
-
-  .iap-px_2 {
-    padding-inline: var(--iap-spacing-2);
-}
-
-  .iap-py_1\.5 {
-    padding-block: var(--iap-spacing-1\.5);
-}
-
-  .iap-pos_relative {
-    position: relative;
-}
-
-  .iap-max-w_md {
-    max-width: var(--iap-sizes-md);
-}
-
-  .iap-gap_1\.5 {
-    gap: var(--iap-spacing-1\.5);
-}
-
-  .iap-cursor_pointer {
-    cursor: pointer;
-}
-
-  .iap-min-h_6 {
-    min-height: var(--iap-sizes-6);
-}
-
-  .iap-c_slate\.10 {
-    color: var(--iap-colors-slate-10);
-}
-
-  .iap-c_tomato\.10 {
-    color: var(--iap-colors-tomato-10);
-}
-
-  .iap-h_7 {
-    height: var(--iap-sizes-7);
-}
-
-  .iap-w_7 {
-    width: var(--iap-sizes-7);
-}
-
-  .iap-c_fg\.default {
-    color: var(--iap-colors-fg-default);
-}
-
-  .iap-h_5 {
-    height: var(--iap-sizes-5);
-}
-
-  .iap-w_3\/5 {
-    width: 60%;
-}
-
-  .iap-p_2 {
-    padding: var(--iap-spacing-2);
-}
-
-  .iap-tt_uppercase {
-    text-transform: uppercase;
-}
-
-  .iap-ls_wide {
-    letter-spacing: var(--iap-letter-spacings-wide);
-}
-
-  .iap-pos_sticky {
-    position: sticky;
-}
-
-  .iap-z_docked {
-    z-index: var(--iap-z-index-docked);
-}
-
-  .iap-min-h_auto {
-    min-height: auto;
-}
-
-  .iap-pointer-events_none {
-    pointer-events: none;
-}
-
-  .iap-gap_1 {
-    gap: var(--iap-spacing-1);
-}
-
-  .iap-max-w_full {
-    max-width: var(--iap-sizes-full);
-}
-
-  .iap-ov-wrap_break-word {
-    overflow-wrap: break-word;
-}
-
   .iap-p_3 {
     padding: var(--iap-spacing-3);
 }
@@ -14295,10 +14295,58 @@
     padding-inline: var(--iap-spacing-4\.5);
 }
 
+  .iap-bd-c_gray\.2 {
+    border-color: var(--iap-colors-gray-2);
+}
+
+  .iap-bd-w_0\.5 {
+    border-width: 0.5px;
+}
+
+  .iap-flex-d_column {
+    flex-direction: column;
+}
+
+  .iap-pb_1\.5 {
+    padding-bottom: var(--iap-spacing-1\.5);
+}
+
+  .iap-fw_medium {
+    font-weight: var(--iap-font-weights-medium);
+}
+
+  .iap-pt_0\.5 {
+    padding-top: var(--iap-spacing-0\.5);
+}
+
+  .iap-ov-y_auto {
+    overflow-y: auto;
+}
+
+  .iap-flex-g_1 {
+    flex-grow: 1;
+}
+
+  .iap-fs_xs {
+    font-size: var(--iap-font-sizes-xs);
+}
+
+  .iap-top_0 {
+    top: var(--iap-spacing-0);
+}
+
+  .iap-flex-d_row {
+    flex-direction: row;
+}
+
   .iap-ai_center {
     align-items: center;
 }
 
+  .iap-ai_baseline {
+    align-items: baseline;
+}
+
   .iap-jc_center {
     justify-content: center;
 }
@@ -14323,10 +14371,6 @@
     line-height: 1.2;
 }
 
-  .iap-fw_medium {
-    font-weight: var(--iap-font-weights-medium);
-}
-
   .iap-fs_sm {
     font-size: var(--iap-font-sizes-sm);
 }
@@ -14343,10 +14387,6 @@
     border-color: var(--iap-colors-gray-5);
 }
 
-  .iap-bd-w_0\.5 {
-    border-width: 0.5px;
-}
-
   .iap-bg-c_transparent {
     background-color: var(--iap-colors-transparent);
 }
@@ -14363,46 +14403,6 @@
     background-size: 100% 15px, 100% 15px, 100% 2px, 100% 2px;
 }
 
-  .iap-bd-c_gray\.2 {
-    border-color: var(--iap-colors-gray-2);
-}
-
-  .iap-flex-d_column {
-    flex-direction: column;
-}
-
-  .iap-pb_1\.5 {
-    padding-bottom: var(--iap-spacing-1\.5);
-}
-
-  .iap-pt_0\.5 {
-    padding-top: var(--iap-spacing-0\.5);
-}
-
-  .iap-ov-y_auto {
-    overflow-y: auto;
-}
-
-  .iap-flex-g_1 {
-    flex-grow: 1;
-}
-
-  .iap-flex-d_row {
-    flex-direction: row;
-}
-
-  .iap-fs_xs {
-    font-size: var(--iap-font-sizes-xs);
-}
-
-  .iap-top_0 {
-    top: var(--iap-spacing-0);
-}
-
-  .iap-ai_baseline {
-    align-items: baseline;
-}
-
   .iap-jc_start {
     justify-content: start;
 }
@@ -14549,14 +14549,14 @@
 }
 
   @media (hover: hover) and (pointer: fine) {
-    .hover\:iap-bg_neutral\.3:is(:hover, [data-hover]) {
-      background: var(--iap-colors-neutral-3);
+    .hover\:iap-bg_slate\.3:is(:hover, [data-hover]) {
+      background: var(--iap-colors-slate-3);
 }
 }
 
   @media (hover: hover) and (pointer: fine) {
-    .hover\:iap-bg_slate\.3:is(:hover, [data-hover]) {
-      background: var(--iap-colors-slate-3);
+    .hover\:iap-bg_neutral\.3:is(:hover, [data-hover]) {
+      background: var(--iap-colors-neutral-3);
 }
 }
 

package/dist/types/components/DropdownUI/sva-recipe.d.ts

@@ -1,2 +1 @@
 export declare const scrollShadow: import("../../styled-system/types").RecipeRuntimeFn<import("../../styled-system/types").RecipeVariantRecord>;
-export declare const dropdownRecipe: import("../../styled-system/types").SlotRecipeRuntimeFn<"item" | "content" | "list" | "popover-container" | "panel" | "search-input" | "search-divider" | "no-options-heading" | "error-heading" | "error-heading-icon" | "info-heading" | "info-heading-icon" | "loading-item-container" | "loading-item-icon" | "loading-item-title" | "items-list-header" | "item-title", import("../../styled-system/types").SlotRecipeVariantRecord<"item" | "content" | "list" | "popover-container" | "panel" | "search-input" | "search-divider" | "no-options-heading" | "error-heading" | "error-heading-icon" | "info-heading" | "info-heading-icon" | "loading-item-container" | "loading-item-icon" | "loading-item-title" | "items-list-header" | "item-title">>;

package/dist/types/{hooks → helpers/hooks}/useWindowEvent.d.ts

@@ -1,4 +1,4 @@
-import { PopperRefElementType } from '../components/ComboBox/types';
+import { PopperRefElementType } from '../../components/ComboBox/types';
 export declare function useWindowEvent<TType extends keyof WindowEventMap>(type: TType, listener: (this: Window, ev: WindowEventMap[TType]) => any): void;
 export declare function useClickOutsideElements(refs: Array<PopperRefElementType | null | undefined>, onClickOutside: ((event: MouseEvent | TouchEvent) => void) | undefined): void;
 export declare function useWindowResize(listener: (...props: any[]) => any, ms?: number): void;

package/dist/types/recipes/common.d.ts

@@ -0,0 +1,10 @@
+import { SlotRecipeRuntimeFn, SlotRecipeVariantRecord } from '../styled-system/types';
+export type SlotMeta = readonly [slot: string, description: string];
+type ExtractSlotNames<T extends readonly SlotMeta[]> = T[number][0];
+export type SlotNames<T extends readonly SlotMeta[]> = ExtractSlotNames<T>;
+export type SvaRecipeWithMeta<S extends string = string> = SlotRecipeRuntimeFn<S, SlotRecipeVariantRecord<S>> & {
+    readonly SCOPE: string;
+    readonly DESCRIPTION: string;
+    readonly SLOTS: readonly SlotMeta[];
+};
+export {};

package/dist/types/recipes/dropdown.d.ts

@@ -0,0 +1,4 @@
+import { SlotNames, SvaRecipeWithMeta } from './common';
+declare const SLOTS: readonly [readonly ["popover-container", "Main container of a dropdown. Emits keyboard navigation events"], readonly ["content", "Dropdown content container"], readonly ["panel", "Section panel. Can be multiple. Can be nested"], readonly ["search-input", "Search input element"], readonly ["search-divider", "Divider between search input and rest of elements"], readonly ["list", "Items list container"], readonly ["items-list-header", "Items list header"], readonly ["item", "Single list item container"], readonly ["item-title", "List item title"], readonly ["no-options-heading", "Heading title for empty search result"], readonly ["error-heading", "Heading for error when options failed to load"], readonly ["error-heading-icon", "Error heading icon"], readonly ["info-heading", "Heading for unsupported states within the dropdown"], readonly ["info-heading-icon", "Info heading icon"], readonly ["loading-item-container", "List item skeleton container"], readonly ["loading-item-icon", "List item icon skeleton"], readonly ["loading-item-title", "Loading item title skeleton"]];
+export declare const dropdownRecipe: SvaRecipeWithMeta<SlotNames<typeof SLOTS>>;
+export {};

package/dist/types/recipes/index.d.ts

@@ -0,0 +1 @@
+export * from './dropdown';