@stack-spot/citric-react 0.27.2 → 0.29.0

package/dist/citric.css

@@ -436,9 +436,7 @@
     margin-right: 2px;
     &:after {
       transform: rotate(90deg);
-      top: 50%;
       right: -5px;
-      margin-top: -1px;
     }
   }
 
@@ -446,10 +444,24 @@
     margin-left: 2px;
     &:after {
       transform: rotate(270deg);
-      top: 50%;
       left: -5px;
+    }
+  }
+
+  &.with-arrow.right,
+  &.with-arrow.left {
+    &.align-center:after {
+      top: 50%;
       margin-top: -1px;
     }
+    &.align-start:after {
+      top: 0;
+      margin-top: 5px;
+    }
+    &.align-end:after {
+      bottom: 0;
+      margin-bottom: 5px;
+    }
   }
 
   &.with-arrow.top {
@@ -457,17 +469,29 @@
     &:after {
       transform: rotate(180deg);
       bottom: -2px;
+    }
+  }
+
+  &.with-arrow.top,
+  &.with-arrow.bottom {
+    &.align-center:after {
       left: 50%;
       margin-left: -4px;
     }
+    &.align-start:after {
+      left: 0;
+      margin-left: 4px;
+    }
+    &.align-end:after {
+      right: 0;
+      margin-right: 4px;
+    }
   }
 
   &.with-arrow.bottom {
     margin-top: 2px;
     &:after {
       top: -2px;
-      left: 50%;
-      margin-left: -4px;
     }
   }
 }
@@ -1288,7 +1312,7 @@ input[type="range"][data-citric="slider"] {
     .selection-panel {
       max-height: var(--max-height, var(--default-max-height));
       opacity: 1;
-      ul {
+      .options {
         overflow: auto;
         animation: var(--animation-duration) rich-select-delayed-overflow;
       }
@@ -1589,7 +1613,6 @@ input[type="range"][data-citric="slider"] {
     gap: 8px;
   }
   label {
-    width: 100%;
     cursor: pointer;
   }
   input[type="checkbox"] {
@@ -1826,12 +1849,13 @@ nav[data-citric="menu"].rounded-items, [data-citric="menu"].rounded-items nav {
   --bg: var(--light-500);
   --bg-hover: var(--light-600);
   --fg: var(--light-contrastText);
+  --radius: 50%;
 
   /* General CSS */
 
   box-sizing: border-box;
   display: inline-flex;
-  border-radius: 100%;
+  border-radius: var(--radius);
   align-items: center;
   justify-content: center;
   border: none;
@@ -1840,11 +1864,17 @@ nav[data-citric="menu"].rounded-items, [data-citric="menu"].rounded-items nav {
   width: var(--size);
   height: var(--size);
   color: var(--fg);
+  padding: 0;
 
   &:not([data-feedback]) {
     overflow: hidden;
   }
 
+  &[data-feedback] > * {
+    overflow: hidden;
+    border-radius: var(--radius);
+  }
+
   /* Sizes */
 
   &.xs {
@@ -1862,7 +1892,7 @@ nav[data-citric="menu"].rounded-items, [data-citric="menu"].rounded-items nav {
   /* Appearances */
 
   &.square {
-    border-radius: var(--radius-xs);
+    --radius: var(--radius-xs);
   }
 
   &.text {
@@ -1874,7 +1904,6 @@ nav[data-citric="menu"].rounded-items, [data-citric="menu"].rounded-items nav {
     --bg-hover: transparent;
     --size: auto;
     border-radius: 0;
-    padding: 0;
   }
 
   /* Colors */

package/dist/components/AsyncContent.d.ts

@@ -29,6 +29,7 @@ interface Props {
  * Attention: for React Suspense, use the component "FallbackBoundary" instead.
  *
  * @example
+ *
  * ```
  * const [data, isLoading, error] = useRemoteData()
  *

package/dist/components/AsyncContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AsyncContent.d.ts","sourceRoot":"","sources":["../../src/components/AsyncContent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAA8B,MAAM,OAAO,CAAA;AAMpE,UAAU,KAAK;IACb;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACnD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,eAAO,MAAM,YAAY,4CAAqD,KAAK,iIAoBjF,CAAA"}
+{"version":3,"file":"AsyncContent.d.ts","sourceRoot":"","sources":["../../src/components/AsyncContent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAA8B,MAAM,OAAO,CAAA;AAMpE,UAAU,KAAK;IACb;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACnD;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,eAAO,MAAM,YAAY,4CAAqD,KAAK,iIAoBjF,CAAA"}

package/dist/components/AsyncContent.js

@@ -15,6 +15,7 @@ import { LoadingPanel } from './LoadingPanel.js';
  * Attention: for React Suspense, use the component "FallbackBoundary" instead.
  *
  * @example
+ *
  * ```
  * const [data, isLoading, error] = useRemoteData()
  *

package/dist/components/AsyncContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"AsyncContent.js","sourceRoot":"","sources":["../../src/components/AsyncContent.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAoB,SAAS,EAAE,eAAe,EAAE,MAAM,OAAO,CAAA;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAsB7C;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,OAAO,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAS,EAAE,EAAE;IACrF,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IAEpC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK,EAAE,CAAC;YACV,MAAM,EAAE,OAAO,EAAE,CAAC,KAAK,CAAC,CAAA;YACxB,sCAAsC;YACtC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;QACtB,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK,EAAE,CAAC;YACvB,OAAO,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAE,QAAQ,CAAC,aAAa,CAAC,SAAS,CAAiB,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,CAAA;QAC7H,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAA;IAEpB,IAAI,OAAO;QAAE,OAAO,KAAC,YAAY,KAAG,CAAA;IACpC,IAAI,KAAK;QAAE,OAAO,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAC,YAAY,IAAC,KAAK,EAAE,KAAK,GAAI,CAAA;IAClG,OAAO,QAAQ,CAAA;AACjB,CAAC,CAAC,CAAA"}
+{"version":3,"file":"AsyncContent.js","sourceRoot":"","sources":["../../src/components/AsyncContent.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAoB,SAAS,EAAE,eAAe,EAAE,MAAM,OAAO,CAAA;AACpE,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAsB7C;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,OAAO,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAS,EAAE,EAAE;IACrF,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IAEpC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,KAAK,EAAE,CAAC;YACV,MAAM,EAAE,OAAO,EAAE,CAAC,KAAK,CAAC,CAAA;YACxB,sCAAsC;YACtC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;QACtB,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK,EAAE,CAAC;YACvB,OAAO,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAE,QAAQ,CAAC,aAAa,CAAC,SAAS,CAAiB,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,CAAA;QAC7H,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAA;IAEpB,IAAI,OAAO;QAAE,OAAO,KAAC,YAAY,KAAG,CAAA;IACpC,IAAI,KAAK;QAAE,OAAO,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAC,YAAY,IAAC,KAAK,EAAE,KAAK,GAAI,CAAA;IAClG,OAAO,QAAQ,CAAA;AACjB,CAAC,CAAC,CAAA"}

package/dist/components/Button.d.ts

@@ -29,26 +29,26 @@ export interface BaseButtonProps extends WithColorScheme {
      */
     onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => any;
     /**
-     * Whether or not a click in this button should generate analytics data.
+     * Metadata for the general onClick event, set by the CitricController. Useful for creating analytics data.
      *
-     * This only takes effect if there's a CitricController in React's context. The value of `analytics` is passed to the function
+     * This only takes effect if there's a CitricController in React's context. The value of `metadata` is passed to the function
      * `onClickButton` of the controller.
      *
      * @default false
      */
-    analytics?: boolean;
+    metadata?: any;
 }
 export type ButtonProps = Omit<React.JSX.IntrinsicElements['button'], 'onClick'> & BaseButtonProps;
 /**
  * Renders a button. The type is "button" by default.
  *
  * Whenever a button is clicked, the function `onClickButton` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```
  * <Button>My Button</Button>
  * ```
  */
-export declare const Button: ({ appearance, size, feedback, loading, disabled, onClick, className, children, type, analytics, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Button: ({ appearance, size, feedback, loading, disabled, onClick, className, children, type, metadata, ...props }: ButtonProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Button.d.ts.map

package/dist/components/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAK1C,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,CAAC;IACxD;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,KAAK,GAAG,CAAC;IAC1E;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC,GAAG,eAAe,CAAA;AAElG;;;;;;;;;;GAUG;AACH,eAAO,MAAM,MAAM,+GACsG,WAAW,4CA0ClI,CAAA"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAK1C,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,CAAC;IACxD;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,EAAE,UAAU,CAAC,KAAK,GAAG,CAAC;IAC1E;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,GAAG,CAAC;CAChB;AAED,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC,GAAG,eAAe,CAAA;AAElG;;;;;;;;;;GAUG;AACH,eAAO,MAAM,MAAM,8GACqG,WAAW,4CA0CjI,CAAA"}

package/dist/components/Button.js

@@ -9,21 +9,21 @@ import { ProgressCircular } from './ProgressCircular.js';
  * Renders a button. The type is "button" by default.
  *
  * Whenever a button is clicked, the function `onClickButton` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```
  * <Button>My Button</Button>
  * ```
  */
-export const Button = withRef(({ appearance, size, feedback, loading, disabled, onClick, className, children, type = 'button', analytics, ...props }) => {
+export const Button = withRef(({ appearance, size, feedback, loading, disabled, onClick, className, children, type = 'button', metadata, ...props }) => {
     const citric = useCitricController();
     const [waiting, setWaiting] = useState(false);
     const busy = loading || waiting;
     const isAllLowercase = useMemo(() => !Children.toArray(children).some(c => typeof c === 'string' && c.toLocaleLowerCase() !== c), [children]);
     async function handleClick(e) {
         const result = onClick?.(e);
-        citric?.onClickButton?.(e, analytics ?? false);
+        citric?.onClickButton?.(e, metadata);
         if (result instanceof Promise) {
             setWaiting(true);
             try {

package/dist/components/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACnD,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AA4CrD;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,OAAO,CAAC,CAC5B,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,GAAG,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAe,EAClI,EAAE;IACF,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IACpC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC7C,MAAM,IAAI,GAAG,OAAO,IAAI,OAAO,CAAA;IAC/B,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,KAAK,QAAQ,IAAI,CAAC,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAC,EACjG,CAAC,QAAQ,CAAC,CACX,CAAA;IAED,KAAK,UAAU,WAAW,CAAC,CAAkD;QAC3E,MAAM,MAAM,GAAG,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;QAC3B,MAAM,EAAE,aAAa,EAAE,CAAC,CAAC,EAAE,SAAS,IAAI,KAAK,CAAC,CAAA;QAC9C,IAAI,MAAM,YAAY,OAAO,EAAE,CAAC;YAC9B,UAAU,CAAC,IAAI,CAAC,CAAA;YAChB,IAAI,CAAC;gBACH,MAAM,MAAM,CAAA;YACd,CAAC;YAAC,MAAM,CAAC,CAAC,WAAW,CAAC,CAAC;YACvB,UAAU,CAAC,KAAK,CAAC,CAAA;QACnB,CAAC;IACH,CAAC;IAED,OAAO,CACL,MAAC,eAAe,IACd,GAAG,EAAC,QAAQ,EACZ,SAAS,EAAC,QAAQ,EAClB,SAAS,EAAE,WAAW,CAAC,CAAC,IAAI,EAAE,UAAU,EAAE,cAAc,IAAI,YAAY,EAAE,SAAS,CAAC,CAAC,mBACtE,QAAQ,IAAI,SAAS,EACpC,OAAO,EAAE,WAAW,eACT,IAAI,EACf,QAAQ,EAAE,QAAQ,IAAI,IAAI,EAC1B,IAAI,EAAE,IAAI,KACN,KAAK,aAER,IAAI,CAAC,CAAC,CAAC,wBAAM,QAAQ,GAAO,CAAC,CAAC,CAAC,QAAQ,EACvC,IAAI,IAAI,CACP,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,gBAAgB,IAAC,IAAI,EAAC,IAAI,GAAG,GAC1B,CACP,IACe,CACnB,CAAA;AACH,CAAC,CAAC,CAAA"}
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACnD,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AA4CrD;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,OAAO,CAAC,CAC5B,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,GAAG,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAe,EACjI,EAAE;IACF,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IACpC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC7C,MAAM,IAAI,GAAG,OAAO,IAAI,OAAO,CAAA;IAC/B,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,KAAK,QAAQ,IAAI,CAAC,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAC,EACjG,CAAC,QAAQ,CAAC,CACX,CAAA;IAED,KAAK,UAAU,WAAW,CAAC,CAAkD;QAC3E,MAAM,MAAM,GAAG,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;QAC3B,MAAM,EAAE,aAAa,EAAE,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAA;QACpC,IAAI,MAAM,YAAY,OAAO,EAAE,CAAC;YAC9B,UAAU,CAAC,IAAI,CAAC,CAAA;YAChB,IAAI,CAAC;gBACH,MAAM,MAAM,CAAA;YACd,CAAC;YAAC,MAAM,CAAC,CAAC,WAAW,CAAC,CAAC;YACvB,UAAU,CAAC,KAAK,CAAC,CAAA;QACnB,CAAC;IACH,CAAC;IAED,OAAO,CACL,MAAC,eAAe,IACd,GAAG,EAAC,QAAQ,EACZ,SAAS,EAAC,QAAQ,EAClB,SAAS,EAAE,WAAW,CAAC,CAAC,IAAI,EAAE,UAAU,EAAE,cAAc,IAAI,YAAY,EAAE,SAAS,CAAC,CAAC,mBACtE,QAAQ,IAAI,SAAS,EACpC,OAAO,EAAE,WAAW,eACT,IAAI,EACf,QAAQ,EAAE,QAAQ,IAAI,IAAI,EAC1B,IAAI,EAAE,IAAI,KACN,KAAK,aAER,IAAI,CAAC,CAAC,CAAC,wBAAM,QAAQ,GAAO,CAAC,CAAC,CAAC,QAAQ,EACvC,IAAI,IAAI,CACP,cAAK,SAAS,EAAC,QAAQ,YACrB,KAAC,gBAAgB,IAAC,IAAI,EAAC,IAAI,GAAG,GAC1B,CACP,IACe,CACnB,CAAA;AACH,CAAC,CAAC,CAAA"}

package/dist/components/ButtonLink.d.ts

@@ -5,12 +5,12 @@ export type ButtonLinkProps = React.JSX.IntrinsicElements['a'] & BaseButtonLinkP
  * Renders a link with the appearance of a button.
  *
  * Whenever a link is clicked, the function `onClickLink` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```
  * <ButtonLink href="#">My Button Link</ButtonLink>
  * ```
  */
-export declare const ButtonLink: ({ appearance, size, feedback, onClick, className, children, analytics, ...props }: ButtonLinkProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ButtonLink: ({ appearance, size, feedback, onClick, className, children, metadata, ...props }: ButtonLinkProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ButtonLink.d.ts.map

package/dist/components/ButtonLink.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonLink.d.ts","sourceRoot":"","sources":["../../src/components/ButtonLink.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAG1C,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,eAAe,EAAE,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC,CAAA;AACvF,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,GAAG,CAAC,GAAG,mBAAmB,CAAA;AAEpF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,UAAU,sFAC8D,eAAe,4CAsBlG,CAAA"}
+{"version":3,"file":"ButtonLink.d.ts","sourceRoot":"","sources":["../../src/components/ButtonLink.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAG1C,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,eAAe,EAAE,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC,CAAA;AACvF,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,GAAG,CAAC,GAAG,mBAAmB,CAAA;AAEpF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,UAAU,qFAC6D,eAAe,4CAsBjG,CAAA"}

package/dist/components/ButtonLink.js

@@ -8,14 +8,14 @@ import { asCitricProps, CitricComponent } from './CitricComponent.js';
  * Renders a link with the appearance of a button.
  *
  * Whenever a link is clicked, the function `onClickLink` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```
  * <ButtonLink href="#">My Button Link</ButtonLink>
  * ```
  */
-export const ButtonLink = withRef(({ appearance, size, feedback, onClick, className, children, analytics, ...props }) => {
+export const ButtonLink = withRef(({ appearance, size, feedback, onClick, className, children, metadata, ...props }) => {
     const citric = useCitricController();
     const isAllLowercase = useMemo(() => !Children.toArray(children).some(c => typeof c === 'string' && c.toLocaleLowerCase() !== c), [children]);
     const linkProps = {
@@ -23,7 +23,7 @@ export const ButtonLink = withRef(({ appearance, size, feedback, onClick, classN
         className: listToClass([size, appearance, isAllLowercase && 'short-text', className]),
         onClick: (e) => {
             onClick?.(e);
-            citric?.onClickLink?.(e, analytics ?? false);
+            citric?.onClickLink?.(e, metadata);
         },
         'data-feedback': feedback || undefined,
         ...props,

package/dist/components/ButtonLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonLink.js","sourceRoot":"","sources":["../../src/components/ButtonLink.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AAExC,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAKlE;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,OAAO,CAAC,CAChC,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAmB,EAClG,EAAE;IACF,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IACpC,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,KAAK,QAAQ,IAAI,CAAC,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAC,EACjG,CAAC,QAAQ,CAAC,CACX,CAAA;IAED,MAAM,SAAS,GAAG;QAChB,SAAS,EAAE,QAAQ;QACnB,SAAS,EAAE,WAAW,CAAC,CAAC,IAAI,EAAE,UAAU,EAAE,cAAc,IAAI,YAAY,EAAE,SAAS,CAAC,CAAC;QACrF,OAAO,EAAE,CAAC,CAAsC,EAAE,EAAE;YAClD,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;YACZ,MAAM,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,SAAS,IAAI,KAAK,CAAC,CAAA;QAC9C,CAAC;QACD,eAAe,EAAE,QAAQ,IAAI,SAAS;QACtC,GAAG,KAAK;KACA,CAAA;IAEV,OAAO,MAAM,EAAE,UAAU;QACvB,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC,EAAE,GAAG,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC;QAC9D,CAAC,CAAC,KAAC,eAAe,IAAC,GAAG,EAAC,GAAG,KAAK,SAAS,YAAG,QAAQ,GAAmB,CAAA;AAC1E,CAAC,CAAC,CAAA"}
+{"version":3,"file":"ButtonLink.js","sourceRoot":"","sources":["../../src/components/ButtonLink.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AAExC,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAKlE;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,OAAO,CAAC,CAChC,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAmB,EACjG,EAAE;IACF,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IACpC,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,KAAK,QAAQ,IAAI,CAAC,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAC,EACjG,CAAC,QAAQ,CAAC,CACX,CAAA;IAED,MAAM,SAAS,GAAG;QAChB,SAAS,EAAE,QAAQ;QACnB,SAAS,EAAE,WAAW,CAAC,CAAC,IAAI,EAAE,UAAU,EAAE,cAAc,IAAI,YAAY,EAAE,SAAS,CAAC,CAAC;QACrF,OAAO,EAAE,CAAC,CAAsC,EAAE,EAAE;YAClD,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;YACZ,MAAM,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAA;QACpC,CAAC;QACD,eAAe,EAAE,QAAQ,IAAI,SAAS;QACtC,GAAG,KAAK;KACA,CAAA;IAEV,OAAO,MAAM,EAAE,UAAU;QACvB,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC,EAAE,GAAG,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC;QAC9D,CAAC,CAAC,KAAC,eAAe,IAAC,GAAG,EAAC,GAAG,KAAK,SAAS,YAAG,QAAQ,GAAmB,CAAA;AAC1E,CAAC,CAAC,CAAA"}

package/dist/components/IconBox.d.ts

@@ -41,14 +41,14 @@ export interface BaseIconBoxProps<T extends IconBoxTag, G extends IconGroup> ext
     /**
      * Only valid if `tag` is "button" or "a".
      *
-     * Whether or not a click in this button/link should generate analytics data.
+     * Metadata for the general onClick event, set by the CitricController. Useful for creating analytics data.
      *
-     * This only takes effect if there's a CitricController in React's context. The value of `analytics` is passed to the function
+     * This only takes effect if there's a CitricController in React's context. The value of `metadata` is passed to the function
      * `onClickButton/onClickLink` of the controller.
      *
      * @default false
      */
-    analytics?: boolean;
+    metadata?: any;
 }
 export type IconBoxProps<T extends IconBoxTag, G extends IconGroup> = Omit<HTMLTag[T], 'children'> & BaseIconBoxProps<T, G>;
 /**
@@ -63,12 +63,12 @@ export type IconBoxProps<T extends IconBoxTag, G extends IconGroup> = Omit<HTMLT
  * <IconBox icon="Search" colorScheme="primary" />
  * ```
  */
-export declare const IconBox: <T extends IconBoxTag = "i", G extends IconGroup = "outline">({ group, icon, tag, appearance, size, className, analytics, onClick, feedback, ...props }: IconBoxProps<T, G>) => import("react/jsx-runtime").JSX.Element;
+export declare const IconBox: <T extends IconBoxTag = "i", G extends IconGroup = "outline">({ group, icon, tag, appearance, size, className, metadata, onClick, feedback, ...props }: IconBoxProps<T, G>) => import("react/jsx-runtime").JSX.Element;
 /**
  * A shortcut for `<IconBox tag="button">`.
  *
  * Whenever a button is clicked, the function `onClickButton` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```
@@ -80,7 +80,7 @@ export declare const IconButton: <G extends IconGroup = "outline">({ type, ...pr
  * A shortcut for `<IconBox tag="a">`.
  *
  * Whenever a link is clicked, the function `onClickLink` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```

package/dist/components/IconBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconBox.d.ts","sourceRoot":"","sources":["../../src/components/IconBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAGnE,OAAO,EAAE,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAIrE,KAAK,UAAU,GAAG,GAAG,GAAG,QAAQ,GAAG,GAAG,GAAG,MAAM,GAAG,KAAK,CAAA;AAEvD,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,UAAU,EAAE,CAAC,SAAS,SAAS,CAAE,SAAQ,aAAa,CAAC,CAAC,CAAC,EAAE,eAAe,EAAE,gBAAgB;IACtI;;;;OAIG;IACH,GAAG,CAAC,EAAE,CAAC,CAAC;IACR;;;;;;;;;;;;;OAaG;IACH,UAAU,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IACnD;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,UAAU,EAAE,CAAC,SAAS,SAAS,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,GAAG,gBAAgB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;AAE3H;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,OAAO,GACD,CAAC,SAAS,UAAU,QAAQ,CAAC,SAAS,SAAS,yGAC6B,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,4CAoBhH,CAAA;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,UAAU,GACD,CAAC,SAAS,SAAS,kCAAkC,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,4CAGhH,CAAA;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,QAAQ,GACD,CAAC,SAAS,SAAS,qBAAqB,IAAI,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,4CAG5F,CAAA"}
+{"version":3,"file":"IconBox.d.ts","sourceRoot":"","sources":["../../src/components/IconBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAGnE,OAAO,EAAE,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAIrE,KAAK,UAAU,GAAG,GAAG,GAAG,QAAQ,GAAG,GAAG,GAAG,MAAM,GAAG,KAAK,CAAA;AAEvD,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,UAAU,EAAE,CAAC,SAAS,SAAS,CAAE,SAAQ,aAAa,CAAC,CAAC,CAAC,EAAE,eAAe,EAAE,gBAAgB;IACtI;;;;OAIG;IACH,GAAG,CAAC,EAAE,CAAC,CAAC;IACR;;;;;;;;;;;;;OAaG;IACH,UAAU,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;IACnD;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,GAAG,CAAC;CAChB;AAED,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,UAAU,EAAE,CAAC,SAAS,SAAS,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,GAAG,gBAAgB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;AAE3H;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,OAAO,GACD,CAAC,SAAS,UAAU,QAAQ,CAAC,SAAS,SAAS,wGAC4B,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,4CAoB/G,CAAA;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,UAAU,GACD,CAAC,SAAS,SAAS,kCAAkC,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,4CAGhH,CAAA;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,QAAQ,GACD,CAAC,SAAS,SAAS,qBAAqB,IAAI,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,4CAG5F,CAAA"}

package/dist/components/IconBox.js

@@ -15,15 +15,15 @@ import { CitricComponent } from './CitricComponent.js';
  * <IconBox icon="Search" colorScheme="primary" />
  * ```
  */
-export const IconBox = withRef(function IconBox({ group, icon, tag, appearance, size, className, analytics, onClick, feedback, ...props }) {
+export const IconBox = withRef(function IconBox({ group, icon, tag, appearance, size, className, metadata, onClick, feedback, ...props }) {
     props['aria-label'] ||= props.title; // accessibility
     const citric = useCitricController();
     function handleClick(e) {
         onClick?.(e);
         if (tag === 'button')
-            citric?.onClickButton?.(e, analytics ?? false);
+            citric?.onClickButton?.(e, metadata);
         else if (tag === 'a')
-            citric?.onClickLink?.(e, analytics ?? false);
+            citric?.onClickLink?.(e, metadata);
     }
     return _jsx(CitricComponent, { tag: (tag || 'i'), component: "icon-box", className: listToClass(['citric-icon', group || 'outline', icon, appearance, size, className]), "data-feedback": feedback || undefined, onClick: ['button', 'a'].includes(tag ?? '') ? handleClick : onClick, ...props });
 });
@@ -31,7 +31,7 @@ export const IconBox = withRef(function IconBox({ group, icon, tag, appearance,
  * A shortcut for `<IconBox tag="button">`.
  *
  * Whenever a button is clicked, the function `onClickButton` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```
@@ -45,7 +45,7 @@ export const IconButton = withRef(function IconButton({ type, ...props }) {
  * A shortcut for `<IconBox tag="a">`.
  *
  * Whenever a link is clicked, the function `onClickLink` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```

package/dist/components/IconBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconBox.js","sourceRoot":"","sources":["../../src/components/IconBox.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAwDnD;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,OAAO,CAC5B,SAAS,OAAO,CACd,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAsB;IAE7G,KAAK,CAAC,YAAY,CAAC,KAAK,KAAK,CAAC,KAAK,CAAA,CAAC,gBAAgB;IACpD,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IAEpC,SAAS,WAAW,CAAC,CAAwB;QAC3C,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;QACZ,IAAI,GAAG,KAAK,QAAQ;YAAE,MAAM,EAAE,aAAa,EAAE,CAAC,CAAC,EAAE,SAAS,IAAI,KAAK,CAAC,CAAA;aAC/D,IAAI,GAAG,KAAK,GAAG;YAAE,MAAM,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,SAAS,IAAI,KAAK,CAAC,CAAA;IACpE,CAAC;IAED,OAAO,KAAC,eAAe,IACrB,GAAG,EAAE,CAAC,GAAG,IAAI,GAAG,CAAQ,EACxB,SAAS,EAAC,UAAU,EACpB,SAAS,EAAE,WAAW,CAAC,CAAC,aAAa,EAAE,KAAK,IAAI,SAAS,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC,mBAC/E,QAAQ,IAAI,SAAS,EACpC,OAAO,EAAE,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,QAAQ,CAAC,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO,KAChE,KAAK,GACT,CAAA;AACJ,CAAC,CACF,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,OAAO,CAC/B,SAAS,UAAU,CAAkC,EAAE,IAAI,EAAE,GAAG,KAAK,EAA0C;IAC7G,OAAO,KAAC,OAAO,OAAK,KAAK,EAAE,GAAG,EAAC,QAAQ,EAAC,IAAI,EAAE,IAAI,IAAI,QAAQ,GAAK,CAAA;AACrE,CAAC,CACF,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,OAAO,CAC7B,SAAS,QAAQ,CAAkC,KAAwC;IACzF,OAAO,KAAC,OAAO,OAAK,KAAK,EAAE,GAAG,EAAC,GAAG,GAAG,CAAA;AACvC,CAAC,CACF,CAAA"}
+{"version":3,"file":"IconBox.js","sourceRoot":"","sources":["../../src/components/IconBox.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAwDnD;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,OAAO,CAC5B,SAAS,OAAO,CACd,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAsB;IAE5G,KAAK,CAAC,YAAY,CAAC,KAAK,KAAK,CAAC,KAAK,CAAA,CAAC,gBAAgB;IACpD,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IAEpC,SAAS,WAAW,CAAC,CAAwB;QAC3C,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;QACZ,IAAI,GAAG,KAAK,QAAQ;YAAE,MAAM,EAAE,aAAa,EAAE,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAA;aACrD,IAAI,GAAG,KAAK,GAAG;YAAE,MAAM,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAA;IAC1D,CAAC;IAED,OAAO,KAAC,eAAe,IACrB,GAAG,EAAE,CAAC,GAAG,IAAI,GAAG,CAAQ,EACxB,SAAS,EAAC,UAAU,EACpB,SAAS,EAAE,WAAW,CAAC,CAAC,aAAa,EAAE,KAAK,IAAI,SAAS,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC,mBAC/E,QAAQ,IAAI,SAAS,EACpC,OAAO,EAAE,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,QAAQ,CAAC,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO,KAChE,KAAK,GACT,CAAA;AACJ,CAAC,CACF,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,OAAO,CAC/B,SAAS,UAAU,CAAkC,EAAE,IAAI,EAAE,GAAG,KAAK,EAA0C;IAC7G,OAAO,KAAC,OAAO,OAAK,KAAK,EAAE,GAAG,EAAC,QAAQ,EAAC,IAAI,EAAE,IAAI,IAAI,QAAQ,GAAK,CAAA;AACrE,CAAC,CACF,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,OAAO,CAC7B,SAAS,QAAQ,CAAkC,KAAwC;IACzF,OAAO,KAAC,OAAO,OAAK,KAAK,EAAE,GAAG,EAAC,GAAG,GAAG,CAAA;AACvC,CAAC,CACF,CAAA"}

package/dist/components/ImageBox.d.ts

@@ -31,14 +31,14 @@ export interface BaseImageBoxProps<T extends ImageBoxTag> extends WithColorPalet
     /**
      * Only valid if `tag` is "button" or "a".
      *
-     * Whether or not a click in this button/link should generate analytics data.
+     * Metadata for the general onClick event, set by the CitricController. Useful for creating analytics data.
      *
-     * This only takes effect if there's a CitricController in React's context. The value of `analytics` is passed to the function
+     * This only takes effect if there's a CitricController in React's context. The value of `metadata` is passed to the function
      * `onClickButton/onClickLink` of the controller.
      *
      * @default false
      */
-    analytics?: boolean;
+    metadata?: any;
 }
 export type ImageBoxProps<T extends ImageBoxTag> = HTMLTag[T] & BaseImageBoxProps<T>;
 /**
@@ -47,17 +47,19 @@ export type ImageBoxProps<T extends ImageBoxTag> = HTMLTag[T] & BaseImageBoxProp
  *
  * Hover and focus effects are applied if the ImageBox is focusable.
  *
+ * This works exactly like an IconBox, but instead of an Icon, it can contain anything.
+ *
  * @example
  * ```
  * <ImageBox><img src="https://images.com/myimage.png" /></ImageBox>
  * ```
  */
-export declare const ImageBox: <T extends ImageBoxTag = "div">({ tag, appearance, size, className, analytics, onClick, feedback, ...props }: ImageBoxProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const ImageBox: <T extends ImageBoxTag = "div">({ tag, appearance, size, className, metadata, onClick, feedback, ...props }: ImageBoxProps<T>) => import("react/jsx-runtime").JSX.Element;
 /**
  * A shortcut for `<ImageBox tag="button">`.
  *
  * Whenever a button is clicked, the function `onClickButton` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```
@@ -69,7 +71,7 @@ export declare const ImageButton: (props: Omit<ImageBoxProps<"button">, "tag">)
  * A shortcut for `<ImageBox tag="a">`.
  *
  * Whenever a link is clicked, the function `onClickLink` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```

package/dist/components/ImageBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ImageBox.d.ts","sourceRoot":"","sources":["../../src/components/ImageBox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAIrE,KAAK,WAAW,GAAG,GAAG,GAAG,QAAQ,GAAG,MAAM,GAAG,KAAK,CAAA;AAElD,MAAM,WAAW,iBAAiB,CAAC,CAAC,SAAS,WAAW,CAAE,SAAQ,gBAAgB,EAAE,eAAe;IACjG;;;;OAIG;IACH,GAAG,CAAC,EAAE,CAAC,CAAC;IACR;;;;OAIG;IACH,UAAU,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IACjC;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,WAAW,IAAI,OAAO,CAAC,CAAC,CAAC,GAAG,iBAAiB,CAAC,CAAC,CAAC,CAAA;AAEpF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,QAAQ,GACD,CAAC,SAAS,WAAW,wFACyC,aAAa,CAAC,CAAC,CAAC,4CAoBjG,CAAA;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,WAAW,UACM,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,4CAGjE,CAAA;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,SAAS,UACM,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,4CAG1D,CAAA"}
+{"version":3,"file":"ImageBox.d.ts","sourceRoot":"","sources":["../../src/components/ImageBox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAIrE,KAAK,WAAW,GAAG,GAAG,GAAG,QAAQ,GAAG,MAAM,GAAG,KAAK,CAAA;AAElD,MAAM,WAAW,iBAAiB,CAAC,CAAC,SAAS,WAAW,CAAE,SAAQ,gBAAgB,EAAE,eAAe;IACjG;;;;OAIG;IACH,GAAG,CAAC,EAAE,CAAC,CAAC;IACR;;;;OAIG;IACH,UAAU,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IACjC;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,GAAG,CAAC;CAChB;AAED,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,WAAW,IAAI,OAAO,CAAC,CAAC,CAAC,GAAG,iBAAiB,CAAC,CAAC,CAAC,CAAA;AAEpF;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,QAAQ,GACD,CAAC,SAAS,WAAW,uFACwC,aAAa,CAAC,CAAC,CAAC,4CAoBhG,CAAA;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,WAAW,UACM,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,4CAGjE,CAAA;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,SAAS,UACM,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,EAAE,KAAK,CAAC,4CAG1D,CAAA"}

package/dist/components/ImageBox.js

@@ -9,20 +9,22 @@ import { CitricComponent } from './CitricComponent.js';
  *
  * Hover and focus effects are applied if the ImageBox is focusable.
  *
+ * This works exactly like an IconBox, but instead of an Icon, it can contain anything.
+ *
  * @example
  * ```
  * <ImageBox><img src="https://images.com/myimage.png" /></ImageBox>
  * ```
  */
-export const ImageBox = withRef(function ImageBox({ tag, appearance, size, className, analytics, onClick, feedback, ...props }) {
+export const ImageBox = withRef(function ImageBox({ tag, appearance, size, className, metadata, onClick, feedback, ...props }) {
     props['aria-label'] ||= props.title; // accessibility
     const citric = useCitricController();
     function handleClick(e) {
         onClick?.(e);
         if (tag === 'button')
-            citric?.onClickButton?.(e, analytics ?? false);
+            citric?.onClickButton?.(e, metadata);
         else if (tag === 'a')
-            citric?.onClickLink?.(e, analytics ?? false);
+            citric?.onClickLink?.(e, metadata);
     }
     return _jsx(CitricComponent, { tag: (tag || 'i'), component: "icon-box", className: listToClass([appearance, size, className]), "data-feedback": feedback || undefined, onClick: ['button', 'a'].includes(tag ?? '') ? handleClick : onClick, ...props });
 });
@@ -30,7 +32,7 @@ export const ImageBox = withRef(function ImageBox({ tag, appearance, size, class
  * A shortcut for `<ImageBox tag="button">`.
  *
  * Whenever a button is clicked, the function `onClickButton` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```
@@ -44,7 +46,7 @@ export const ImageButton = withRef(function ImageButton(props) {
  * A shortcut for `<ImageBox tag="a">`.
  *
  * Whenever a link is clicked, the function `onClickLink` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  *
  * @example
  * ```

package/dist/components/ImageBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageBox.js","sourceRoot":"","sources":["../../src/components/ImageBox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AA+CnD;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,OAAO,CAC7B,SAAS,QAAQ,CACf,EAAE,GAAG,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAoB;IAE9F,KAAK,CAAC,YAAY,CAAC,KAAK,KAAK,CAAC,KAAK,CAAA,CAAC,gBAAgB;IACpD,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IAEpC,SAAS,WAAW,CAAC,CAAwB;QAC3C,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;QACZ,IAAI,GAAG,KAAK,QAAQ;YAAE,MAAM,EAAE,aAAa,EAAE,CAAC,CAAC,EAAE,SAAS,IAAI,KAAK,CAAC,CAAA;aAC/D,IAAI,GAAG,KAAK,GAAG;YAAE,MAAM,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,SAAS,IAAI,KAAK,CAAC,CAAA;IACpE,CAAC;IAED,OAAO,KAAC,eAAe,IACrB,GAAG,EAAE,CAAC,GAAG,IAAI,GAAG,CAAQ,EACxB,SAAS,EAAC,UAAU,EACpB,SAAS,EAAE,WAAW,CAAC,CAAC,UAAU,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC,mBACtC,QAAQ,IAAI,SAAS,EACpC,OAAO,EAAE,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,QAAQ,CAAC,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO,KAChE,KAAK,GACT,CAAA;AACJ,CAAC,CACF,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,OAAO,CAChC,SAAS,WAAW,CAAC,KAA2C;IAC9D,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,GAAG,EAAC,QAAQ,EAAC,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,QAAQ,GAAI,CAAA;AAC3E,CAAC,CACF,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,OAAO,CAC9B,SAAS,SAAS,CAAC,KAAsC;IACvD,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,GAAG,EAAC,GAAG,GAAG,CAAA;AACxC,CAAC,CACF,CAAA"}
+{"version":3,"file":"ImageBox.js","sourceRoot":"","sources":["../../src/components/ImageBox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AA+CnD;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,OAAO,CAC7B,SAAS,QAAQ,CACf,EAAE,GAAG,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAoB;IAE7F,KAAK,CAAC,YAAY,CAAC,KAAK,KAAK,CAAC,KAAK,CAAA,CAAC,gBAAgB;IACpD,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IAEpC,SAAS,WAAW,CAAC,CAAwB;QAC3C,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;QACZ,IAAI,GAAG,KAAK,QAAQ;YAAE,MAAM,EAAE,aAAa,EAAE,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAA;aACrD,IAAI,GAAG,KAAK,GAAG;YAAE,MAAM,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAA;IAC1D,CAAC;IAED,OAAO,KAAC,eAAe,IACrB,GAAG,EAAE,CAAC,GAAG,IAAI,GAAG,CAAQ,EACxB,SAAS,EAAC,UAAU,EACpB,SAAS,EAAE,WAAW,CAAC,CAAC,UAAU,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC,mBACtC,QAAQ,IAAI,SAAS,EACpC,OAAO,EAAE,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,QAAQ,CAAC,GAAG,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO,KAChE,KAAK,GACT,CAAA;AACJ,CAAC,CACF,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,OAAO,CAChC,SAAS,WAAW,CAAC,KAA2C;IAC9D,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,GAAG,EAAC,QAAQ,EAAC,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,QAAQ,GAAI,CAAA;AAC3E,CAAC,CACF,CAAA;AAED;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,OAAO,CAC9B,SAAS,SAAS,CAAC,KAAsC;IACvD,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,GAAG,EAAC,GAAG,GAAG,CAAA;AACxC,CAAC,CACF,CAAA"}

package/dist/components/Link.d.ts

@@ -6,21 +6,21 @@ export interface BaseLinkProps extends WithColor {
      */
     appearance?: TextAppearance;
     /**
-     * Whether or not a click in this link should generate analytics data.
+     * Metadata for the general onClick event, set by the CitricController. Useful for creating analytics data.
      *
-     * This only takes effect if there's a CitricController in React's context. The value of `analytics` is passed to the function
+     * This only takes effect if there's a CitricController in React's context. The value of `metadata` is passed to the function
      * `onClickLink` of the controller.
      *
      * @default false
      */
-    analytics?: boolean;
+    metadata?: any;
 }
 export type LinkProps = React.JSX.IntrinsicElements['a'] & BaseLinkProps;
 /**
  * Renders an html anchor by default, the actual component to render may be set on a CitricController, through the function `renderLink`.
  *
  * Whenever a link is clicked, the function `onClickLink` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  */
-export declare const Link: ({ appearance, color, style, className, children, onClick, analytics, ...props }: LinkProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Link: ({ appearance, color, style, className, children, onClick, metadata, ...props }: LinkProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Link.d.ts.map

package/dist/components/Link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/components/Link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAKpD,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C;;;OAGG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,GAAG,CAAC,GAAG,aAAa,CAAA;AAExE;;;;;GAKG;AACH,eAAO,MAAM,IAAI,oFAA6F,SAAS,4CAerH,CAAA"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/components/Link.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAKpD,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C;;;OAGG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,GAAG,CAAC;CAChB;AAED,MAAM,MAAM,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,GAAG,CAAC,GAAG,aAAa,CAAA;AAExE;;;;;GAKG;AACH,eAAO,MAAM,IAAI,mFAA4F,SAAS,4CAepH,CAAA"}

package/dist/components/Link.js

@@ -7,9 +7,9 @@ import { asCitricProps, CitricComponent } from './CitricComponent.js';
  * Renders an html anchor by default, the actual component to render may be set on a CitricController, through the function `renderLink`.
  *
  * Whenever a link is clicked, the function `onClickLink` of the nearest CitricController is called with the event and the value of the
- * prop `analytics`.
+ * prop `metadata`.
  */
-export const Link = withRef(({ appearance, color, style, className, children, onClick, analytics, ...props }) => {
+export const Link = withRef(({ appearance, color, style, className, children, onClick, metadata, ...props }) => {
     const citric = useCitricController();
     const linkProps = {
         component: 'link',
@@ -17,7 +17,7 @@ export const Link = withRef(({ appearance, color, style, className, children, on
         className: applyTextAppearance(className, appearance),
         onClick: (e) => {
             onClick?.(e);
-            citric?.onClickLink?.(e, analytics ?? false);
+            citric?.onClickLink?.(e, metadata ?? false);
         },
         ...props,
     };

package/dist/components/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../src/components/Link.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAA;AAC9D,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAqBlE;;;;;GAKG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,EAAa,EAAE,EAAE;IACzH,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IACpC,MAAM,SAAS,GAAG;QAChB,SAAS,EAAE,MAAM;QACjB,KAAK,EAAE,UAAU,CAAC,KAAK,EAAE,KAAK,CAAC;QAC/B,SAAS,EAAE,mBAAmB,CAAC,SAAS,EAAE,UAAU,CAAC;QACrD,OAAO,EAAE,CAAC,CAAsC,EAAE,EAAE;YAClD,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;YACZ,MAAM,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,SAAS,IAAI,KAAK,CAAC,CAAA;QAC9C,CAAC;QACD,GAAG,KAAK;KACA,CAAA;IACV,OAAO,MAAM,EAAE,UAAU;QACvB,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC,EAAE,GAAG,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC;QAC9D,CAAC,CAAC,KAAC,eAAe,IAAC,GAAG,EAAC,GAAG,KAAK,SAAS,YAAG,QAAQ,GAAmB,CAAA;AAC1E,CAAC,CAAC,CAAA"}
+{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../src/components/Link.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAA;AAC9D,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAqBlE;;;;;GAKG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAa,EAAE,EAAE;IACxH,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAA;IACpC,MAAM,SAAS,GAAG;QAChB,SAAS,EAAE,MAAM;QACjB,KAAK,EAAE,UAAU,CAAC,KAAK,EAAE,KAAK,CAAC;QAC/B,SAAS,EAAE,mBAAmB,CAAC,SAAS,EAAE,UAAU,CAAC;QACrD,OAAO,EAAE,CAAC,CAAsC,EAAE,EAAE;YAClD,OAAO,EAAE,CAAC,CAAC,CAAC,CAAA;YACZ,MAAM,EAAE,WAAW,EAAE,CAAC,CAAC,EAAE,QAAQ,IAAI,KAAK,CAAC,CAAA;QAC7C,CAAC;QACD,GAAG,KAAK;KACA,CAAA;IACV,OAAO,MAAM,EAAE,UAAU;QACvB,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,aAAa,CAAC,EAAE,GAAG,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC;QAC9D,CAAC,CAAC,KAAC,eAAe,IAAC,GAAG,EAAC,GAAG,KAAK,SAAS,YAAG,QAAQ,GAAmB,CAAA;AAC1E,CAAC,CAAC,CAAA"}

package/dist/components/Overlay/index.d.ts

@@ -27,5 +27,5 @@ import { OverlayProps } from './types.js';
  * )
  * ```
  */
-export declare function Overlay<T extends keyof HTMLTag>({ tag, children, content, position, triggerOn, attributes, onRenderChild, autoFocusBehavior, ...props }: OverlayProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function Overlay<T extends keyof HTMLTag>({ tag, children, content, position, triggerOn, alignment, attributes, onRenderChild, autoFocusBehavior, ...props }: OverlayProps<T>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Overlay/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Overlay/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AAGrC,OAAO,EAAqB,YAAY,EAAE,MAAM,SAAS,CAAA;AAOzD;;;;;;;;;;GAUG;AAEH;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,OAAO,EAAE,EAC/C,GAAG,EACH,QAAQ,EACR,OAAO,EACP,QAAgB,EAChB,SAAmB,EACnB,UAAU,EACV,aAAa,EACb,iBAA8B,EAC9B,GAAG,KAAK,EACT,EAAE,YAAY,CAAC,CAAC,CAAC,2CA+GjB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Overlay/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AAGrC,OAAO,EAAqB,YAAY,EAAE,MAAM,SAAS,CAAA;AAOzD;;;;;;;;;;GAUG;AAEH;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,OAAO,EAAE,EAC/C,GAAG,EACH,QAAQ,EACR,OAAO,EACP,QAAgB,EAChB,SAAmB,EACnB,SAAoB,EACpB,UAAU,EACV,aAAa,EACb,iBAA8B,EAC9B,GAAG,KAAK,EACT,EAAE,YAAY,CAAC,CAAC,CAAC,2CAgHjB"}

package/dist/components/Overlay/index.js

@@ -34,14 +34,14 @@ const arbitraryRenderTime = 20;
  * )
  * ```
  */
-export function Overlay({ tag, children, content, position = 'top', triggerOn = 'hover', attributes, onRenderChild, autoFocusBehavior = 'keyboard', ...props }) {
+export function Overlay({ tag, children, content, position = 'top', triggerOn = 'hover', alignment = 'center', attributes, onRenderChild, autoFocusBehavior = 'keyboard', ...props }) {
     const controller = useRef({ close: () => Promise.resolve() });
     const wrapper = useRef(null);
     // props that don't require removing and reattaching the event listeners
-    const dynamic = useRef({ tag, content, position, attributes });
+    const dynamic = useRef({ tag, content, position, alignment, attributes });
     useEffect(() => {
-        dynamic.current = { tag, content, position, attributes };
-    }, [tag, content, position, attributes]);
+        dynamic.current = { tag, content, position, alignment, attributes };
+    }, [tag, content, position, alignment, attributes]);
     useEffect(() => {
         let visible = false;
         let hideOnClickOutside;
@@ -71,6 +71,7 @@ export function Overlay({ tag, children, content, position = 'top', triggerOn =
                     : _jsx(OverlayProvider, { value: controller.current, children: dynamic.current.content }),
                 target,
                 position: dynamic.current.position,
+                alignment: dynamic.current.alignment,
                 attributes: dynamic.current.attributes,
             });
             hideOverlay = hideFn;