@intlayer/design-system 7.5.10 → 7.5.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (101) hide show
  1. package/dist/esm/components/Container/index.mjs +7 -2
  2. package/dist/esm/components/Container/index.mjs.map +1 -1
  3. package/dist/esm/components/Footer/index.mjs +1 -1
  4. package/dist/esm/components/Footer/index.mjs.map +1 -1
  5. package/dist/esm/components/Form/FormItem.mjs +3 -2
  6. package/dist/esm/components/Form/FormItem.mjs.map +1 -1
  7. package/dist/esm/components/Form/layout/FormLabelLayout.mjs +1 -0
  8. package/dist/esm/components/Form/layout/FormLabelLayout.mjs.map +1 -1
  9. package/dist/esm/components/Link/Link.mjs.map +1 -1
  10. package/dist/esm/components/Modal/Modal.mjs +20 -20
  11. package/dist/esm/components/Modal/Modal.mjs.map +1 -1
  12. package/dist/esm/hooks/index.mjs +2 -2
  13. package/dist/esm/hooks/reactQuery.mjs +102 -1
  14. package/dist/esm/hooks/reactQuery.mjs.map +1 -1
  15. package/dist/types/components/Badge/index.d.ts +2 -2
  16. package/dist/types/components/Breadcrumb/breadcrumb.content.d.ts +3 -3
  17. package/dist/types/components/Breadcrumb/index.d.ts +2 -2
  18. package/dist/types/components/Breadcrumb/index.d.ts.map +1 -1
  19. package/dist/types/components/Browser/Browser.d.ts +2 -2
  20. package/dist/types/components/Browser/Browser.d.ts.map +1 -1
  21. package/dist/types/components/Browser/browser.content.d.ts +17 -17
  22. package/dist/types/components/Browser/browser.content.d.ts.map +1 -1
  23. package/dist/types/components/Button/Button.d.ts +7 -7
  24. package/dist/types/components/Carousel/index.content.d.ts +7 -7
  25. package/dist/types/components/CollapsibleTable/CollapsibleTable.d.ts +3 -3
  26. package/dist/types/components/CollapsibleTable/CollapsibleTable.d.ts.map +1 -1
  27. package/dist/types/components/Command/index.d.ts +17 -17
  28. package/dist/types/components/Container/index.d.ts +9 -9
  29. package/dist/types/components/Container/index.d.ts.map +1 -1
  30. package/dist/types/components/CopyButton/CopyButton.content.d.ts +3 -3
  31. package/dist/types/components/DictionaryFieldEditor/DictionaryCreationForm/dictionaryCreationForm.content.d.ts +25 -25
  32. package/dist/types/components/DictionaryFieldEditor/DictionaryCreationForm/useDictionaryFormSchema.content.d.ts +9 -9
  33. package/dist/types/components/DictionaryFieldEditor/DictionaryDetails/dictionaryDetails.content.d.ts +33 -33
  34. package/dist/types/components/DictionaryFieldEditor/DictionaryDetails/useDictionaryDetailsSchema.content.d.ts +25 -25
  35. package/dist/types/components/DictionaryFieldEditor/NavigationView/navigationViewNode.content.d.ts +25 -25
  36. package/dist/types/components/DictionaryFieldEditor/NavigationView/navigationViewNode.content.d.ts.map +1 -1
  37. package/dist/types/components/DictionaryFieldEditor/SaveForm/saveForm.content.d.ts +33 -33
  38. package/dist/types/components/DictionaryFieldEditor/StructureView/structureView.content.d.ts +9 -9
  39. package/dist/types/components/DictionaryFieldEditor/VersionSwitcherDropDown/versionSwitcherDropDown.content.d.ts +7 -7
  40. package/dist/types/components/DictionaryFieldEditor/dictionaryFieldEditor.content.d.ts +5 -5
  41. package/dist/types/components/DictionaryFieldEditor/nodeTypeSelector.content.d.ts +31 -31
  42. package/dist/types/components/ExpandCollapse/expandCollapse.content.d.ts +3 -3
  43. package/dist/types/components/Form/FormBase.d.ts +2 -2
  44. package/dist/types/components/Form/FormField.d.ts +2 -2
  45. package/dist/types/components/Form/FormItem.d.ts.map +1 -1
  46. package/dist/types/components/Form/elements/EditableFieldInputElement.d.ts +2 -2
  47. package/dist/types/components/Form/elements/EditableFieldTextAreaElement.d.ts +2 -2
  48. package/dist/types/components/Form/elements/EditableFieldTextAreaElement.d.ts.map +1 -1
  49. package/dist/types/components/Form/elements/FormElement.d.ts +2 -2
  50. package/dist/types/components/Form/elements/MultiselectElement.d.ts +2 -2
  51. package/dist/types/components/Form/elements/OTPElement.d.ts +2 -2
  52. package/dist/types/components/Form/elements/SelectElement.d.ts +2 -2
  53. package/dist/types/components/Form/elements/SwitchSelectorElement.d.ts +2 -2
  54. package/dist/types/components/IDE/CodeContext.d.ts +2 -2
  55. package/dist/types/components/IDE/CodeContext.d.ts.map +1 -1
  56. package/dist/types/components/IDE/code.content.d.ts +2 -2
  57. package/dist/types/components/IDE/copyCode.content.d.ts +5 -5
  58. package/dist/types/components/IDE/selectors.content.d.ts +13 -13
  59. package/dist/types/components/Input/Checkbox.d.ts +4 -4
  60. package/dist/types/components/Input/Checkbox.d.ts.map +1 -1
  61. package/dist/types/components/Input/Input.d.ts +3 -3
  62. package/dist/types/components/Input/Input.d.ts.map +1 -1
  63. package/dist/types/components/Input/OTPInput.d.ts +4 -4
  64. package/dist/types/components/Link/Link.d.ts +5 -5
  65. package/dist/types/components/Link/Link.d.ts.map +1 -1
  66. package/dist/types/components/Loader/index.content.d.ts +3 -3
  67. package/dist/types/components/Loader/spinner.d.ts +2 -2
  68. package/dist/types/components/LocaleSwitcherContentDropDown/localeSwitcher.content.d.ts +17 -17
  69. package/dist/types/components/LocaleSwitcherContentDropDown/localeSwitcher.content.d.ts.map +1 -1
  70. package/dist/types/components/LocaleSwitcherDropDown/localeSwitcher.content.d.ts +13 -13
  71. package/dist/types/components/MaxWidthSmoother/index.d.ts +2 -2
  72. package/dist/types/components/Modal/Modal.d.ts +4 -16
  73. package/dist/types/components/Modal/Modal.d.ts.map +1 -1
  74. package/dist/types/components/Navbar/Burger.d.ts +2 -2
  75. package/dist/types/components/Navbar/DesktopNavbar.d.ts +2 -2
  76. package/dist/types/components/Navbar/MobileNavbar.d.ts +2 -2
  77. package/dist/types/components/Navbar/index.d.ts +2 -2
  78. package/dist/types/components/Pagination/Pagination.d.ts +3 -3
  79. package/dist/types/components/Pagination/pagination.content.d.ts +11 -11
  80. package/dist/types/components/RightDrawer/rightDrawer.content.d.ts +5 -5
  81. package/dist/types/components/RightDrawer/rightDrawer.content.d.ts.map +1 -1
  82. package/dist/types/components/Select/Select.d.ts +3 -3
  83. package/dist/types/components/Select/Select.d.ts.map +1 -1
  84. package/dist/types/components/SocialNetworks/index.d.ts +2 -2
  85. package/dist/types/components/SwitchSelector/index.d.ts +7 -7
  86. package/dist/types/components/SwitchSelector/index.d.ts.map +1 -1
  87. package/dist/types/components/Tab/Tab.d.ts +5 -5
  88. package/dist/types/components/Tab/TabContext.d.ts +2 -2
  89. package/dist/types/components/TabSelector/TabSelector.d.ts +5 -5
  90. package/dist/types/components/TabSelector/TabSelector.d.ts.map +1 -1
  91. package/dist/types/components/Table/table.content.d.ts +3 -3
  92. package/dist/types/components/Tag/index.d.ts +5 -5
  93. package/dist/types/components/Terminal/terminal.content.d.ts +2 -2
  94. package/dist/types/components/Toaster/Toast.d.ts +2 -2
  95. package/dist/types/components/Toaster/Toast.d.ts.map +1 -1
  96. package/dist/types/components/Toaster/Toaster.d.ts +2 -2
  97. package/dist/types/hooks/index.d.ts +2 -2
  98. package/dist/types/hooks/reactQuery.d.ts +19 -1
  99. package/dist/types/hooks/reactQuery.d.ts.map +1 -1
  100. package/dist/types/hooks/useItemSelector.d.ts.map +1 -1
  101. package/package.json +14 -14
@@ -50,13 +50,14 @@ const containerVariants = cva("flex flex-col text-text backdrop-blur", {
50
50
  primary: "border-primary",
51
51
  secondary: "border-secondary",
52
52
  neutral: "border-neutral",
53
+ card: "border-card",
53
54
  text: "border-text",
54
55
  error: "border-error",
55
56
  warning: "border-warning",
56
57
  success: "border-success"
57
58
  },
58
59
  background: {
59
- none: "bg-inherit",
60
+ none: "",
60
61
  hoverable: "bg-opacity-5! backdrop-blur-0 hover:bg-opacity-10! hover:backdrop-blur focus:bg-opacity-10! focus:backdrop-blur aria-selected:bg-opacity-15! aria-selected:backdrop-blur",
61
62
  with: ""
62
63
  },
@@ -77,7 +78,11 @@ const containerVariants = cva("flex flex-col text-text backdrop-blur", {
77
78
  padding: "none",
78
79
  separator: "without",
79
80
  gap: "none"
80
- }
81
+ },
82
+ compoundVariants: [{
83
+ background: "none",
84
+ class: "bg-transparent"
85
+ }]
81
86
  });
82
87
  /** Available rounded corner sizes for the container */
83
88
  let ContainerRoundedSize = /* @__PURE__ */ function(ContainerRoundedSize$1) {
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","names":["Container: FC<ContainerProps>"],"sources":["../../../../src/components/Container/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type {\n DetailedHTMLProps,\n FC,\n HTMLAttributes,\n PropsWithChildren,\n} from 'react';\n\n/**\n * Container component variants using class-variance-authority\n * Provides flexible styling options for background, padding, borders, and layout\n */\nexport const containerVariants = cva('flex flex-col text-text backdrop-blur', {\n variants: {\n roundedSize: {\n none: 'rounded-none',\n sm: 'rounded-sm [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-md',\n md: 'rounded-md [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-lg',\n lg: 'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n xl: 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n '2xl':\n 'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n '3xl':\n 'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n '4xl':\n 'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n full: 'rounded-full [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-full',\n },\n transparency: {\n none: 'bg-card',\n sm: 'bg-card/90',\n md: 'bg-card/70',\n lg: 'bg-card/40',\n xl: 'bg-card/20',\n full: '',\n },\n padding: {\n none: 'p-0',\n sm: 'px-2 py-4',\n md: 'px-4 py-6',\n lg: 'px-6 py-8',\n xl: 'px-8 py-10',\n '2xl': 'px-10 py-12',\n },\n separator: {\n without: '',\n x: 'divide-x divide-dashed divide-text/20',\n y: 'divide-y divide-dashed divide-text/20',\n both: 'divide-x divide-y divide-dashed divide-text/20',\n },\n border: {\n none: '',\n with: 'border-[1.3px]',\n },\n borderColor: {\n primary: 'border-primary',\n secondary: 'border-secondary',\n neutral: 'border-neutral',\n text: 'border-text',\n error: 'border-error',\n warning: 'border-warning',\n success: 'border-success',\n },\n background: {\n none: 'bg-inherit',\n hoverable:\n 'bg-opacity-5! backdrop-blur-0 hover:bg-opacity-10! hover:backdrop-blur focus:bg-opacity-10! focus:backdrop-blur aria-selected:bg-opacity-15! aria-selected:backdrop-blur',\n with: '',\n },\n gap: {\n none: 'gap-0',\n sm: 'gap-1',\n md: 'gap-3',\n lg: 'gap-5',\n xl: 'gap-8',\n '2xl': 'gap-10',\n },\n },\n defaultVariants: {\n roundedSize: 'lg',\n border: 'none',\n borderColor: 'text',\n transparency: 'md',\n padding: 'none',\n separator: 'without',\n gap: 'none',\n },\n});\n\n/** Available rounded corner sizes for the container */\nexport enum ContainerRoundedSize {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n '2xl' = '2xl',\n '3xl' = '3xl',\n '4xl' = '4xl',\n '5xl' = '5xl',\n FULL = 'full',\n}\n\n/** Background transparency levels for the container */\nexport enum ContainerTransparency {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n FULL = 'full',\n}\n\n/** Padding sizes for container content */\nexport enum ContainerPadding {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n}\n\n/** Separator options for dividing container children */\nexport enum ContainerSeparator {\n WITHOUT = 'without',\n X = 'x',\n Y = 'y',\n BOTH = 'both',\n}\n\n/** Border color options for the container */\nexport enum ContainerBorderColor {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n NEUTRAL = 'neutral',\n TEXT = 'text',\n ERROR = 'error',\n WARNING = 'warning',\n SUCCESS = 'success',\n}\n\n/** Background interaction states for the container */\nexport enum ContainerBackground {\n NONE = 'none',\n HOVERABLE = 'hoverable',\n WITH = 'with',\n}\n\n/** Gap sizes between container children */\nexport enum ContainerGap {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n '2xl' = '2xl',\n}\n\n/** Container component props extending HTML div attributes */\nexport type ContainerProps = PropsWithChildren<\n Omit<VariantProps<typeof containerVariants>, 'border'>\n> &\n DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> & {\n /** Whether to show a border around the container */\n border?: boolean;\n };\n\n/**\n * Container Component\n *\n * A flexible container component for organizing content with customizable styling options.\n * Supports various visual states, layouts, and accessibility features.\n *\n * ## Features\n * - **Flexible Layout**: Supports different padding, gap, and separator options\n * - **Visual Variants**: Multiple background transparency levels and border styles\n * - **Responsive Design**: Configurable rounded corners and spacing\n * - **Semantic HTML**: Proper div element with extensible attributes\n *\n * ## Accessibility\n * - Inherits all standard div accessibility features\n * - Supports ARIA attributes through spread props\n * - Maintains proper semantic structure for screen readers\n *\n * @param children - The content to display inside the container\n * @param roundedSize - Border radius size (default: 'md')\n * @param transparency - Background transparency level (default: 'md')\n * @param padding - Internal padding size (default: 'none')\n * @param separator - Divider lines between children (default: 'without')\n * @param border - Whether to show border (default: false)\n * @param borderColor - Color of the border (default: 'text')\n * @param background - Background interaction behavior (default: 'none')\n * @param gap - Space between child elements (default: 'none')\n * @param className - Additional CSS classes\n * @param props - Additional HTML div attributes including ARIA attributes\n */\nexport const Container: FC<ContainerProps> = ({\n children,\n roundedSize,\n padding,\n transparency,\n separator,\n className,\n border,\n borderColor,\n background,\n gap,\n ...props\n}) => (\n <div\n className={cn(\n containerVariants({\n roundedSize,\n transparency,\n padding,\n separator,\n border:\n typeof border === 'boolean' ? (border ? 'with' : 'none') : undefined,\n background,\n borderColor,\n gap,\n }),\n className\n )}\n {...props}\n >\n {children}\n </div>\n);\n"],"mappings":";;;;;;;;;AAaA,MAAa,oBAAoB,IAAI,yCAAyC;CAC5E,UAAU;EACR,aAAa;GACX,MAAM;GACN,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,OACE;GACF,OACE;GACF,OACE;GACF,MAAM;GACP;EACD,cAAc;GACZ,MAAM;GACN,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,MAAM;GACP;EACD,SAAS;GACP,MAAM;GACN,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,OAAO;GACR;EACD,WAAW;GACT,SAAS;GACT,GAAG;GACH,GAAG;GACH,MAAM;GACP;EACD,QAAQ;GACN,MAAM;GACN,MAAM;GACP;EACD,aAAa;GACX,SAAS;GACT,WAAW;GACX,SAAS;GACT,MAAM;GACN,OAAO;GACP,SAAS;GACT,SAAS;GACV;EACD,YAAY;GACV,MAAM;GACN,WACE;GACF,MAAM;GACP;EACD,KAAK;GACH,MAAM;GACN,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,OAAO;GACR;EACF;CACD,iBAAiB;EACf,aAAa;EACb,QAAQ;EACR,aAAa;EACb,cAAc;EACd,SAAS;EACT,WAAW;EACX,KAAK;EACN;CACF,CAAC;;AAGF,IAAY,wEAAL;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAIF,IAAY,0EAAL;AACL;AACA;AACA;AACA;AACA;AACA;;;;AAIF,IAAY,gEAAL;AACL;AACA;AACA;AACA;AACA;;;;AAIF,IAAY,oEAAL;AACL;AACA;AACA;AACA;;;;AAIF,IAAY,wEAAL;AACL;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAIF,IAAY,sEAAL;AACL;AACA;AACA;;;;AAIF,IAAY,wDAAL;AACL;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCF,MAAaA,aAAiC,EAC5C,UACA,aACA,SACA,cACA,WACA,WACA,QACA,aACA,YACA,KACA,GAAG,YAEH,oBAAC;CACC,WAAW,GACT,kBAAkB;EAChB;EACA;EACA;EACA;EACA,QACE,OAAO,WAAW,YAAa,SAAS,SAAS,SAAU;EAC7D;EACA;EACA;EACD,CAAC,EACF,UACD;CACD,GAAI;CAEH;EACG"}
1
+ {"version":3,"file":"index.mjs","names":["Container: FC<ContainerProps>"],"sources":["../../../../src/components/Container/index.tsx"],"sourcesContent":["import { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type {\n DetailedHTMLProps,\n FC,\n HTMLAttributes,\n PropsWithChildren,\n} from 'react';\n\n/**\n * Container component variants using class-variance-authority\n * Provides flexible styling options for background, padding, borders, and layout\n */\nexport const containerVariants = cva('flex flex-col text-text backdrop-blur', {\n variants: {\n roundedSize: {\n none: 'rounded-none',\n sm: 'rounded-sm [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-md',\n md: 'rounded-md [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-lg',\n lg: 'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n xl: 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n '2xl':\n 'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n '3xl':\n 'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n '4xl':\n 'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n full: 'rounded-full [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-full',\n },\n transparency: {\n none: 'bg-card',\n sm: 'bg-card/90',\n md: 'bg-card/70',\n lg: 'bg-card/40',\n xl: 'bg-card/20',\n full: '',\n },\n padding: {\n none: 'p-0',\n sm: 'px-2 py-4',\n md: 'px-4 py-6',\n lg: 'px-6 py-8',\n xl: 'px-8 py-10',\n '2xl': 'px-10 py-12',\n },\n separator: {\n without: '',\n x: 'divide-x divide-dashed divide-text/20',\n y: 'divide-y divide-dashed divide-text/20',\n both: 'divide-x divide-y divide-dashed divide-text/20',\n },\n border: {\n none: '',\n with: 'border-[1.3px]',\n },\n borderColor: {\n primary: 'border-primary',\n secondary: 'border-secondary',\n neutral: 'border-neutral',\n card: 'border-card',\n text: 'border-text',\n error: 'border-error',\n warning: 'border-warning',\n success: 'border-success',\n },\n background: {\n none: '',\n hoverable:\n 'bg-opacity-5! backdrop-blur-0 hover:bg-opacity-10! hover:backdrop-blur focus:bg-opacity-10! focus:backdrop-blur aria-selected:bg-opacity-15! aria-selected:backdrop-blur',\n with: '',\n },\n gap: {\n none: 'gap-0',\n sm: 'gap-1',\n md: 'gap-3',\n lg: 'gap-5',\n xl: 'gap-8',\n '2xl': 'gap-10',\n },\n },\n defaultVariants: {\n roundedSize: 'lg',\n border: 'none',\n borderColor: 'text',\n transparency: 'md',\n padding: 'none',\n separator: 'without',\n gap: 'none',\n },\n compoundVariants: [\n {\n background: 'none',\n class: 'bg-transparent',\n },\n ],\n});\n\n/** Available rounded corner sizes for the container */\nexport enum ContainerRoundedSize {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n '2xl' = '2xl',\n '3xl' = '3xl',\n '4xl' = '4xl',\n '5xl' = '5xl',\n FULL = 'full',\n}\n\n/** Background transparency levels for the container */\nexport enum ContainerTransparency {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n FULL = 'full',\n}\n\n/** Padding sizes for container content */\nexport enum ContainerPadding {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n}\n\n/** Separator options for dividing container children */\nexport enum ContainerSeparator {\n WITHOUT = 'without',\n X = 'x',\n Y = 'y',\n BOTH = 'both',\n}\n\n/** Border color options for the container */\nexport enum ContainerBorderColor {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n NEUTRAL = 'neutral',\n TEXT = 'text',\n ERROR = 'error',\n WARNING = 'warning',\n SUCCESS = 'success',\n}\n\n/** Background interaction states for the container */\nexport enum ContainerBackground {\n NONE = 'none',\n HOVERABLE = 'hoverable',\n WITH = 'with',\n}\n\n/** Gap sizes between container children */\nexport enum ContainerGap {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n '2xl' = '2xl',\n}\n\n/** Container component props extending HTML div attributes */\nexport type ContainerProps = PropsWithChildren<\n Omit<VariantProps<typeof containerVariants>, 'border'>\n> &\n DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement> & {\n /** Whether to show a border around the container */\n border?: boolean;\n };\n\n/**\n * Container Component\n *\n * A flexible container component for organizing content with customizable styling options.\n * Supports various visual states, layouts, and accessibility features.\n *\n * ## Features\n * - **Flexible Layout**: Supports different padding, gap, and separator options\n * - **Visual Variants**: Multiple background transparency levels and border styles\n * - **Responsive Design**: Configurable rounded corners and spacing\n * - **Semantic HTML**: Proper div element with extensible attributes\n *\n * ## Accessibility\n * - Inherits all standard div accessibility features\n * - Supports ARIA attributes through spread props\n * - Maintains proper semantic structure for screen readers\n *\n * @param children - The content to display inside the container\n * @param roundedSize - Border radius size (default: 'md')\n * @param transparency - Background transparency level (default: 'md')\n * @param padding - Internal padding size (default: 'none')\n * @param separator - Divider lines between children (default: 'without')\n * @param border - Whether to show border (default: false)\n * @param borderColor - Color of the border (default: 'text')\n * @param background - Background interaction behavior (default: 'none')\n * @param gap - Space between child elements (default: 'none')\n * @param className - Additional CSS classes\n * @param props - Additional HTML div attributes including ARIA attributes\n */\nexport const Container: FC<ContainerProps> = ({\n children,\n roundedSize,\n padding,\n transparency,\n separator,\n className,\n border,\n borderColor,\n background,\n gap,\n ...props\n}) => (\n <div\n className={cn(\n containerVariants({\n roundedSize,\n transparency,\n padding,\n separator,\n border:\n typeof border === 'boolean' ? (border ? 'with' : 'none') : undefined,\n background,\n borderColor,\n gap,\n }),\n className\n )}\n {...props}\n >\n {children}\n </div>\n);\n"],"mappings":";;;;;;;;;AAaA,MAAa,oBAAoB,IAAI,yCAAyC;CAC5E,UAAU;EACR,aAAa;GACX,MAAM;GACN,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,OACE;GACF,OACE;GACF,OACE;GACF,MAAM;GACP;EACD,cAAc;GACZ,MAAM;GACN,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,MAAM;GACP;EACD,SAAS;GACP,MAAM;GACN,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,OAAO;GACR;EACD,WAAW;GACT,SAAS;GACT,GAAG;GACH,GAAG;GACH,MAAM;GACP;EACD,QAAQ;GACN,MAAM;GACN,MAAM;GACP;EACD,aAAa;GACX,SAAS;GACT,WAAW;GACX,SAAS;GACT,MAAM;GACN,MAAM;GACN,OAAO;GACP,SAAS;GACT,SAAS;GACV;EACD,YAAY;GACV,MAAM;GACN,WACE;GACF,MAAM;GACP;EACD,KAAK;GACH,MAAM;GACN,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,OAAO;GACR;EACF;CACD,iBAAiB;EACf,aAAa;EACb,QAAQ;EACR,aAAa;EACb,cAAc;EACd,SAAS;EACT,WAAW;EACX,KAAK;EACN;CACD,kBAAkB,CAChB;EACE,YAAY;EACZ,OAAO;EACR,CACF;CACF,CAAC;;AAGF,IAAY,wEAAL;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAIF,IAAY,0EAAL;AACL;AACA;AACA;AACA;AACA;AACA;;;;AAIF,IAAY,gEAAL;AACL;AACA;AACA;AACA;AACA;;;;AAIF,IAAY,oEAAL;AACL;AACA;AACA;AACA;;;;AAIF,IAAY,wEAAL;AACL;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAIF,IAAY,sEAAL;AACL;AACA;AACA;;;;AAIF,IAAY,wDAAL;AACL;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCF,MAAaA,aAAiC,EAC5C,UACA,aACA,SACA,cACA,WACA,WACA,QACA,aACA,YACA,KACA,GAAG,YAEH,oBAAC;CACC,WAAW,GACT,kBAAkB;EAChB;EACA;EACA;EACA;EACA,QACE,OAAO,WAAW,YAAa,SAAS,SAAS,SAAU;EAC7D;EACA;EACA;EACD,CAAC,EACF,UACD;CACD,GAAI;CAEH;EACG"}
@@ -96,7 +96,7 @@ const Footer = ({ links }) => /* @__PURE__ */ jsxs("footer", {
96
96
  /* @__PURE__ */ jsx(LogoWithTextBelow, { className: "size-full max-w-[120px]" }),
97
97
  /* @__PURE__ */ jsx("span", {
98
98
  className: "text-center text-neutral text-xs",
99
- children: "© 2025 Intlayer, Inc."
99
+ children: "© 2026 Intlayer, Inc."
100
100
  }),
101
101
  /* @__PURE__ */ jsx("div", {
102
102
  className: "flex flex-row gap-3",
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","names":["Footer: FC<FooterProps>","links"],"sources":["../../../../src/components/Footer/index.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react';\nimport { LogoWithTextBelow } from '../Logo';\nimport { SocialNetworks } from '../SocialNetworks';\n\n/**\n * Represents a single footer link with all necessary attributes\n */\nexport type FooterLink = {\n /** URL or path for the link */\n href: string;\n /** Display text or JSX element for the link */\n text: ReactNode;\n /** Optional click handler for custom link behavior */\n onClick?: () => void;\n /** Accessible label for screen readers (required for accessibility) */\n label: string;\n};\n\n/**\n * Represents a group of related links with a title\n */\nexport type LinkGroup = {\n /** Title for the group of links */\n title: ReactNode;\n /** Array of footer links in this group */\n links: FooterLink[];\n};\n\n/**\n * Props for the Footer component\n */\ntype FooterProps = {\n /** Optional array of link groups to display in the footer */\n links?: LinkGroup[];\n};\n\n/**\n * Footer Component\n *\n * A comprehensive footer component that displays the Intlayer logo, copyright information,\n * social networks, and organized groups of navigation links. Designed for responsive\n * layouts and optimal user experience across all devices.\n *\n * @component\n * @example\n * Basic usage without links:\n * ```tsx\n * <Footer />\n * ```\n *\n * @example\n * With organized link groups:\n * ```tsx\n * const footerLinks = [\n * {\n * title: 'Product',\n * links: [\n * { href: '/features', text: 'Features', label: 'Product features' },\n * { href: '/pricing', text: 'Pricing', label: 'Pricing information' },\n * { href: '/docs', text: 'Documentation', label: 'Product documentation' }\n * ]\n * },\n * {\n * title: 'Company',\n * links: [\n * { href: '/about', text: 'About Us', label: 'About the company' },\n * { href: '/careers', text: 'Careers', label: 'Job opportunities' },\n * { href: '/contact', text: 'Contact', label: 'Contact information' }\n * ]\n * }\n * ];\n *\n * <Footer links={footerLinks} />\n * ```\n *\n * @example\n * With custom click handlers:\n * ```tsx\n * const footerLinks = [\n * {\n * title: 'Actions',\n * links: [\n * {\n * href: '#',\n * text: 'Newsletter',\n * label: 'Subscribe to newsletter',\n * onClick: () => openNewsletterModal()\n * }\n * ]\n * }\n * ];\n *\n * <Footer links={footerLinks} />\n * ```\n *\n * Features:\n * - Responsive design that adapts to different screen sizes\n * - Intlayer branding with logo and copyright notice\n * - Integrated social network links\n * - Flexible link organization with titled groups\n * - Accessibility-compliant with proper ARIA labels\n * - Support for custom click handlers alongside href navigation\n * - Clean, modern design with proper spacing and typography\n *\n * Layout Structure:\n * - Left side (or top on mobile): Logo, copyright, and social links\n * - Right side (or bottom on mobile): Organized link groups\n * - Responsive breakpoints for optimal mobile experience\n *\n * Accessibility:\n * - Semantic HTML structure using <footer> tag\n * - All links include required aria-label attributes\n * - Proper heading hierarchy and keyboard navigation\n * - Screen reader friendly content organization\n * - Focus management for interactive elements\n *\n * @param props - Component properties\n * @param props.links - Optional array of link groups to display\n *\n * @returns A rendered footer with branding, social links, and optional navigation links\n */\nexport const Footer: FC<FooterProps> = ({ links }) => (\n <footer className=\"flex flex-auto flex-row flex-wrap items-center justify-around gap-10 p-6\">\n <aside className=\"flex flex-col items-center justify-between gap-3 md:w-1/4\">\n <LogoWithTextBelow className=\"size-full max-w-[120px]\" />\n <span className=\"text-center text-neutral text-xs\">\n © 2025 Intlayer, Inc.\n </span>\n <div className=\"flex flex-row gap-3\">\n <SocialNetworks />\n </div>\n </aside>\n <div className=\"m-auto flex w-full flex-row flex-wrap justify-around gap-x-3 gap-y-6 md:w-2/3\">\n {(links ?? []).map(({ title, links }) => (\n <div\n className=\"flex flex-col gap-2\"\n key={links.map((link) => link.href).join(',')}\n >\n <strong>{title}</strong>\n <div className=\"flex flex-col gap-3 text-sm\">\n {links.map((link) => (\n <a key={link.href} href={link.href} aria-label={link.label}>\n {link.text}\n </a>\n ))}\n </div>\n </div>\n ))}\n </div>\n </footer>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyHA,MAAaA,UAA2B,EAAE,YACxC,qBAAC;CAAO,WAAU;YAChB,qBAAC;EAAM,WAAU;;GACf,oBAAC,qBAAkB,WAAU,4BAA4B;GACzD,oBAAC;IAAK,WAAU;cAAmC;KAE5C;GACP,oBAAC;IAAI,WAAU;cACb,oBAAC,mBAAiB;KACd;;GACA,EACR,oBAAC;EAAI,WAAU;aACX,SAAS,EAAE,EAAE,KAAK,EAAE,OAAO,qBAC3B,qBAAC;GACC,WAAU;cAGV,oBAAC,sBAAQ,QAAe,EACxB,oBAAC;IAAI,WAAU;cACZC,QAAM,KAAK,SACV,oBAAC;KAAkB,MAAM,KAAK;KAAM,cAAY,KAAK;eAClD,KAAK;OADA,KAAK,KAET,CACJ;KACE;KATDA,QAAM,KAAK,SAAS,KAAK,KAAK,CAAC,KAAK,IAAI,CAUzC,CACN;GACE;EACC"}
1
+ {"version":3,"file":"index.mjs","names":["Footer: FC<FooterProps>","links"],"sources":["../../../../src/components/Footer/index.tsx"],"sourcesContent":["import type { FC, ReactNode } from 'react';\nimport { LogoWithTextBelow } from '../Logo';\nimport { SocialNetworks } from '../SocialNetworks';\n\n/**\n * Represents a single footer link with all necessary attributes\n */\nexport type FooterLink = {\n /** URL or path for the link */\n href: string;\n /** Display text or JSX element for the link */\n text: ReactNode;\n /** Optional click handler for custom link behavior */\n onClick?: () => void;\n /** Accessible label for screen readers (required for accessibility) */\n label: string;\n};\n\n/**\n * Represents a group of related links with a title\n */\nexport type LinkGroup = {\n /** Title for the group of links */\n title: ReactNode;\n /** Array of footer links in this group */\n links: FooterLink[];\n};\n\n/**\n * Props for the Footer component\n */\ntype FooterProps = {\n /** Optional array of link groups to display in the footer */\n links?: LinkGroup[];\n};\n\n/**\n * Footer Component\n *\n * A comprehensive footer component that displays the Intlayer logo, copyright information,\n * social networks, and organized groups of navigation links. Designed for responsive\n * layouts and optimal user experience across all devices.\n *\n * @component\n * @example\n * Basic usage without links:\n * ```tsx\n * <Footer />\n * ```\n *\n * @example\n * With organized link groups:\n * ```tsx\n * const footerLinks = [\n * {\n * title: 'Product',\n * links: [\n * { href: '/features', text: 'Features', label: 'Product features' },\n * { href: '/pricing', text: 'Pricing', label: 'Pricing information' },\n * { href: '/docs', text: 'Documentation', label: 'Product documentation' }\n * ]\n * },\n * {\n * title: 'Company',\n * links: [\n * { href: '/about', text: 'About Us', label: 'About the company' },\n * { href: '/careers', text: 'Careers', label: 'Job opportunities' },\n * { href: '/contact', text: 'Contact', label: 'Contact information' }\n * ]\n * }\n * ];\n *\n * <Footer links={footerLinks} />\n * ```\n *\n * @example\n * With custom click handlers:\n * ```tsx\n * const footerLinks = [\n * {\n * title: 'Actions',\n * links: [\n * {\n * href: '#',\n * text: 'Newsletter',\n * label: 'Subscribe to newsletter',\n * onClick: () => openNewsletterModal()\n * }\n * ]\n * }\n * ];\n *\n * <Footer links={footerLinks} />\n * ```\n *\n * Features:\n * - Responsive design that adapts to different screen sizes\n * - Intlayer branding with logo and copyright notice\n * - Integrated social network links\n * - Flexible link organization with titled groups\n * - Accessibility-compliant with proper ARIA labels\n * - Support for custom click handlers alongside href navigation\n * - Clean, modern design with proper spacing and typography\n *\n * Layout Structure:\n * - Left side (or top on mobile): Logo, copyright, and social links\n * - Right side (or bottom on mobile): Organized link groups\n * - Responsive breakpoints for optimal mobile experience\n *\n * Accessibility:\n * - Semantic HTML structure using <footer> tag\n * - All links include required aria-label attributes\n * - Proper heading hierarchy and keyboard navigation\n * - Screen reader friendly content organization\n * - Focus management for interactive elements\n *\n * @param props - Component properties\n * @param props.links - Optional array of link groups to display\n *\n * @returns A rendered footer with branding, social links, and optional navigation links\n */\nexport const Footer: FC<FooterProps> = ({ links }) => (\n <footer className=\"flex flex-auto flex-row flex-wrap items-center justify-around gap-10 p-6\">\n <aside className=\"flex flex-col items-center justify-between gap-3 md:w-1/4\">\n <LogoWithTextBelow className=\"size-full max-w-[120px]\" />\n <span className=\"text-center text-neutral text-xs\">\n © 2026 Intlayer, Inc.\n </span>\n <div className=\"flex flex-row gap-3\">\n <SocialNetworks />\n </div>\n </aside>\n <div className=\"m-auto flex w-full flex-row flex-wrap justify-around gap-x-3 gap-y-6 md:w-2/3\">\n {(links ?? []).map(({ title, links }) => (\n <div\n className=\"flex flex-col gap-2\"\n key={links.map((link) => link.href).join(',')}\n >\n <strong>{title}</strong>\n <div className=\"flex flex-col gap-3 text-sm\">\n {links.map((link) => (\n <a key={link.href} href={link.href} aria-label={link.label}>\n {link.text}\n </a>\n ))}\n </div>\n </div>\n ))}\n </div>\n </footer>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyHA,MAAaA,UAA2B,EAAE,YACxC,qBAAC;CAAO,WAAU;YAChB,qBAAC;EAAM,WAAU;;GACf,oBAAC,qBAAkB,WAAU,4BAA4B;GACzD,oBAAC;IAAK,WAAU;cAAmC;KAE5C;GACP,oBAAC;IAAI,WAAU;cACb,oBAAC,mBAAiB;KACd;;GACA,EACR,oBAAC;EAAI,WAAU;aACX,SAAS,EAAE,EAAE,KAAK,EAAE,OAAO,qBAC3B,qBAAC;GACC,WAAU;cAGV,oBAAC,sBAAQ,QAAe,EACxB,oBAAC;IAAI,WAAU;cACZC,QAAM,KAAK,SACV,oBAAC;KAAkB,MAAM,KAAK;KAAM,cAAY,KAAK;eAClD,KAAK;OADA,KAAK,KAET,CACJ;KACE;KATDA,QAAM,KAAK,SAAS,KAAK,KAAK,CAAC,KAAK,IAAI,CAUzC,CACN;GACE;EACC"}
@@ -1,6 +1,6 @@
1
1
  'use client';
2
2
 
3
- import { createContext, useId, useMemo } from "react";
3
+ import { createContext, useId } from "react";
4
4
  import { jsx } from "react/jsx-runtime";
5
5
 
6
6
  //#region src/components/Form/FormItem.tsx
@@ -8,10 +8,11 @@ const FormItem = ({ id: idProp, ...props }) => {
8
8
  const generatedId = useId();
9
9
  const stableId = idProp ?? generatedId;
10
10
  return /* @__PURE__ */ jsx(FormItemContext, {
11
- value: useMemo(() => ({ id: stableId }), [stableId]),
11
+ value: { id: stableId },
12
12
  children: /* @__PURE__ */ jsx("div", {
13
13
  className: "flex flex-col gap-2 p-2",
14
14
  id: stableId,
15
+ suppressHydrationWarning: true,
15
16
  ...props
16
17
  })
17
18
  });
@@ -1 +1 @@
1
- {"version":3,"file":"FormItem.mjs","names":["FormItem: FC<HTMLAttributes<HTMLDivElement>>"],"sources":["../../../../src/components/Form/FormItem.tsx"],"sourcesContent":["'use client';\n\nimport {\n createContext,\n type FC,\n type HTMLAttributes,\n useId,\n useMemo,\n} from 'react';\n\nexport const FormItem: FC<HTMLAttributes<HTMLDivElement>> = ({\n id: idProp,\n ...props\n}) => {\n const generatedId = useId();\n const stableId = idProp ?? generatedId;\n\n const memoValue = useMemo(\n () => ({\n id: stableId,\n }),\n [stableId]\n );\n\n return (\n <FormItemContext value={memoValue}>\n <div className=\"flex flex-col gap-2 p-2\" id={stableId} {...props} />\n </FormItemContext>\n );\n};\n\ntype FormItemContextValue = {\n id: string;\n};\n\nexport const FormItemContext = createContext<FormItemContextValue>(\n {} as FormItemContextValue\n);\n"],"mappings":";;;;;;AAUA,MAAaA,YAAgD,EAC3D,IAAI,QACJ,GAAG,YACC;CACJ,MAAM,cAAc,OAAO;CAC3B,MAAM,WAAW,UAAU;AAS3B,QACE,oBAAC;EAAgB,OARD,eACT,EACL,IAAI,UACL,GACD,CAAC,SAAS,CACX;YAIG,oBAAC;GAAI,WAAU;GAA0B,IAAI;GAAU,GAAI;IAAS;GACpD;;AAQtB,MAAa,kBAAkB,cAC7B,EAAE,CACH"}
1
+ {"version":3,"file":"FormItem.mjs","names":["FormItem: FC<HTMLAttributes<HTMLDivElement>>"],"sources":["../../../../src/components/Form/FormItem.tsx"],"sourcesContent":["'use client';\n\nimport { createContext, type FC, type HTMLAttributes, useId } from 'react';\n\nexport const FormItem: FC<HTMLAttributes<HTMLDivElement>> = ({\n id: idProp,\n ...props\n}) => {\n const generatedId = useId();\n const stableId = idProp ?? generatedId;\n\n const memoValue = {\n id: stableId,\n };\n\n return (\n <FormItemContext value={memoValue}>\n <div\n className=\"flex flex-col gap-2 p-2\"\n id={stableId}\n suppressHydrationWarning\n {...props}\n />\n </FormItemContext>\n );\n};\n\ntype FormItemContextValue = {\n id: string;\n};\n\nexport const FormItemContext = createContext<FormItemContextValue>(\n {} as FormItemContextValue\n);\n"],"mappings":";;;;;;AAIA,MAAaA,YAAgD,EAC3D,IAAI,QACJ,GAAG,YACC;CACJ,MAAM,cAAc,OAAO;CAC3B,MAAM,WAAW,UAAU;AAM3B,QACE,oBAAC;EAAgB,OALD,EAChB,IAAI,UACL;YAIG,oBAAC;GACC,WAAU;GACV,IAAI;GACJ;GACA,GAAI;IACJ;GACc;;AAQtB,MAAa,kBAAkB,cAC7B,EAAE,CACH"}
@@ -10,6 +10,7 @@ const FormLabelLayout = ({ children, isRequired, info, htmlFor, className }) =>
10
10
  children: [children && /* @__PURE__ */ jsxs(FormLabel, {
11
11
  htmlFor,
12
12
  id: `${htmlFor}-label`,
13
+ suppressHydrationWarning: true,
13
14
  className: clsx("font-bold", className),
14
15
  children: [children, /* @__PURE__ */ jsx(RequiredStar, { isRequired })]
15
16
  }), info && /* @__PURE__ */ jsx(InformationTag, { content: info })]
@@ -1 +1 @@
1
- {"version":3,"file":"FormLabelLayout.mjs","names":["FormLabelLayout: FC<FormLabelLayoutProps>"],"sources":["../../../../../src/components/Form/layout/FormLabelLayout.tsx"],"sourcesContent":["import { InformationTag } from '@components/InformationTag';\nimport { clsx } from 'clsx';\nimport type { FC, ReactNode } from 'react';\nimport { FormLabel } from '../FormLabel';\nimport { RequiredStar } from './RequiredStar';\n\nexport type FormLabelLayoutProps = {\n children?: ReactNode;\n isRequired?: boolean;\n info?: string;\n htmlFor?: string;\n className?: string;\n};\n\nexport const FormLabelLayout: FC<FormLabelLayoutProps> = ({\n children,\n isRequired,\n info,\n htmlFor,\n className,\n}) => (\n <div className=\"ml-1 flex gap-1 align-middle text-base leading-none\">\n {children && (\n <FormLabel\n htmlFor={htmlFor}\n id={`${htmlFor}-label`}\n className={clsx('font-bold', className)}\n >\n {children}\n <RequiredStar isRequired={isRequired} />\n </FormLabel>\n )}\n {info && <InformationTag content={info} />}\n </div>\n);\n"],"mappings":";;;;;;;AAcA,MAAaA,mBAA6C,EACxD,UACA,YACA,MACA,SACA,gBAEA,qBAAC;CAAI,WAAU;YACZ,YACC,qBAAC;EACU;EACT,IAAI,GAAG,QAAQ;EACf,WAAW,KAAK,aAAa,UAAU;aAEtC,UACD,oBAAC,gBAAyB,aAAc;GAC9B,EAEb,QAAQ,oBAAC,kBAAe,SAAS,OAAQ;EACtC"}
1
+ {"version":3,"file":"FormLabelLayout.mjs","names":["FormLabelLayout: FC<FormLabelLayoutProps>"],"sources":["../../../../../src/components/Form/layout/FormLabelLayout.tsx"],"sourcesContent":["import { InformationTag } from '@components/InformationTag';\nimport { clsx } from 'clsx';\nimport type { FC, ReactNode } from 'react';\nimport { FormLabel } from '../FormLabel';\nimport { RequiredStar } from './RequiredStar';\n\nexport type FormLabelLayoutProps = {\n children?: ReactNode;\n isRequired?: boolean;\n info?: string;\n htmlFor?: string;\n className?: string;\n};\n\nexport const FormLabelLayout: FC<FormLabelLayoutProps> = ({\n children,\n isRequired,\n info,\n htmlFor,\n className,\n}) => (\n <div className=\"ml-1 flex gap-1 align-middle text-base leading-none\">\n {children && (\n <FormLabel\n htmlFor={htmlFor}\n id={`${htmlFor}-label`}\n suppressHydrationWarning\n className={clsx('font-bold', className)}\n >\n {children}\n <RequiredStar isRequired={isRequired} />\n </FormLabel>\n )}\n {info && <InformationTag content={info} />}\n </div>\n);\n"],"mappings":";;;;;;;AAcA,MAAaA,mBAA6C,EACxD,UACA,YACA,MACA,SACA,gBAEA,qBAAC;CAAI,WAAU;YACZ,YACC,qBAAC;EACU;EACT,IAAI,GAAG,QAAQ;EACf;EACA,WAAW,KAAK,aAAa,UAAU;aAEtC,UACD,oBAAC,gBAAyB,aAAc;GAC9B,EAEb,QAAQ,oBAAC,kBAAe,SAAS,OAAQ;EACtC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Link.mjs","names":["Link: FC<LinkProps>"],"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { getLocalizedUrl } from '@intlayer/core';\nimport type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink, MoveRight } from 'lucide-react';\nimport {\n type AnchorHTMLAttributes,\n type DetailedHTMLProps,\n type FC,\n isValidElement,\n type ReactNode,\n} from 'react';\n\n/**\n * Visual style variants for Link component\n */\nexport enum LinkVariant {\n DEFAULT = 'default',\n INVISIBLE_LINK = 'invisible-link',\n BUTTON = 'button',\n BUTTON_OUTLINED = 'button-outlined',\n HOVERABLE = 'hoverable',\n}\n\n/**\n * Color theme variants for Link component\n */\nexport enum LinkColor {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n DESTRUCTIVE = 'destructive',\n NEUTRAL = 'neutral',\n LIGHT = 'light',\n DARK = 'dark',\n TEXT = 'text',\n TEXT_INVERSE = 'text-inverse',\n ERROR = 'error',\n SUCCESS = 'success',\n CUSTOM = 'custom',\n}\n\nexport enum LinkRoundedSize {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n TWO_XL = '2xl',\n THREE_XL = '3xl',\n FULL = 'full',\n}\n\nexport enum LinkSize {\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n CUSTOM = 'custom',\n}\n\nexport enum LinkUnderlined {\n DEFAULT = 'default',\n TRUE = 'true',\n FALSE = 'false',\n}\n\nexport const linkVariants = cva(\n 'gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n {\n variants: {\n variant: {\n [`${LinkVariant.DEFAULT}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-4 hover:bg-current/0 hover:underline',\n [`${LinkVariant.INVISIBLE_LINK}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-4 hover:bg-current/0',\n\n [`${LinkVariant.BUTTON}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 *:text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.BUTTON_OUTLINED}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 *:text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.HOVERABLE}`]:\n 'block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5',\n },\n roundedSize: {\n [`${LinkRoundedSize.NONE}`]: 'rounded-none',\n [`${LinkRoundedSize.SM}`]:\n 'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n [`${LinkRoundedSize.MD}`]:\n 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n [`${LinkRoundedSize.LG}`]:\n 'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n [`${LinkRoundedSize.XL}`]:\n 'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n [`${LinkRoundedSize.TWO_XL}`]:\n 'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n [`${LinkRoundedSize.THREE_XL}`]:\n 'rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]',\n [`${LinkRoundedSize.FULL}`]: 'rounded-full',\n },\n color: {\n [`${LinkColor.PRIMARY}`]: 'text-primary',\n [`${LinkColor.SECONDARY}`]: 'text-secondary',\n [`${LinkColor.DESTRUCTIVE}`]: 'text-destructive',\n [`${LinkColor.NEUTRAL}`]: 'text-neutral',\n [`${LinkColor.LIGHT}`]: 'text-white',\n [`${LinkColor.DARK}`]: 'text-neutral-800',\n [`${LinkColor.TEXT}`]: 'text-text',\n [`${LinkColor.TEXT_INVERSE}`]: 'text-text-opposite',\n [`${LinkColor.ERROR}`]: 'text-error',\n [`${LinkColor.SUCCESS}`]: 'text-success',\n [`${LinkColor.CUSTOM}`]: '',\n },\n size: {\n [`${LinkSize.SM}`]: 'text-sm',\n [`${LinkSize.MD}`]: 'text-base',\n [`${LinkSize.LG}`]: 'text-lg',\n [`${LinkSize.XL}`]: 'text-xl',\n [`${LinkSize.CUSTOM}`]: '',\n },\n underlined: {\n [LinkUnderlined.DEFAULT]: '',\n [LinkUnderlined.TRUE]: 'underline',\n [LinkUnderlined.FALSE]: 'no-underline',\n },\n },\n // Compound variants handle height and padding\n compoundVariants: [\n // ---------------------------------------------------------\n // FIX START: Correctly Handle Contrast for TEXT_INVERSE\n // ---------------------------------------------------------\n {\n // Filled Button + Inverse Color (e.g., White Button):\n // 1. We DO NOT override parent text color (it must remain 'text-opposite' so bg-current is white).\n // 2. We ONLY override children to be 'text-text' (Dark) so they show up on white.\n variant: LinkVariant.BUTTON,\n color: LinkColor.TEXT_INVERSE,\n class: '*:text-text',\n },\n {\n // Outlined Button + Inverse Color (e.g., White Border):\n // 1. Parent is 'text-opposite' (Border is white).\n // 2. Children must also be 'text-opposite' (White text) to show on dark background.\n variant: LinkVariant.BUTTON_OUTLINED,\n color: LinkColor.TEXT_INVERSE,\n class: 'text-text-opposite *:text-text-opposite',\n },\n // ---------------------------------------------------------\n // FIX END\n // ---------------------------------------------------------\n\n // Min height and padding for button variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.SM,\n class: 'min-h-7 px-3 max-md:py-1',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.MD,\n class: 'min-h-8 px-6 max-md:py-2',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.LG,\n class: 'min-h-10 px-8 max-md:py-3',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.XL,\n class: 'min-h-11 px-10 max-md:py-4',\n },\n // Ring color variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.PRIMARY,\n class: 'ring-primary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SECONDARY,\n class: 'ring-secondary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DESTRUCTIVE,\n class: 'ring-destructive/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.NEUTRAL,\n class: 'ring-neutral/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.LIGHT,\n class: 'ring-white/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DARK,\n class: 'ring-neutral-800/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT,\n class: 'ring-text/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT_INVERSE,\n class: 'ring-text-opposite/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.ERROR,\n class: 'ring-error/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SUCCESS,\n class: 'ring-success/20',\n },\n ],\n\n defaultVariants: {\n variant: LinkVariant.DEFAULT,\n color: LinkColor.PRIMARY,\n roundedSize: LinkRoundedSize.MD,\n underlined: LinkUnderlined.DEFAULT,\n size: LinkSize.MD,\n },\n }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n HTMLAnchorElement\n> &\n VariantProps<typeof linkVariants> & {\n label: string;\n isExternalLink?: boolean;\n isPageSection?: boolean;\n isActive?: boolean;\n locale?: LocalesValues;\n };\n\nexport const checkIsExternalLink = ({\n href,\n isExternalLink: isExternalLinkProp,\n}: LinkProps): boolean => {\n const isValidHref = typeof href === 'string' && href.trim() !== '';\n const isExternalLink =\n isExternalLinkProp === true ||\n (typeof isExternalLinkProp === 'undefined' &&\n isValidHref &&\n /^https?:\\/\\//.test(href));\n\n return isExternalLink;\n};\n\nexport const isTextChildren = (children: ReactNode): boolean => {\n if (typeof children === 'string' || typeof children === 'number') {\n return true;\n }\n if (Array.isArray(children)) {\n return children.every(isTextChildren);\n }\n if (isValidElement(children)) {\n return isTextChildren(\n (children.props as { children?: ReactNode }).children\n );\n }\n return false;\n};\n\nexport const Link: FC<LinkProps> = (props) => {\n const {\n variant = LinkVariant.DEFAULT,\n color = LinkColor.PRIMARY,\n roundedSize,\n children,\n label,\n className,\n isActive,\n underlined,\n locale,\n size,\n isExternalLink: isExternalLinkProp,\n isPageSection: isPageSectionProp,\n href: hrefProp,\n ...otherProps\n } = props;\n\n const isExternalLink = isExternalLinkProp ?? checkIsExternalLink(props);\n const isPageSection = isPageSectionProp ?? hrefProp?.startsWith('#') ?? false;\n\n const isChildrenString = isTextChildren(children);\n const isButton =\n variant === LinkVariant.BUTTON || variant === LinkVariant.BUTTON_OUTLINED;\n\n const rel = isExternalLink ? 'noopener noreferrer nofollow' : undefined;\n\n const target = isExternalLink ? '_blank' : '_self';\n\n const href =\n locale && hrefProp && !isExternalLink && !isPageSection\n ? getLocalizedUrl(hrefProp, locale)\n : hrefProp;\n\n return (\n <a\n href={href}\n aria-label={label}\n rel={rel}\n target={target}\n aria-current={isActive ? 'page' : undefined}\n className={cn(\n linkVariants({\n variant,\n color,\n roundedSize,\n underlined,\n size,\n className,\n })\n )}\n {...otherProps}\n >\n {isButton && isChildrenString ? <span>{children}</span> : children}\n\n {isExternalLink && isChildrenString && (\n <ExternalLink className=\"ml-2 inline-block size-4\" />\n )}\n {isPageSection && <MoveRight className=\"ml-2 inline-block size-4\" />}\n </a>\n );\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"Link.mjs","names":["Link: FC<LinkProps>"],"sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { getLocalizedUrl } from '@intlayer/core';\nimport type { LocalesValues } from '@intlayer/types';\nimport { cn } from '@utils/cn';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { ExternalLink, MoveRight } from 'lucide-react';\nimport {\n type AnchorHTMLAttributes,\n type DetailedHTMLProps,\n type FC,\n isValidElement,\n type ReactNode,\n} from 'react';\n\n/**\n * Visual style variants for Link component\n */\nexport enum LinkVariant {\n DEFAULT = 'default',\n INVISIBLE_LINK = 'invisible-link',\n BUTTON = 'button',\n BUTTON_OUTLINED = 'button-outlined',\n HOVERABLE = 'hoverable',\n}\n\n/**\n * Color theme variants for Link component\n */\nexport enum LinkColor {\n PRIMARY = 'primary',\n SECONDARY = 'secondary',\n DESTRUCTIVE = 'destructive',\n NEUTRAL = 'neutral',\n LIGHT = 'light',\n DARK = 'dark',\n TEXT = 'text',\n TEXT_INVERSE = 'text-inverse',\n ERROR = 'error',\n SUCCESS = 'success',\n CUSTOM = 'custom',\n}\n\nexport enum LinkRoundedSize {\n NONE = 'none',\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n TWO_XL = '2xl',\n THREE_XL = '3xl',\n FULL = 'full',\n}\n\nexport enum LinkSize {\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n CUSTOM = 'custom',\n}\n\nexport enum LinkUnderlined {\n DEFAULT = 'default',\n TRUE = 'true',\n FALSE = 'false',\n}\n\nexport const linkVariants = cva(\n 'gap-3 transition-all duration-300 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50',\n {\n variants: {\n variant: {\n [`${LinkVariant.DEFAULT}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-4 hover:bg-current/0 hover:underline',\n [`${LinkVariant.INVISIBLE_LINK}`]:\n 'h-auto justify-start border-inherit bg-current/0 px-1 underline-offset-4 hover:bg-current/0',\n\n [`${LinkVariant.BUTTON}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full bg-current text-center font-medium text-text ring-0 *:text-text-opposite hover:bg-current/90 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.BUTTON_OUTLINED}`]:\n 'relative flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full border-[1.3px] border-current text-center font-medium text-text ring-0 *:text-text hover:bg-current/20 hover:ring-5 aria-selected:ring-5',\n\n [`${LinkVariant.HOVERABLE}`]:\n 'block rounded-lg border-none bg-current/0 hover:bg-current/10 aria-[current]:bg-current/5',\n },\n roundedSize: {\n [`${LinkRoundedSize.NONE}`]: 'rounded-none',\n [`${LinkRoundedSize.SM}`]:\n 'rounded-lg [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-xl',\n [`${LinkRoundedSize.MD}`]:\n 'rounded-xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-2xl',\n [`${LinkRoundedSize.LG}`]:\n 'rounded-2xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-3xl',\n [`${LinkRoundedSize.XL}`]:\n 'rounded-3xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-4xl',\n [`${LinkRoundedSize.TWO_XL}`]:\n 'rounded-4xl [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[2.5rem]',\n [`${LinkRoundedSize.THREE_XL}`]:\n 'rounded-[2.5rem] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[3rem]',\n [`${LinkRoundedSize.FULL}`]: 'rounded-full',\n },\n color: {\n [`${LinkColor.PRIMARY}`]: 'text-primary',\n [`${LinkColor.SECONDARY}`]: 'text-secondary',\n [`${LinkColor.DESTRUCTIVE}`]: 'text-destructive',\n [`${LinkColor.NEUTRAL}`]: 'text-neutral',\n [`${LinkColor.LIGHT}`]: 'text-white',\n [`${LinkColor.DARK}`]: 'text-neutral-800',\n [`${LinkColor.TEXT}`]: 'text-text',\n [`${LinkColor.TEXT_INVERSE}`]: 'text-text-opposite',\n [`${LinkColor.ERROR}`]: 'text-error',\n [`${LinkColor.SUCCESS}`]: 'text-success',\n [`${LinkColor.CUSTOM}`]: '',\n },\n size: {\n [`${LinkSize.SM}`]: 'text-sm',\n [`${LinkSize.MD}`]: 'text-base',\n [`${LinkSize.LG}`]: 'text-lg',\n [`${LinkSize.XL}`]: 'text-xl',\n [`${LinkSize.CUSTOM}`]: '',\n },\n underlined: {\n [LinkUnderlined.DEFAULT]: '',\n [LinkUnderlined.TRUE]: 'underline',\n [LinkUnderlined.FALSE]: 'no-underline',\n },\n },\n // Compound variants handle height and padding\n compoundVariants: [\n // ---------------------------------------------------------\n // FIX START: Correctly Handle Contrast for TEXT_INVERSE\n // ---------------------------------------------------------\n {\n // Filled Button + Inverse Color (e.g., White Button):\n // We DO NOT override parent text color (it must remain 'text-opposite' so bg-current is white).\n // We ONLY override children to be 'text-text' (Dark) so they show up on white.\n variant: LinkVariant.BUTTON,\n color: LinkColor.TEXT_INVERSE,\n class: '*:text-text',\n },\n {\n // Outlined Button + Inverse Color (e.g., White Border):\n // Parent is 'text-opposite' (Border is white).\n // Children must also be 'text-opposite' (White text) to show on dark background.\n variant: LinkVariant.BUTTON_OUTLINED,\n color: LinkColor.TEXT_INVERSE,\n class: 'text-text-opposite *:text-text-opposite',\n },\n\n // Min height and padding for button variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.SM,\n class: 'min-h-7 px-3 max-md:py-1',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.MD,\n class: 'min-h-8 px-6 max-md:py-2',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.LG,\n class: 'min-h-10 px-8 max-md:py-3',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n size: LinkSize.XL,\n class: 'min-h-11 px-10 max-md:py-4',\n },\n // Ring color variants\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.PRIMARY,\n class: 'ring-primary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SECONDARY,\n class: 'ring-secondary/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DESTRUCTIVE,\n class: 'ring-destructive/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.NEUTRAL,\n class: 'ring-neutral/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.LIGHT,\n class: 'ring-white/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.DARK,\n class: 'ring-neutral-800/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT,\n class: 'ring-text/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.TEXT_INVERSE,\n class: 'ring-text-opposite/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.ERROR,\n class: 'ring-error/20',\n },\n {\n variant: [LinkVariant.BUTTON, LinkVariant.BUTTON_OUTLINED],\n color: LinkColor.SUCCESS,\n class: 'ring-success/20',\n },\n ],\n\n defaultVariants: {\n variant: LinkVariant.DEFAULT,\n color: LinkColor.PRIMARY,\n roundedSize: LinkRoundedSize.MD,\n underlined: LinkUnderlined.DEFAULT,\n size: LinkSize.MD,\n },\n }\n);\n\nexport type LinkProps = DetailedHTMLProps<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n HTMLAnchorElement\n> &\n VariantProps<typeof linkVariants> & {\n label: string;\n isExternalLink?: boolean;\n isPageSection?: boolean;\n isActive?: boolean;\n locale?: LocalesValues;\n };\n\nexport const checkIsExternalLink = ({\n href,\n isExternalLink: isExternalLinkProp,\n}: LinkProps): boolean => {\n const isValidHref = typeof href === 'string' && href.trim() !== '';\n const isExternalLink =\n isExternalLinkProp === true ||\n (typeof isExternalLinkProp === 'undefined' &&\n isValidHref &&\n /^https?:\\/\\//.test(href));\n\n return isExternalLink;\n};\n\nexport const isTextChildren = (children: ReactNode): boolean => {\n if (typeof children === 'string' || typeof children === 'number') {\n return true;\n }\n if (Array.isArray(children)) {\n return children.every(isTextChildren);\n }\n if (isValidElement(children)) {\n return isTextChildren(\n (children.props as { children?: ReactNode }).children\n );\n }\n return false;\n};\n\nexport const Link: FC<LinkProps> = (props) => {\n const {\n variant = LinkVariant.DEFAULT,\n color = LinkColor.PRIMARY,\n roundedSize,\n children,\n label,\n className,\n isActive,\n underlined,\n locale,\n size,\n isExternalLink: isExternalLinkProp,\n isPageSection: isPageSectionProp,\n href: hrefProp,\n ...otherProps\n } = props;\n\n const isExternalLink = isExternalLinkProp ?? checkIsExternalLink(props);\n const isPageSection = isPageSectionProp ?? hrefProp?.startsWith('#') ?? false;\n\n const isChildrenString = isTextChildren(children);\n const isButton =\n variant === LinkVariant.BUTTON || variant === LinkVariant.BUTTON_OUTLINED;\n\n const rel = isExternalLink ? 'noopener noreferrer nofollow' : undefined;\n\n const target = isExternalLink ? '_blank' : '_self';\n\n const href =\n locale && hrefProp && !isExternalLink && !isPageSection\n ? getLocalizedUrl(hrefProp, locale)\n : hrefProp;\n\n return (\n <a\n href={href}\n aria-label={label}\n rel={rel}\n target={target}\n aria-current={isActive ? 'page' : undefined}\n className={cn(\n linkVariants({\n variant,\n color,\n roundedSize,\n underlined,\n size,\n className,\n })\n )}\n {...otherProps}\n >\n {isButton && isChildrenString ? <span>{children}</span> : children}\n\n {isExternalLink && isChildrenString && (\n <ExternalLink className=\"ml-2 inline-block size-4\" />\n )}\n {isPageSection && <MoveRight className=\"ml-2 inline-block size-4\" />}\n </a>\n );\n};\n"],"mappings":"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"}
@@ -18,23 +18,14 @@ import { createPortal } from "react-dom";
18
18
  * Enumeration of available modal sizes
19
19
  */
20
20
  let ModalSize = /* @__PURE__ */ function(ModalSize$1) {
21
- /** Small modal: max height 30vh, max width xl */
22
21
  ModalSize$1["SM"] = "sm";
23
- /** Medium modal: max height 50vh, max width xl */
24
22
  ModalSize$1["MD"] = "md";
25
- /** Large modal: max height 70vh, max width 2xl */
26
23
  ModalSize$1["LG"] = "lg";
27
- /** Extra large modal: max height 95vh, max width 6xl */
28
24
  ModalSize$1["XL"] = "xl";
29
- /** Unset size: max height 95vh, full width responsive */
30
25
  ModalSize$1["UNSET"] = "unset";
31
26
  return ModalSize$1;
32
27
  }({});
33
- /**
34
- * Class name variants for different modal sizes using class-variance-authority
35
- * Defines responsive sizing and scrollable content for modal containers
36
- */
37
- const modalVariants = cva("flex cursor-default flex-col p-3 shadow-sm", {
28
+ const modalVariants = cva("flex cursor-default flex-col overflow-hidden shadow-sm", {
38
29
  variants: { size: {
39
30
  sm: "h-auto max-h-[30vh] w-[95vw] max-w-xl",
40
31
  md: "h-auto max-h-[50vh] w-[95vw] max-w-xl",
@@ -44,10 +35,14 @@ const modalVariants = cva("flex cursor-default flex-col p-3 shadow-sm", {
44
35
  } },
45
36
  defaultVariants: { size: "unset" }
46
37
  });
47
- /**
48
- * Motion-enabled modal component with Framer Motion support
49
- * Extends Container component with motion capabilities for animations
50
- */
38
+ const contentPaddingVariants = {
39
+ none: "p-0",
40
+ sm: "px-2 py-4",
41
+ md: "px-4 py-6",
42
+ lg: "px-6 py-8",
43
+ xl: "px-8 py-10",
44
+ "2xl": "px-10 py-12"
45
+ };
51
46
  const MotionModal = motion.create(Container);
52
47
  /**
53
48
  * Modal Component
@@ -116,7 +111,7 @@ const MotionModal = motion.create(Container);
116
111
  * @param props - Modal component props
117
112
  * @returns JSX element rendered via createPortal
118
113
  */
119
- const Modal = ({ children, isOpen, container, disableScroll = true, onClose, hasCloseButton = false, title, size = ModalSize.MD, className, ...props }) => {
114
+ const Modal = ({ children, isOpen, container, disableScroll = true, onClose, hasCloseButton = false, title, size = ModalSize.MD, className, isScrollable = false, padding = "none", ...props }) => {
120
115
  const containerElement = useGetElementOrWindow(container);
121
116
  useScrollBlockage({
122
117
  key: "modal",
@@ -133,8 +128,9 @@ const Modal = ({ children, isOpen, container, disableScroll = true, onClose, has
133
128
  }, [isOpen, onClose]);
134
129
  if (!containerElement) return /* @__PURE__ */ jsx(Fragment$1, {});
135
130
  const hasTitle = typeof title === "string";
131
+ const contentPaddingClass = contentPaddingVariants[padding || "none"];
136
132
  return createPortal(/* @__PURE__ */ jsx(motion.div, {
137
- className: "invisible fixed top-0 left-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto bg-background/40 backdrop-blur",
133
+ className: "invisible fixed top-0 left-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-hidden bg-background/40 backdrop-blur",
138
134
  animate: isOpen ? "visible" : "invisible",
139
135
  variants: {
140
136
  visible: {
@@ -171,11 +167,12 @@ const Modal = ({ children, isOpen, container, disableScroll = true, onClose, has
171
167
  role: "dialog",
172
168
  "aria-modal": true,
173
169
  roundedSize: "4xl",
170
+ padding: "none",
174
171
  ...props,
175
172
  children: [/* @__PURE__ */ jsxs("div", {
176
- className: cn("cursor-default", hasCloseButton && hasTitle ? `flex items-start` : hasCloseButton ? `flex justify-end` : hasTitle ? `items-center` : `hidden`),
173
+ className: cn("relative flex-none px-4 pt-4", hasCloseButton && hasTitle ? `flex items-start` : hasCloseButton ? `flex justify-end` : hasTitle ? `items-center` : `hidden`),
177
174
  children: [hasTitle && /* @__PURE__ */ jsx(H3, {
178
- className: "mt-2 mb-4 ml-4 flex items-center justify-center font-bold text-lg",
175
+ className: "mb-2 ml-1 flex items-center justify-center font-bold text-lg",
179
176
  children: title
180
177
  }), hasCloseButton && /* @__PURE__ */ jsx(Button, {
181
178
  variant: ButtonVariant.HOVERABLE,
@@ -190,8 +187,11 @@ const Modal = ({ children, isOpen, container, disableScroll = true, onClose, has
190
187
  size: ButtonSize.ICON_MD
191
188
  })]
192
189
  }), /* @__PURE__ */ jsx("div", {
193
- className: "flex w-full flex-1 flex-col",
194
- children
190
+ className: cn("flex min-h-0 w-full flex-1 flex-col", isScrollable === true && "overflow-auto", isScrollable === "y" && "overflow-y-auto overflow-x-hidden", isScrollable === "x" && "overflow-x-auto overflow-y-hidden", !isScrollable && "overflow-visible"),
191
+ children: /* @__PURE__ */ jsx("div", {
192
+ className: cn("h-full w-full", contentPaddingClass),
193
+ children
194
+ })
195
195
  })]
196
196
  })
197
197
  }), containerElement);
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.mjs","names":["m","Modal: FC<ModalProps>"],"sources":["../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { useGetElementOrWindow, useScrollBlockage } from '@hooks/index';\nimport { cn } from '@utils/cn';\nimport { cva } from 'class-variance-authority';\nimport { motion as m } from 'framer-motion';\nimport { X } from 'lucide-react';\nimport { type FC, type ReactNode, useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { Button, ButtonColor, ButtonSize, ButtonVariant } from '../Button';\nimport { Container, type ContainerProps } from '../Container';\nimport { H3 } from '../Headers';\n\n/**\n * Enumeration of available modal sizes\n */\nexport enum ModalSize {\n /** Small modal: max height 30vh, max width xl */\n SM = 'sm',\n /** Medium modal: max height 50vh, max width xl */\n MD = 'md',\n /** Large modal: max height 70vh, max width 2xl */\n LG = 'lg',\n /** Extra large modal: max height 95vh, max width 6xl */\n XL = 'xl',\n /** Unset size: max height 95vh, full width responsive */\n UNSET = 'unset',\n}\n\n/**\n * Props for the Modal component\n */\ntype ModalProps = {\n /** Content to be displayed inside the modal */\n children: ReactNode;\n /** Controls whether the modal is visible */\n isOpen: boolean;\n /** Callback function called when the modal should be closed */\n onClose?: () => void;\n /** Container element to render the modal into (defaults to document.body) */\n container?: HTMLElement;\n /** Whether to disable scrolling on the background content */\n disableScroll?: boolean;\n /** Whether to display a close button in the modal header */\n hasCloseButton?: boolean;\n /** Optional title displayed at the top of the modal */\n title?: string;\n /** Size variant for the modal */\n size?: ModalSize | `${ModalSize}`;\n} & Pick<\n ContainerProps,\n | 'className'\n | 'transparency'\n | 'border'\n | 'background'\n | 'roundedSize'\n | 'borderColor'\n | 'padding'\n | 'separator'\n | 'gap'\n>;\n\n/**\n * Class name variants for different modal sizes using class-variance-authority\n * Defines responsive sizing and scrollable content for modal containers\n */\nconst modalVariants = cva('flex cursor-default flex-col p-3 shadow-sm', {\n variants: {\n size: {\n /** Small modal: height auto, max-height 30vh, width 95vw, max-width xl */\n sm: 'h-auto max-h-[30vh] w-[95vw] max-w-xl',\n /** Medium modal: height auto, max-height 50vh, width 95vw, max-width xl */\n md: 'h-auto max-h-[50vh] w-[95vw] max-w-xl',\n /** Large modal: height auto, max-height 70vh, width 95vw, max-width 2xl */\n lg: 'h-auto max-h-[70vh] w-[95vw] max-w-2xl',\n /** Extra large modal: height auto, max-height 95vh, width 95vw, max-width 6xl */\n xl: 'h-auto max-h-[95vh] w-[95vw] max-w-6xl',\n /** Unset modal: height auto, max-height 95vh, width 95vw, no max-width */\n unset: 'h-auto max-h-[95vh] w-[95vw]',\n },\n },\n defaultVariants: {\n size: 'unset',\n },\n});\n\n/**\n * Motion-enabled modal component with Framer Motion support\n * Extends Container component with motion capabilities for animations\n */\nconst MotionModal = m.create(Container);\n\n/**\n * Modal Component\n *\n * A highly customizable modal dialog component with portal rendering, Framer Motion animations,\n * and comprehensive accessibility features. Supports multiple size variants and scroll management.\n *\n * Features:\n * - Portal rendering to any container element (defaults to document.body)\n * - Smooth animations with Framer Motion\n * - Size variants: SM, MD, LG, XL, UNSET with responsive sizing\n * - Optional title and close button\n * - Background scroll prevention\n * - Click-outside-to-close functionality\n * - Full accessibility support with ARIA attributes\n * - Keyboard navigation support (ESC to close)\n * - Extensible styling with Container props\n *\n * @example\n * Basic usage:\n * ```jsx\n * <Modal isOpen={isModalOpen} onClose={() => setIsModalOpen(false)}>\n * <p>Modal content goes here</p>\n * </Modal>\n * ```\n *\n * @example\n * With title and close button:\n * ```jsx\n * <Modal\n * isOpen={isOpen}\n * onClose={onClose}\n * title=\"Confirm Action\"\n * hasCloseButton\n * size={ModalSize.LG}\n * >\n * <div>\n * <p>Are you sure you want to continue?</p>\n * <Button onClick={onConfirm}>Confirm</Button>\n * </div>\n * </Modal>\n * ```\n *\n * @example\n * Custom container and styling:\n * ```jsx\n * <Modal\n * isOpen={isOpen}\n * onClose={onClose}\n * container={customContainer}\n * background=\"card\"\n * padding=\"lg\"\n * border=\"default\"\n * >\n * Content with custom styling\n * </Modal>\n * ```\n *\n * Accessibility Notes:\n * - Modal receives focus when opened\n * - Background content is hidden from screen readers when modal is open\n * - ESC key closes modal (handled by browser for role=\"dialog\")\n * - Click outside modal closes it\n * - Close button has descriptive label for screen readers\n *\n * @param props - Modal component props\n * @returns JSX element rendered via createPortal\n */\nexport const Modal: FC<ModalProps> = ({\n children,\n isOpen,\n container,\n disableScroll = true,\n onClose,\n hasCloseButton = false,\n title,\n size = ModalSize.MD,\n className,\n ...props\n}) => {\n const containerElement = useGetElementOrWindow(container);\n\n useScrollBlockage({ key: 'modal', disableScroll: isOpen && disableScroll });\n\n useEffect(() => {\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === 'Escape' && isOpen && onClose) {\n onClose();\n }\n };\n\n document.addEventListener('keydown', handleEscape);\n\n return () => {\n document.removeEventListener('keydown', handleEscape);\n };\n }, [isOpen, onClose]);\n\n if (!containerElement) return <></>;\n\n const hasTitle = typeof title === 'string';\n\n return createPortal(\n <m.div\n className=\"invisible fixed top-0 left-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-auto bg-background/40 backdrop-blur\"\n animate={isOpen ? 'visible' : 'invisible'}\n variants={{\n visible: {\n opacity: 1,\n visibility: 'visible',\n transition: { duration: 0.1, when: 'beforeChildren' },\n },\n invisible: {\n opacity: 0,\n visibility: 'hidden',\n transition: { duration: 0.1, when: 'afterChildren' },\n },\n }}\n onClick={(e) => {\n e.stopPropagation();\n onClose?.();\n }}\n aria-hidden={!isOpen}\n >\n <MotionModal\n onClick={(e) => e.stopPropagation()}\n initial={{ scale: isOpen ? 0.5 : 1 }}\n animate={{ scale: isOpen ? 1 : 0.5 }}\n transition={{ duration: 0.3 }}\n className={modalVariants({\n size,\n className,\n })}\n role=\"dialog\"\n aria-modal\n roundedSize=\"4xl\"\n {...props}\n >\n <div\n className={cn(\n 'cursor-default',\n hasCloseButton && hasTitle\n ? `flex items-start`\n : hasCloseButton\n ? `flex justify-end`\n : hasTitle\n ? `items-center`\n : `hidden`\n )}\n >\n {hasTitle && (\n <H3 className=\"mt-2 mb-4 ml-4 flex items-center justify-center font-bold text-lg\">\n {title}\n </H3>\n )}\n {hasCloseButton && (\n <Button\n variant={ButtonVariant.HOVERABLE}\n color={ButtonColor.TEXT}\n label=\"Close modal\"\n className=\"ml-auto\"\n onClick={(e) => {\n e.stopPropagation();\n onClose?.();\n }}\n Icon={X}\n size={ButtonSize.ICON_MD}\n />\n )}\n </div>\n <div className=\"flex w-full flex-1 flex-col\">{children}</div>\n </MotionModal>\n </m.div>,\n containerElement\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBA,IAAY,kDAAL;;AAEL;;AAEA;;AAEA;;AAEA;;AAEA;;;;;;;AAwCF,MAAM,gBAAgB,IAAI,8CAA8C;CACtE,UAAU,EACR,MAAM;EAEJ,IAAI;EAEJ,IAAI;EAEJ,IAAI;EAEJ,IAAI;EAEJ,OAAO;EACR,EACF;CACD,iBAAiB,EACf,MAAM,SACP;CACF,CAAC;;;;;AAMF,MAAM,cAAcA,OAAE,OAAO,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqEvC,MAAaC,SAAyB,EACpC,UACA,QACA,WACA,gBAAgB,MAChB,SACA,iBAAiB,OACjB,OACA,OAAO,UAAU,IACjB,WACA,GAAG,YACC;CACJ,MAAM,mBAAmB,sBAAsB,UAAU;AAEzD,mBAAkB;EAAE,KAAK;EAAS,eAAe,UAAU;EAAe,CAAC;AAE3E,iBAAgB;EACd,MAAM,gBAAgB,UAAyB;AAC7C,OAAI,MAAM,QAAQ,YAAY,UAAU,QACtC,UAAS;;AAIb,WAAS,iBAAiB,WAAW,aAAa;AAElD,eAAa;AACX,YAAS,oBAAoB,WAAW,aAAa;;IAEtD,CAAC,QAAQ,QAAQ,CAAC;AAErB,KAAI,CAAC,iBAAkB,QAAO,mCAAK;CAEnC,MAAM,WAAW,OAAO,UAAU;AAElC,QAAO,aACL,oBAACD,OAAE;EACD,WAAU;EACV,SAAS,SAAS,YAAY;EAC9B,UAAU;GACR,SAAS;IACP,SAAS;IACT,YAAY;IACZ,YAAY;KAAE,UAAU;KAAK,MAAM;KAAkB;IACtD;GACD,WAAW;IACT,SAAS;IACT,YAAY;IACZ,YAAY;KAAE,UAAU;KAAK,MAAM;KAAiB;IACrD;GACF;EACD,UAAU,MAAM;AACd,KAAE,iBAAiB;AACnB,cAAW;;EAEb,eAAa,CAAC;YAEd,qBAAC;GACC,UAAU,MAAM,EAAE,iBAAiB;GACnC,SAAS,EAAE,OAAO,SAAS,KAAM,GAAG;GACpC,SAAS,EAAE,OAAO,SAAS,IAAI,IAAK;GACpC,YAAY,EAAE,UAAU,IAAK;GAC7B,WAAW,cAAc;IACvB;IACA;IACD,CAAC;GACF,MAAK;GACL;GACA,aAAY;GACZ,GAAI;cAEJ,qBAAC;IACC,WAAW,GACT,kBACA,kBAAkB,WACd,qBACA,iBACE,qBACA,WACE,iBACA,SACT;eAEA,YACC,oBAAC;KAAG,WAAU;eACX;MACE,EAEN,kBACC,oBAAC;KACC,SAAS,cAAc;KACvB,OAAO,YAAY;KACnB,OAAM;KACN,WAAU;KACV,UAAU,MAAM;AACd,QAAE,iBAAiB;AACnB,iBAAW;;KAEb,MAAM;KACN,MAAM,WAAW;MACjB;KAEA,EACN,oBAAC;IAAI,WAAU;IAA+B;KAAe;IACjD;GACR,EACR,iBACD"}
1
+ {"version":3,"file":"Modal.mjs","names":["m","Modal: FC<ModalProps>"],"sources":["../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["'use client';\n\nimport { useGetElementOrWindow, useScrollBlockage } from '@hooks/index';\nimport { cn } from '@utils/cn';\nimport { cva } from 'class-variance-authority';\nimport { motion as m } from 'framer-motion';\nimport { X } from 'lucide-react';\nimport { type FC, type ReactNode, useEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport { Button, ButtonColor, ButtonSize, ButtonVariant } from '../Button';\nimport { Container, type ContainerProps } from '../Container';\nimport { H3 } from '../Headers';\n\n/**\n * Enumeration of available modal sizes\n */\nexport enum ModalSize {\n SM = 'sm',\n MD = 'md',\n LG = 'lg',\n XL = 'xl',\n UNSET = 'unset',\n}\n\ntype ModalProps = {\n children: ReactNode;\n isOpen: boolean;\n onClose?: () => void;\n container?: HTMLElement;\n disableScroll?: boolean;\n hasCloseButton?: boolean;\n title?: string;\n size?: ModalSize | `${ModalSize}`;\n /**\n * Defines if the modal content area is scrollable.\n */\n isScrollable?: boolean | 'x' | 'y';\n} & Pick<\n ContainerProps,\n | 'className'\n | 'transparency'\n | 'border'\n | 'background'\n | 'roundedSize'\n | 'borderColor'\n | 'padding'\n | 'separator'\n | 'gap'\n>;\n\nconst modalVariants = cva(\n 'flex cursor-default flex-col overflow-hidden shadow-sm',\n {\n variants: {\n size: {\n sm: 'h-auto max-h-[30vh] w-[95vw] max-w-xl',\n md: 'h-auto max-h-[50vh] w-[95vw] max-w-xl',\n lg: 'h-auto max-h-[70vh] w-[95vw] max-w-2xl',\n xl: 'h-auto max-h-[95vh] w-[95vw] max-w-6xl',\n unset: 'h-auto max-h-[95vh] w-[95vw]',\n },\n },\n defaultVariants: {\n size: 'unset',\n },\n }\n);\n\n// Mapped from Container/index.tsx to apply internally\nconst contentPaddingVariants = {\n none: 'p-0',\n sm: 'px-2 py-4',\n md: 'px-4 py-6',\n lg: 'px-6 py-8',\n xl: 'px-8 py-10',\n '2xl': 'px-10 py-12',\n};\n\nconst MotionModal = m.create(Container);\n\n/**\n * Modal Component\n *\n * A highly customizable modal dialog component with portal rendering, Framer Motion animations,\n * and comprehensive accessibility features. Supports multiple size variants and scroll management.\n *\n * Features:\n * - Portal rendering to any container element (defaults to document.body)\n * - Smooth animations with Framer Motion\n * - Size variants: SM, MD, LG, XL, UNSET with responsive sizing\n * - Optional title and close button\n * - Background scroll prevention\n * - Click-outside-to-close functionality\n * - Full accessibility support with ARIA attributes\n * - Keyboard navigation support (ESC to close)\n * - Extensible styling with Container props\n *\n * @example\n * Basic usage:\n * ```jsx\n * <Modal isOpen={isModalOpen} onClose={() => setIsModalOpen(false)}>\n * <p>Modal content goes here</p>\n * </Modal>\n * ```\n *\n * @example\n * With title and close button:\n * ```jsx\n * <Modal\n * isOpen={isOpen}\n * onClose={onClose}\n * title=\"Confirm Action\"\n * hasCloseButton\n * size={ModalSize.LG}\n * >\n * <div>\n * <p>Are you sure you want to continue?</p>\n * <Button onClick={onConfirm}>Confirm</Button>\n * </div>\n * </Modal>\n * ```\n *\n * @example\n * Custom container and styling:\n * ```jsx\n * <Modal\n * isOpen={isOpen}\n * onClose={onClose}\n * container={customContainer}\n * background=\"card\"\n * padding=\"lg\"\n * border=\"default\"\n * >\n * Content with custom styling\n * </Modal>\n * ```\n *\n * Accessibility Notes:\n * - Modal receives focus when opened\n * - Background content is hidden from screen readers when modal is open\n * - ESC key closes modal (handled by browser for role=\"dialog\")\n * - Click outside modal closes it\n * - Close button has descriptive label for screen readers\n *\n * @param props - Modal component props\n * @returns JSX element rendered via createPortal\n */\nexport const Modal: FC<ModalProps> = ({\n children,\n isOpen,\n container,\n disableScroll = true,\n onClose,\n hasCloseButton = false,\n title,\n size = ModalSize.MD,\n className,\n isScrollable = false,\n padding = 'none', // Extract padding here\n ...props\n}) => {\n const containerElement = useGetElementOrWindow(container);\n\n useScrollBlockage({ key: 'modal', disableScroll: isOpen && disableScroll });\n\n useEffect(() => {\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === 'Escape' && isOpen && onClose) {\n onClose();\n }\n };\n document.addEventListener('keydown', handleEscape);\n return () => {\n document.removeEventListener('keydown', handleEscape);\n };\n }, [isOpen, onClose]);\n\n if (!containerElement) return <></>;\n\n const hasTitle = typeof title === 'string';\n\n // Determine the class for the inner content based on the padding prop\n const contentPaddingClass =\n contentPaddingVariants[\n (padding as keyof typeof contentPaddingVariants) || 'none'\n ];\n\n return createPortal(\n <m.div\n className=\"invisible fixed top-0 left-0 z-50 flex size-full cursor-pointer items-center justify-center overflow-hidden bg-background/40 backdrop-blur\"\n animate={isOpen ? 'visible' : 'invisible'}\n variants={{\n visible: {\n opacity: 1,\n visibility: 'visible',\n transition: { duration: 0.1, when: 'beforeChildren' },\n },\n invisible: {\n opacity: 0,\n visibility: 'hidden',\n transition: { duration: 0.1, when: 'afterChildren' },\n },\n }}\n onClick={(e) => {\n e.stopPropagation();\n onClose?.();\n }}\n aria-hidden={!isOpen}\n >\n <MotionModal\n onClick={(e) => e.stopPropagation()}\n initial={{ scale: isOpen ? 0.5 : 1 }}\n animate={{ scale: isOpen ? 1 : 0.5 }}\n transition={{ duration: 0.3 }}\n className={modalVariants({ size, className })}\n role=\"dialog\"\n aria-modal\n roundedSize=\"4xl\"\n // Force the outer container to have no padding so scrollbars hit the edge\n padding=\"none\"\n {...props}\n >\n {/* HEADER SECTION */}\n <div\n className={cn(\n 'relative flex-none px-4 pt-4',\n hasCloseButton && hasTitle\n ? `flex items-start`\n : hasCloseButton\n ? `flex justify-end`\n : hasTitle\n ? `items-center`\n : `hidden`\n )}\n >\n {hasTitle && (\n <H3 className=\"mb-2 ml-1 flex items-center justify-center font-bold text-lg\">\n {title}\n </H3>\n )}\n {hasCloseButton && (\n <Button\n variant={ButtonVariant.HOVERABLE}\n color={ButtonColor.TEXT}\n label=\"Close modal\"\n className=\"ml-auto\"\n onClick={(e) => {\n e.stopPropagation();\n onClose?.();\n }}\n Icon={X}\n size={ButtonSize.ICON_MD}\n />\n )}\n </div>\n\n {/* SCROLLABLE WRAPPER - Full width, no padding */}\n <div\n className={cn(\n 'flex min-h-0 w-full flex-1 flex-col',\n // Scrollbars will now appear at the very edge of this div (the modal edge)\n isScrollable === true && 'overflow-auto',\n isScrollable === 'y' && 'overflow-y-auto overflow-x-hidden',\n isScrollable === 'x' && 'overflow-x-auto overflow-y-hidden',\n !isScrollable && 'overflow-visible'\n )}\n >\n {/* CONTENT PADDING WRAPPER */}\n {/* We apply the padding class here, effectively putting content inside the scroll area */}\n <div className={cn('h-full w-full', contentPaddingClass)}>\n {children}\n </div>\n </div>\n </MotionModal>\n </m.div>,\n containerElement\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAgBA,IAAY,kDAAL;AACL;AACA;AACA;AACA;AACA;;;AA6BF,MAAM,gBAAgB,IACpB,0DACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,OAAO;EACR,EACF;CACD,iBAAiB,EACf,MAAM,SACP;CACF,CACF;AAGD,MAAM,yBAAyB;CAC7B,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,OAAO;CACR;AAED,MAAM,cAAcA,OAAE,OAAO,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqEvC,MAAaC,SAAyB,EACpC,UACA,QACA,WACA,gBAAgB,MAChB,SACA,iBAAiB,OACjB,OACA,OAAO,UAAU,IACjB,WACA,eAAe,OACf,UAAU,QACV,GAAG,YACC;CACJ,MAAM,mBAAmB,sBAAsB,UAAU;AAEzD,mBAAkB;EAAE,KAAK;EAAS,eAAe,UAAU;EAAe,CAAC;AAE3E,iBAAgB;EACd,MAAM,gBAAgB,UAAyB;AAC7C,OAAI,MAAM,QAAQ,YAAY,UAAU,QACtC,UAAS;;AAGb,WAAS,iBAAiB,WAAW,aAAa;AAClD,eAAa;AACX,YAAS,oBAAoB,WAAW,aAAa;;IAEtD,CAAC,QAAQ,QAAQ,CAAC;AAErB,KAAI,CAAC,iBAAkB,QAAO,mCAAK;CAEnC,MAAM,WAAW,OAAO,UAAU;CAGlC,MAAM,sBACJ,uBACG,WAAmD;AAGxD,QAAO,aACL,oBAACD,OAAE;EACD,WAAU;EACV,SAAS,SAAS,YAAY;EAC9B,UAAU;GACR,SAAS;IACP,SAAS;IACT,YAAY;IACZ,YAAY;KAAE,UAAU;KAAK,MAAM;KAAkB;IACtD;GACD,WAAW;IACT,SAAS;IACT,YAAY;IACZ,YAAY;KAAE,UAAU;KAAK,MAAM;KAAiB;IACrD;GACF;EACD,UAAU,MAAM;AACd,KAAE,iBAAiB;AACnB,cAAW;;EAEb,eAAa,CAAC;YAEd,qBAAC;GACC,UAAU,MAAM,EAAE,iBAAiB;GACnC,SAAS,EAAE,OAAO,SAAS,KAAM,GAAG;GACpC,SAAS,EAAE,OAAO,SAAS,IAAI,IAAK;GACpC,YAAY,EAAE,UAAU,IAAK;GAC7B,WAAW,cAAc;IAAE;IAAM;IAAW,CAAC;GAC7C,MAAK;GACL;GACA,aAAY;GAEZ,SAAQ;GACR,GAAI;cAGJ,qBAAC;IACC,WAAW,GACT,gCACA,kBAAkB,WACd,qBACA,iBACE,qBACA,WACE,iBACA,SACT;eAEA,YACC,oBAAC;KAAG,WAAU;eACX;MACE,EAEN,kBACC,oBAAC;KACC,SAAS,cAAc;KACvB,OAAO,YAAY;KACnB,OAAM;KACN,WAAU;KACV,UAAU,MAAM;AACd,QAAE,iBAAiB;AACnB,iBAAW;;KAEb,MAAM;KACN,MAAM,WAAW;MACjB;KAEA,EAGN,oBAAC;IACC,WAAW,GACT,uCAEA,iBAAiB,QAAQ,iBACzB,iBAAiB,OAAO,qCACxB,iBAAiB,OAAO,qCACxB,CAAC,gBAAgB,mBAClB;cAID,oBAAC;KAAI,WAAW,GAAG,iBAAiB,oBAAoB;KACrD;MACG;KACF;IACM;GACR,EACR,iBACD"}
@@ -3,7 +3,7 @@ import { useOAuth2 } from "./useAuth/useOAuth2.mjs";
3
3
  import { useSession } from "./useAuth/useSession.mjs";
4
4
  import { useAuth } from "./useAuth/useAuth.mjs";
5
5
  import { useIntlayerAuth, useIntlayerOAuth } from "./useIntlayerAPI.mjs";
6
- import { useAddDictionary, useAddNewAccessKey, useAddOrganization, useAddOrganizationMember, useAddPasskey, useAddProject, useAddTag, useAppQuery, useAskDocQuestion, useAskResetPassword, useAuditContentDeclaration, useAuditContentDeclarationField, useAuditContentDeclarationMetadata, useAuditTag, useAutocomplete, useCancelSubscription, useChangePassword, useCreateUser, useDeleteAccessKey, useDeleteDictionary, useDeleteOrganization, useDeletePasskey, useDeleteProject, useDeleteSSOProvider, useDeleteTag, useDeleteUser, useDisableTwoFactor, useEnableTwoFactor, useGetDictionaries, useGetDictionariesKeys, useGetDictionary, useGetDiscussions, useGetDiscussionsData, useGetEditorDictionaries, useGetNewsletterStatus, useGetOrganizations, useGetPricing, useGetProjects, useGetSubscription, useGetTags, useGetUserByAccount, useGetUserById, useGetUsers, useGetVerifyEmailStatus, useGithubAuth, useGithubCheckConfig, useGithubGetAuthUrl, useGithubGetConfigFile, useGithubRepos, useInfiniteGetDictionaries, useListPasskeys, useListSSOProviders, useLogin, useLogout, usePushDictionaries, useQueryClient, useRefreshAccessKey, useRegister, useRegisterSSO, useResetPassword, useSearchDoc, useSelectOrganization, useSelectProject, useSignInMagicLink, useSignInPasskey, useSignInSSO, useSubscribeToNewsletter, useTranslateJSONDeclaration, useUnselectOrganization, useUnselectProject, useUnsubscribeFromNewsletter, useUpdateDictionary, useUpdateOrganization, useUpdateOrganizationMembers, useUpdateOrganizationMembersById, useUpdateProject, useUpdateProjectMembers, useUpdateTag, useUpdateUser, useVerifyBackupCode, useVerifyEmail, useVerifyTotp, useWriteDictionary } from "./reactQuery.mjs";
6
+ import { useAddDictionary, useAddNewAccessKey, useAddOrganization, useAddOrganizationMember, useAddPasskey, useAddProject, useAddTag, useAppQuery, useAskDocQuestion, useAskResetPassword, useAuditContentDeclaration, useAuditContentDeclarationField, useAuditContentDeclarationMetadata, useAuditTag, useAutocomplete, useBitbucketAuth, useBitbucketCheckConfig, useBitbucketGetConfigFile, useBitbucketRepos, useCancelSubscription, useChangePassword, useCreateUser, useDeleteAccessKey, useDeleteDictionary, useDeleteOrganization, useDeletePasskey, useDeleteProject, useDeleteSSOProvider, useDeleteTag, useDeleteUser, useDisableTwoFactor, useEnableTwoFactor, useGetCIConfig, useGetDictionaries, useGetDictionariesKeys, useGetDictionary, useGetDiscussions, useGetDiscussionsData, useGetEditorDictionaries, useGetNewsletterStatus, useGetOrganizations, useGetPricing, useGetProjects, useGetSubscription, useGetTags, useGetUserByAccount, useGetUserById, useGetUsers, useGetVerifyEmailStatus, useGithubAuth, useGithubCheckConfig, useGithubGetAuthUrl, useGithubGetConfigFile, useGithubRepos, useGitlabAuth, useGitlabCheckConfig, useGitlabGetConfigFile, useGitlabProjects, useInfiniteGetDictionaries, useListPasskeys, useListSSOProviders, useLogin, useLogout, usePushCIConfig, usePushDictionaries, useQueryClient, useRefreshAccessKey, useRegister, useRegisterSSO, useResetPassword, useSearchDoc, useSelectOrganization, useSelectProject, useSignInMagicLink, useSignInPasskey, useSignInSSO, useSubscribeToNewsletter, useTranslateJSONDeclaration, useTriggerBuild, useTriggerWebhook, useUnselectOrganization, useUnselectProject, useUnsubscribeFromNewsletter, useUpdateDictionary, useUpdateOrganization, useUpdateOrganizationMembers, useUpdateOrganizationMembersById, useUpdateProject, useUpdateProjectMembers, useUpdateTag, useUpdateUser, useVerifyBackupCode, useVerifyEmail, useVerifyTotp, useWriteDictionary } from "./reactQuery.mjs";
7
7
  import { usePersistedStore } from "./usePersistedStore.mjs";
8
8
  import { useItemSelector } from "./useItemSelector.mjs";
9
9
  import { useUser } from "./useUser/index.mjs";
@@ -19,4 +19,4 @@ import { useScrollDetection } from "./useScrollDetection.mjs";
19
19
  import { useScrollY } from "./useScrollY.mjs";
20
20
  import { useSearch } from "./useSearch.mjs";
21
21
 
22
- export { calculateIsMobile, checkIsIOS, checkIsIphoneOrSafariDevice, checkIsMac, checkIsMobileScreen, checkIsMobileUserAgent, getBreakpointFromSize, useAddDictionary, useAddNewAccessKey, useAddOrganization, useAddOrganizationMember, useAddPasskey, useAddProject, useAddTag, useAppQuery, useAskDocQuestion, useAskResetPassword, useAuditContentDeclaration, useAuditContentDeclarationField, useAuditContentDeclarationMetadata, useAuditTag, useAuth, useAutocomplete, useCancelSubscription, useChangePassword, useCreateUser, useDeleteAccessKey, useDeleteDictionary, useDeleteOrganization, useDeletePasskey, useDeleteProject, useDeleteSSOProvider, useDeleteTag, useDeleteUser, useDevice, useDisableTwoFactor, useEnableTwoFactor, useGetDictionaries, useGetDictionariesKeys, useGetDictionary, useGetDiscussions, useGetDiscussionsData, useGetEditorDictionaries, useGetElementById, useGetElementOrWindow, useGetNewsletterStatus, useGetOrganizations, useGetPricing, useGetProjects, useGetSubscription, useGetTags, useGetUserByAccount, useGetUserById, useGetUsers, useGetVerifyEmailStatus, useGithubAuth, useGithubCheckConfig, useGithubGetAuthUrl, useGithubGetConfigFile, useGithubRepos, useHorizontalSwipe, useInfiniteGetDictionaries, useIntlayerAuth, useIntlayerOAuth, useIsDarkMode, useIsMounted, useItemSelector, useKeyboardDetector, useListPasskeys, useListSSOProviders, useLogin, useLogout, useOAuth2, usePersistedStore, usePushDictionaries, useQueryClient, useRefreshAccessKey, useRegister, useRegisterSSO, useResetPassword, useScreenWidth, useScrollBlockage, useScrollDetection, useScrollY, useSearch, useSearchDoc, useSelectOrganization, useSelectProject, useSession, useSignInMagicLink, useSignInPasskey, useSignInSSO, useSubscribeToNewsletter, useTranslateJSONDeclaration, useUnselectOrganization, useUnselectProject, useUnsubscribeFromNewsletter, useUpdateDictionary, useUpdateOrganization, useUpdateOrganizationMembers, useUpdateOrganizationMembersById, useUpdateProject, useUpdateProjectMembers, useUpdateTag, useUpdateUser, useUser, useVerifyBackupCode, useVerifyEmail, useVerifyTotp, useWriteDictionary };
22
+ export { calculateIsMobile, checkIsIOS, checkIsIphoneOrSafariDevice, checkIsMac, checkIsMobileScreen, checkIsMobileUserAgent, getBreakpointFromSize, useAddDictionary, useAddNewAccessKey, useAddOrganization, useAddOrganizationMember, useAddPasskey, useAddProject, useAddTag, useAppQuery, useAskDocQuestion, useAskResetPassword, useAuditContentDeclaration, useAuditContentDeclarationField, useAuditContentDeclarationMetadata, useAuditTag, useAuth, useAutocomplete, useBitbucketAuth, useBitbucketCheckConfig, useBitbucketGetConfigFile, useBitbucketRepos, useCancelSubscription, useChangePassword, useCreateUser, useDeleteAccessKey, useDeleteDictionary, useDeleteOrganization, useDeletePasskey, useDeleteProject, useDeleteSSOProvider, useDeleteTag, useDeleteUser, useDevice, useDisableTwoFactor, useEnableTwoFactor, useGetCIConfig, useGetDictionaries, useGetDictionariesKeys, useGetDictionary, useGetDiscussions, useGetDiscussionsData, useGetEditorDictionaries, useGetElementById, useGetElementOrWindow, useGetNewsletterStatus, useGetOrganizations, useGetPricing, useGetProjects, useGetSubscription, useGetTags, useGetUserByAccount, useGetUserById, useGetUsers, useGetVerifyEmailStatus, useGithubAuth, useGithubCheckConfig, useGithubGetAuthUrl, useGithubGetConfigFile, useGithubRepos, useGitlabAuth, useGitlabCheckConfig, useGitlabGetConfigFile, useGitlabProjects, useHorizontalSwipe, useInfiniteGetDictionaries, useIntlayerAuth, useIntlayerOAuth, useIsDarkMode, useIsMounted, useItemSelector, useKeyboardDetector, useListPasskeys, useListSSOProviders, useLogin, useLogout, useOAuth2, usePersistedStore, usePushCIConfig, usePushDictionaries, useQueryClient, useRefreshAccessKey, useRegister, useRegisterSSO, useResetPassword, useScreenWidth, useScrollBlockage, useScrollDetection, useScrollY, useSearch, useSearchDoc, useSelectOrganization, useSelectProject, useSession, useSignInMagicLink, useSignInPasskey, useSignInSSO, useSubscribeToNewsletter, useTranslateJSONDeclaration, useTriggerBuild, useTriggerWebhook, useUnselectOrganization, useUnselectProject, useUnsubscribeFromNewsletter, useUpdateDictionary, useUpdateOrganization, useUpdateOrganizationMembers, useUpdateOrganizationMembersById, useUpdateProject, useUpdateProjectMembers, useUpdateTag, useUpdateUser, useUser, useVerifyBackupCode, useVerifyEmail, useVerifyTotp, useWriteDictionary };
@@ -445,6 +445,39 @@ const useUnselectProject = () => {
445
445
  }
446
446
  });
447
447
  };
448
+ const useGetCIConfig = (options) => {
449
+ const intlayerOAuth = useIntlayerOAuth();
450
+ return useAppQuery({
451
+ queryKey: ["ci-config"],
452
+ queryFn: ({ signal }) => intlayerOAuth.project.getCIConfig({ signal }),
453
+ requireProject: true,
454
+ ...options
455
+ });
456
+ };
457
+ const usePushCIConfig = () => {
458
+ const intlayerOAuth = useIntlayerOAuth();
459
+ return useMutation({
460
+ mutationKey: ["ci-config"],
461
+ mutationFn: () => intlayerOAuth.project.pushCIConfig(),
462
+ meta: { invalidateQueries: [["ci-config"]] }
463
+ });
464
+ };
465
+ const useTriggerBuild = () => {
466
+ const intlayerOAuth = useIntlayerOAuth();
467
+ return useMutation({
468
+ mutationKey: ["projects", "build"],
469
+ mutationFn: () => intlayerOAuth.project.triggerBuild(),
470
+ meta: { invalidateQueries: [["projects"]] }
471
+ });
472
+ };
473
+ const useTriggerWebhook = () => {
474
+ const intlayerOAuth = useIntlayerOAuth();
475
+ return useMutation({
476
+ mutationKey: ["projects", "webhook"],
477
+ mutationFn: (webhookIndex) => intlayerOAuth.project.triggerWebhook(webhookIndex),
478
+ meta: { invalidateQueries: [["projects"]] }
479
+ });
480
+ };
448
481
  const useAddNewAccessKey = () => {
449
482
  const intlayerOAuth = useIntlayerOAuth();
450
483
  return useMutation({
@@ -790,6 +823,74 @@ const useGithubGetConfigFile = () => {
790
823
  });
791
824
  };
792
825
  /**
826
+ * GitLab
827
+ */
828
+ const useGitlabAuth = () => {
829
+ const intlayerOAuth = useIntlayerOAuth();
830
+ return useMutation({
831
+ mutationKey: ["gitlab", "auth"],
832
+ mutationFn: (args) => intlayerOAuth.gitlab.authenticate(args.code, args.redirectUri, args.instanceUrl)
833
+ });
834
+ };
835
+ const useGitlabProjects = (enabled = true, instanceUrl) => {
836
+ const intlayerOAuth = useIntlayerOAuth();
837
+ return useQuery({
838
+ queryKey: [
839
+ "gitlab",
840
+ "projects",
841
+ instanceUrl
842
+ ],
843
+ queryFn: () => intlayerOAuth.gitlab.getProjects(void 0, instanceUrl),
844
+ enabled
845
+ });
846
+ };
847
+ const useGitlabCheckConfig = () => {
848
+ const intlayerOAuth = useIntlayerOAuth();
849
+ return useMutation({
850
+ mutationKey: ["gitlab", "check-config"],
851
+ mutationFn: (args) => intlayerOAuth.gitlab.checkIntlayerConfig(void 0, args.projectId, args.branch, args.instanceUrl)
852
+ });
853
+ };
854
+ const useGitlabGetConfigFile = () => {
855
+ const intlayerOAuth = useIntlayerOAuth();
856
+ return useMutation({
857
+ mutationKey: ["gitlab", "get-config-file"],
858
+ mutationFn: (args) => intlayerOAuth.gitlab.getConfigFile(void 0, args.projectId, args.branch, args.path, args.instanceUrl)
859
+ });
860
+ };
861
+ /**
862
+ * Bitbucket
863
+ */
864
+ const useBitbucketAuth = () => {
865
+ const intlayerOAuth = useIntlayerOAuth();
866
+ return useMutation({
867
+ mutationKey: ["bitbucket", "auth"],
868
+ mutationFn: (code) => intlayerOAuth.bitbucket.authenticate(code)
869
+ });
870
+ };
871
+ const useBitbucketRepos = (enabled = true) => {
872
+ const intlayerOAuth = useIntlayerOAuth();
873
+ return useQuery({
874
+ queryKey: ["bitbucket", "repos"],
875
+ queryFn: () => intlayerOAuth.bitbucket.getRepositories(),
876
+ enabled
877
+ });
878
+ };
879
+ const useBitbucketCheckConfig = () => {
880
+ const intlayerOAuth = useIntlayerOAuth();
881
+ return useMutation({
882
+ mutationKey: ["bitbucket", "check-config"],
883
+ mutationFn: (args) => intlayerOAuth.bitbucket.checkIntlayerConfig(void 0, args.workspace, args.repoSlug, args.branch)
884
+ });
885
+ };
886
+ const useBitbucketGetConfigFile = () => {
887
+ const intlayerOAuth = useIntlayerOAuth();
888
+ return useMutation({
889
+ mutationKey: ["bitbucket", "get-config-file"],
890
+ mutationFn: (args) => intlayerOAuth.bitbucket.getConfigFile(void 0, args.workspace, args.repoSlug, args.branch, args.path)
891
+ });
892
+ };
893
+ /**
793
894
  * Editor
794
895
  */
795
896
  const useGetEditorDictionaries = () => {
@@ -808,5 +909,5 @@ const useWriteDictionary = () => {
808
909
  };
809
910
 
810
911
  //#endregion
811
- export { useAddDictionary, useAddNewAccessKey, useAddOrganization, useAddOrganizationMember, useAddPasskey, useAddProject, useAddTag, useAppQuery, useAskDocQuestion, useAskResetPassword, useAuditContentDeclaration, useAuditContentDeclarationField, useAuditContentDeclarationMetadata, useAuditTag, useAutocomplete, useCancelSubscription, useChangePassword, useCreateUser, useDeleteAccessKey, useDeleteDictionary, useDeleteOrganization, useDeletePasskey, useDeleteProject, useDeleteSSOProvider, useDeleteTag, useDeleteUser, useDisableTwoFactor, useEnableTwoFactor, useGetDictionaries, useGetDictionariesKeys, useGetDictionary, useGetDiscussions, useGetDiscussionsData, useGetEditorDictionaries, useGetNewsletterStatus, useGetOrganizations, useGetPricing, useGetProjects, useGetSubscription, useGetTags, useGetUserByAccount, useGetUserById, useGetUsers, useGetVerifyEmailStatus, useGithubAuth, useGithubCheckConfig, useGithubGetAuthUrl, useGithubGetConfigFile, useGithubRepos, useInfiniteGetDictionaries, useListPasskeys, useListSSOProviders, useLogin, useLogout, usePushDictionaries, useQueryClient, useRefreshAccessKey, useRegister, useRegisterSSO, useResetPassword, useSearchDoc, useSelectOrganization, useSelectProject, useSignInMagicLink, useSignInPasskey, useSignInSSO, useSubscribeToNewsletter, useTranslateJSONDeclaration, useUnselectOrganization, useUnselectProject, useUnsubscribeFromNewsletter, useUpdateDictionary, useUpdateOrganization, useUpdateOrganizationMembers, useUpdateOrganizationMembersById, useUpdateProject, useUpdateProjectMembers, useUpdateTag, useUpdateUser, useVerifyBackupCode, useVerifyEmail, useVerifyTotp, useWriteDictionary };
912
+ export { useAddDictionary, useAddNewAccessKey, useAddOrganization, useAddOrganizationMember, useAddPasskey, useAddProject, useAddTag, useAppQuery, useAskDocQuestion, useAskResetPassword, useAuditContentDeclaration, useAuditContentDeclarationField, useAuditContentDeclarationMetadata, useAuditTag, useAutocomplete, useBitbucketAuth, useBitbucketCheckConfig, useBitbucketGetConfigFile, useBitbucketRepos, useCancelSubscription, useChangePassword, useCreateUser, useDeleteAccessKey, useDeleteDictionary, useDeleteOrganization, useDeletePasskey, useDeleteProject, useDeleteSSOProvider, useDeleteTag, useDeleteUser, useDisableTwoFactor, useEnableTwoFactor, useGetCIConfig, useGetDictionaries, useGetDictionariesKeys, useGetDictionary, useGetDiscussions, useGetDiscussionsData, useGetEditorDictionaries, useGetNewsletterStatus, useGetOrganizations, useGetPricing, useGetProjects, useGetSubscription, useGetTags, useGetUserByAccount, useGetUserById, useGetUsers, useGetVerifyEmailStatus, useGithubAuth, useGithubCheckConfig, useGithubGetAuthUrl, useGithubGetConfigFile, useGithubRepos, useGitlabAuth, useGitlabCheckConfig, useGitlabGetConfigFile, useGitlabProjects, useInfiniteGetDictionaries, useListPasskeys, useListSSOProviders, useLogin, useLogout, usePushCIConfig, usePushDictionaries, useQueryClient, useRefreshAccessKey, useRegister, useRegisterSSO, useResetPassword, useSearchDoc, useSelectOrganization, useSelectProject, useSignInMagicLink, useSignInPasskey, useSignInSSO, useSubscribeToNewsletter, useTranslateJSONDeclaration, useTriggerBuild, useTriggerWebhook, useUnselectOrganization, useUnselectProject, useUnsubscribeFromNewsletter, useUpdateDictionary, useUpdateOrganization, useUpdateOrganizationMembers, useUpdateOrganizationMembersById, useUpdateProject, useUpdateProjectMembers, useUpdateTag, useUpdateUser, useVerifyBackupCode, useVerifyEmail, useVerifyTotp, useWriteDictionary };
812
913
  //# sourceMappingURL=reactQuery.mjs.map