npm - @clicoh/orion-library - Versions diffs - 1.2.0-beta.22 → 1.2.0-beta.23 - Mend

@clicoh/orion-library 1.2.0-beta.22 → 1.2.0-beta.23

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 (124) hide show

package/dist/components/03-organisms/BarChart/BarChart.jsx ADDED Viewed

@@ -0,0 +1,116 @@
+import clsx from 'clsx';
+import { Each, Show } from '../../00-base';
+const seriesStyleMap = [
+    'bg-lavender dark:bg-lavender-dark',
+    'bg-cyan dark:bg-cyan-dark',
+    'bg-olive dark:bg-olive-dark',
+    'bg-amber dark:bg-amber-dark',
+];
+const seriesStyle = (index) => seriesStyleMap[index % seriesStyleMap.length];
+const MUTED = 'text-gray-1 dark:text-gray-2';
+const REFERENCE_LINE = 'border-amber dark:border-amber-dark';
+/**
+ * BarChart component for comparing a few values side by side, as vertical bars.
+ *
+ * Each label gets one bar per series, with its value on top. A `reference`
+ * draws a dashed line, such as a goal, over the bars; its label goes in the
+ * legend under the plot, so no bar covers it. The bars are hidden from screen
+ * readers, which read a table with the same values instead.
+ *
+ * @component
+ * @example
+ * // Mean cost per route, with the goal as a reference line
+ * <BarChart
+ *   labels={['lookup', 'similar', 'model']}
+ *   series={[{ name: 'USD per case', data: [0.03, 0.09, 0.24] }]}
+ *   formatValue={(value) => value.toFixed(2)}
+ *   reference={{ value: 0.25, label: 'goal 0.25' }}
+ *   ariaLabel="Mean cost per route"
+ * />
+ *
+ * @param {Object} props - The properties of the BarChart component.
+ * @param {string[]} props.labels - One label per group of bars, under the plot.
+ * @param {BarChartSeries[]} props.series - The values. With more than one series the bars are grouped and a legend shows up.
+ * @param {string} props.ariaLabel - What the chart shows: the caption of the table that screen readers read.
+ * @param {Function} [props.formatValue] - Turns each value into the text over its bar and in the table. Defaults to `String`.
+ * @param {BarChartReference} [props.reference] - A dashed line at that value; its label goes in the legend.
+ * @param {number} [props.height=200] - Height of the plot in pixels, without the labels.
+ * @param {Object} [props.restProps] - Additional properties to be passed to the `figure`.
+ *
+ * @returns {ReactNode} The rendered BarChart component.
+ */
+export function BarChart({ labels, series, ariaLabel, formatValue = String, reference, height = 200, ...restProps }) {
+    const values = series.flatMap((item) => item.data);
+    const max = Math.max(...values, reference?.value ?? 0, 0) || 1;
+    const share = (value) => `${(Math.max(value, 0) / max) * 100}%`;
+    return (<figure {...restProps} className={clsx('m-0 text-black dark:text-white', restProps.className)}>
+      <div aria-hidden="true" className="pt-5">
+        <div className="border-gray-5 dark:border-gray-1 relative flex items-end gap-4 border-b px-2" style={{ height }}>
+          <Show>
+            <Show.When isTrue={!!reference}>
+              <div className={clsx('absolute inset-x-0 z-10 border-t border-dashed', REFERENCE_LINE)} style={{ bottom: share(reference?.value ?? 0) }}/>
+            </Show.When>
+          </Show>
+          <Each of={labels} render={(label, labelIndex) => (<div key={label} className="flex h-full flex-1 items-end justify-center gap-1">
+                <Each of={series} render={(item, seriesIndex) => (<div key={item.name} className={clsx('relative min-h-0.5 max-w-14 flex-1 rounded-t', seriesStyle(seriesIndex))} style={{ height: share(item.data[labelIndex] ?? 0) }}>
+                      <span className="absolute bottom-full left-1/2 mb-0.5 -translate-x-1/2 text-xs leading-4 font-semibold whitespace-nowrap">
+                        {formatValue(item.data[labelIndex] ?? 0)}
+                      </span>
+                    </div>)}/>
+              </div>)}/>
+        </div>
+        <div className="flex gap-4 px-2 pt-2">
+          <Each of={labels} render={(label) => (<span key={label} className={clsx('min-w-0 flex-1 text-center text-xs leading-4 break-words', MUTED)}>
+                {label}
+              </span>)}/>
+        </div>
+        <Show>
+          <Show.When isTrue={series.length > 1 || !!reference}>
+            <div className="flex flex-wrap gap-4 px-2 pt-3">
+              <Show>
+                <Show.When isTrue={series.length > 1}>
+                  <Each of={series} render={(item, seriesIndex) => (<span key={item.name} className={clsx('inline-flex items-center gap-1.5 text-xs', MUTED)}>
+                        <span className={clsx('size-2 rounded-sm', seriesStyle(seriesIndex))}/>
+                        {item.name}
+                      </span>)}/>
+                </Show.When>
+              </Show>
+              <Show>
+                <Show.When isTrue={!!reference}>
+                  <span className="text-amber-strong dark:text-amber-dark inline-flex items-center gap-1.5 text-xs">
+                    <span className={clsx('w-4 border-t-2 border-dashed', REFERENCE_LINE)}/>
+                    {reference?.label}
+                  </span>
+                </Show.When>
+              </Show>
+            </div>
+          </Show.When>
+        </Show>
+      </div>
+      <table className="sr-only">
+        <caption>{ariaLabel}</caption>
+        <thead>
+          <tr>
+            <td />
+            <Each of={series} render={(item) => (<th key={item.name} scope="col">
+                  {item.name}
+                </th>)}/>
+          </tr>
+        </thead>
+        <tbody>
+          <Each of={labels} render={(label, labelIndex) => (<tr key={label}>
+                <th scope="row">{label}</th>
+                <Each of={series} render={(item) => (<td key={item.name}>
+                      {formatValue(item.data[labelIndex] ?? 0)}
+                    </td>)}/>
+              </tr>)}/>
+        </tbody>
+      </table>
+      <Show>
+        <Show.When isTrue={!!reference}>
+          <p className="sr-only">{reference?.label}</p>
+        </Show.When>
+      </Show>
+    </figure>);
+}
+//# sourceMappingURL=BarChart.jsx.map

package/dist/components/03-organisms/BarChart/BarChart.jsx.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"BarChart.jsx","sourceRoot":"","sources":["../../../../src/components/03-organisms/BarChart/BarChart.tsx"],"names":[],"mappings":"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"}

package/dist/components/03-organisms/BarChart/index.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export * from './BarChart';
2	+ //# sourceMappingURL=index.d.ts.map

package/dist/components/03-organisms/BarChart/index.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/03-organisms/BarChart/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}

package/dist/components/03-organisms/BarChart/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export * from './BarChart';
2	+ //# sourceMappingURL=index.js.map

package/dist/components/03-organisms/BarChart/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/03-organisms/BarChart/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}

package/dist/components/03-organisms/DataTable/DataTable.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import { ComponentProps, HTMLAttributes, ReactNode } from 'react';
 import { Pagination, Table } from '../../02-molecules';
 type DataTableProps = {
     table: Pick<ComponentProps<typeof Table>, 'id' | 'headers' | 'data' | 'action' | 'actions' | 'loading' | 'selectable' | 'multiple' | 'currentSelection' | 'setCurrentSelection' | 'tableName' | 'selectAllLabel' | 'getRowSelectionLabel' | 'getRowActionLabel' | 'footer' | 'empty' | 'tableProps'>;
-    pagination: Pick<ComponentProps<typeof Pagination>, 'currentPage' | 'pageChange' | 'itemsPerPage' | 'totalItems' | 'navigationLabel' | 'previousPageLabel' | 'nextPageLabel' | 'itemsPerPageLabel'>;
+    pagination?: Pick<ComponentProps<typeof Pagination>, 'currentPage' | 'pageChange' | 'itemsPerPage' | 'totalItems' | 'navigationLabel' | 'previousPageLabel' | 'nextPageLabel' | 'itemsPerPageLabel'>;
     summary?: ReactNode;
     modifier?: DataTableVariants;
 } & HTMLAttributes<HTMLDivElement>;
@@ -14,6 +14,9 @@ export type DataTableVariants = 'card' | 'plain';
  * so only the row separators are left, for tables that read as part of the page
  * instead of as a card.
  *
+ * Without `pagination` the table shows every row it gets and the pagination
+ * row goes away; a `summary` still gets a row of its own.
+ *
  * @component
  * @example
  * // Example usage of DataTable component
@@ -42,7 +45,7 @@ export type DataTableVariants = 'card' | 'plain';
  * @param {Function} props.table.action - The action to be performed on table data.
  * @param {Array<Object>} props.table.actions - The actions available for table rows.
  * @param {boolean} props.table.loading - The loading state of the table.
- * @param {Object} props.pagination - The pagination configuration.
+ * @param {Object} [props.pagination] - The pagination configuration. Without it, no pagination row.
  * @param {number} props.pagination.currentPage - The current page number.
  * @param {Function} props.pagination.pageChange - The function to handle page changes.
  * @param {number} props.pagination.itemsPerPage - The number of items per page.

package/dist/components/03-organisms/DataTable/DataTable.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../../src/components/03-organisms/DataTable/DataTable.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAE5E,OAAO,EACL,UAAU,EACV,KAAK,EAGN,MAAM,oBAAoB,CAAC;AAE5B,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,IAAI,CACT,cAAc,CAAC,OAAO,KAAK,CAAC,EAC1B,IAAI,GACJ,SAAS,GACT,MAAM,GACN,QAAQ,GACR,SAAS,GACT,SAAS,GACT,YAAY,GACZ,UAAU,GACV,kBAAkB,GAClB,qBAAqB,GACrB,WAAW,GACX,gBAAgB,GAChB,sBAAsB,GACtB,mBAAmB,GACnB,QAAQ,GACR,OAAO,GACP,YAAY,CACf,CAAC;IACF,UAAU,EAAE,IAAI,~~CACd~~,cAAc,CAAC,OAAO,UAAU,CAAC,EAC/B,aAAa,GACb,YAAY,GACZ,cAAc,GACd,YAAY,GACZ,iBAAiB,GACjB,mBAAmB,GACnB,eAAe,GACf,mBAAmB,CACtB,CAAC;IACF,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;CAC9B,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,OAAO,CAAC;AAOjD~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG~~;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,UAAU,EACV,OAAO,EACP,QAAkB,EAClB,GAAG,SAAS,EACb,EAAE,cAAc,GAAG,SAAS,~~CA+E5B~~"}
1	+ {"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../../src/components/03-organisms/DataTable/DataTable.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAE5E,OAAO,EACL,UAAU,EACV,KAAK,EAGN,MAAM,oBAAoB,CAAC;AAE5B,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,IAAI,CACT,cAAc,CAAC,OAAO,KAAK,CAAC,EAC1B,IAAI,GACJ,SAAS,GACT,MAAM,GACN,QAAQ,GACR,SAAS,GACT,SAAS,GACT,YAAY,GACZ,UAAU,GACV,kBAAkB,GAClB,qBAAqB,GACrB,WAAW,GACX,gBAAgB,GAChB,sBAAsB,GACtB,mBAAmB,GACnB,QAAQ,GACR,OAAO,GACP,YAAY,CACf,CAAC;IACF,UAAU,CAAC,EAAE,IAAI,CACf,cAAc,CAAC,OAAO,UAAU,CAAC,EAC/B,aAAa,GACb,YAAY,GACZ,cAAc,GACd,YAAY,GACZ,iBAAiB,GACjB,mBAAmB,GACnB,eAAe,GACf,mBAAmB,CACtB,CAAC;IACF,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;CAC9B,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEnC,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,OAAO,CAAC;AAOjD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgDG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,UAAU,EACV,OAAO,EACP,QAAkB,EAClB,GAAG,SAAS,EACb,EAAE,cAAc,GAAG,SAAS,CAmF5B"}

package/dist/components/03-organisms/DataTable/DataTable.jsx CHANGED Viewed

@@ -14,6 +14,9 @@ const styleMap = {
  * so only the row separators are left, for tables that read as part of the page
  * instead of as a card.
  *
+ * Without `pagination` the table shows every row it gets and the pagination
+ * row goes away; a `summary` still gets a row of its own.
+ *
  * @component
  * @example
  * // Example usage of DataTable component
@@ -42,7 +45,7 @@ const styleMap = {
  * @param {Function} props.table.action - The action to be performed on table data.
  * @param {Array<Object>} props.table.actions - The actions available for table rows.
  * @param {boolean} props.table.loading - The loading state of the table.
- * @param {Object} props.pagination - The pagination configuration.
+ * @param {Object} [props.pagination] - The pagination configuration. Without it, no pagination row.
  * @param {number} props.pagination.currentPage - The current page number.
  * @param {Function} props.pagination.pageChange - The function to handle page changes.
  * @param {number} props.pagination.itemsPerPage - The number of items per page.
@@ -54,10 +57,10 @@ const styleMap = {
  * @returns {ReactNode} The rendered DataTable component.
  */
 export function DataTable({ table, pagination, summary, modifier = 'plain', ...restProps }) {
-    const [numberOfRows, setNumberOfRows] = useState(pagination.itemsPerPage?.at(0) || 10);
+    const [numberOfRows, setNumberOfRows] = useState(pagination?.itemsPerPage?.at(0) || 10);
     const handlePageChange = (page, itemsPerPage) => {
         setNumberOfRows(itemsPerPage || 10);
-        pagination.pageChange(page, itemsPerPage);
+        pagination?.pageChange(page, itemsPerPage);
     };
     return (<div {...restProps} data-orion-part="data-table" data-modifier={modifier} className={clsx('dark:text-white', styleMap[modifier], restProps.className)}>
       <Show>
@@ -72,10 +75,10 @@ export function DataTable({ table, pagination, summary, modifier = 'plain', ...r
           <Table {...table} numberOfRows={numberOfRows} selectable={true} multiple={false} currentSelection={table.currentSelection} setCurrentSelection={table.setCurrentSelection}/>
         </Show.When>
       </Show>
-      <div className={clsx('flex flex-wrap items-center gap-4 px-4 py-2', summary ? 'justify-between' : 'justify-end')}>
-        {summary}
-        <Pagination {...pagination} pageChange={handlePageChange} className={'justify-end'} disableNavigation={table.loading} disabledNext={table.data.length < numberOfRows}/>
-      </div>
+      {(!!pagination || !!summary) && (<div className={clsx('flex flex-wrap items-center gap-4 px-4 py-2', summary ? 'justify-between' : 'justify-end')}>
+          {summary}
+          {!!pagination && (<Pagination {...pagination} pageChange={handlePageChange} className={'justify-end'} disableNavigation={table.loading} disabledNext={table.data.length < numberOfRows}/>)}
+        </div>)}
     </div>);
 }
 //# sourceMappingURL=DataTable.jsx.map

package/dist/components/03-organisms/DataTable/DataTable.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTable.jsx","sourceRoot":"","sources":["../../../../src/components/03-organisms/DataTable/DataTable.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAA6C,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5E,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACrC,OAAO,EACL,UAAU,EACV,KAAK,GAGN,MAAM,oBAAoB,CAAC;AAwC5B,MAAM,QAAQ,GAAsC;IAClD,IAAI,EAAE,IAAI,CAAC,oDAAoD,CAAC;IAChE,KAAK,EAAE,EAAE;CACV,CAAC;AAEF~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG~~;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,KAAK,EACL,UAAU,EACV,OAAO,EACP,QAAQ,GAAG,OAAO,EAClB,GAAG,SAAS,EACG;IACf,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAC9C,UAAU,~~CAAC~~,YAAY,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,~~CACrC~~,CAAC;IAEF,MAAM,gBAAgB,GAAG,CAAC,IAAY,EAAE,YAAqB,EAAE,EAAE;QAC/D,eAAe,CAAC,YAAY,IAAI,EAAE,CAAC,CAAC;QACpC,UAAU,~~CAAC~~,UAAU,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;~~IAC5C~~,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,GAAG,CACF,IAAI,SAAS,CAAC,CACd,eAAe,CAAC,YAAY,CAC5B,aAAa,CAAC,CAAC,QAAQ,CAAC,CACxB,SAAS,CAAC,CAAC,IAAI,CACb,iBAAiB,EACjB,QAAQ,CAAC,QAAQ,CAAC,EAClB,SAAS,CAAC,SAAS,CACpB,CAAC,CAEF;MAAA,CAAC,IAAI,CACH;QAAA,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CACnC;UAAA,CAAC,KAAK,CACJ,IAAI,KAAK,CAAC,CACV,YAAY,CAAC,CAAC,YAAY,CAAC,CAC3B,UAAU,CAAC,CAAC,KAAK,CAAC,CAClB,QAAQ,CAAC,CAAC,SAAS,CAAC,CACpB,gBAAgB,CAAC,CAAC,SAAS,CAAC,CAC5B,mBAAmB,CAAC,CAAC,SAAS,CAAC,EAEnC;QAAA,EAAE,IAAI,CAAC,IAAI,CACX;QAAA,CAAC,IAAI,CAAC,IAAI,CACR,MAAM,CAAC,CACL,CAAC,CAAE,KAAK,CAAC,UAAsB;YAC/B,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,KAAK,SAAS,CACnD,CAAC,CAED;UAAA,CAAC,KAAK,CACJ,IAAI,KAAK,CAAC,CACV,YAAY,CAAC,CAAC,YAAY,CAAC,CAC3B,UAAU,CAAC,CAAC,IAAI,CAAC,CACjB,QAAQ,CAAC,CAAC,IAAI,CAAC,CACf,gBAAgB,CAAC,CAAC,KAAK,CAAC,gBAAsC,CAAC,CAC/D,mBAAmB,CAAC,CAClB,KAAK,CAAC,mBACR,CAAC,EAEL;QAAA,EAAE,IAAI,CAAC,IAAI,CACX;QAAA,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAE,KAAK,CAAC,UAAsB,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CACpE;UAAA,CAAC,KAAK,CACJ,IAAI,KAAK,CAAC,CACV,YAAY,CAAC,CAAC,YAAY,CAAC,CAC3B,UAAU,CAAC,CAAC,IAAI,CAAC,CACjB,QAAQ,CAAC,CAAC,KAAK,CAAC,CAChB,gBAAgB,CAAC,CAAC,KAAK,CAAC,gBAA6B,CAAC,CACtD,mBAAmB,CAAC,CAClB,KAAK,CAAC,mBACR,CAAC,EAEL;QAAA,EAAE,IAAI,CAAC,IAAI,CACb;MAAA,EAAE,IAAI,CACN;MAAA,CAAC,GAAG,CACF,SAAS,CAAC,CAAC,IAAI,CACb,6CAA6C,EAC7C,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,aAAa,CAC5C,CAAC,CAEF;~~QAAA~~,CAAC,OAAO,CACR;~~QAAA~~,CAAC,UAAU,CACT,IAAI,UAAU,CAAC,CACf,UAAU,CAAC,CAAC,gBAAgB,CAAC,CAC7B,SAAS,CAAC,CAAC,aAAa,CAAC,CACzB,iBAAiB,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CACjC,YAAY,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,YAAY,CAAC,~~EAEnD~~;~~MAAA~~,EAAE,GAAG,CACP;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC"}
1	+ {"version":3,"file":"DataTable.jsx","sourceRoot":"","sources":["../../../../src/components/03-organisms/DataTable/DataTable.tsx"],"names":[],"mappings":"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"}

package/dist/components/03-organisms/index.d.ts CHANGED Viewed

@@ -4,4 +4,5 @@ export * from './AsideFilters';
 export * from './Header';
 export * from './ModalMultiple';
 export * from './MapView';
+export * from './BarChart';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/03-organisms/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/03-organisms/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/03-organisms/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC"}

package/dist/components/03-organisms/index.js CHANGED Viewed

@@ -4,4 +4,5 @@ export * from './AsideFilters';
 export * from './Header';
 export * from './ModalMultiple';
 export * from './MapView';
+export * from './BarChart';
 //# sourceMappingURL=index.js.map

package/dist/components/03-organisms/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/03-organisms/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC"}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/03-organisms/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC"}

package/dist/components/04-templates/LoginTemplate/LoginForm.d.ts CHANGED Viewed

@@ -16,6 +16,7 @@ export type LoginFormSubmitState = {
     label: string;
 };
 export type LoginFormErrorStyle = 'text' | 'message';
+export type LoginFormCodeLayout = 'replace' | 'below';
 type LoginFormProps = {
     login: (formData: FormData) => Promise<string | undefined>;
     callback?: () => void;
@@ -37,6 +38,8 @@ type LoginFormProps = {
     errorStyle?: LoginFormErrorStyle;
     toastErrors?: boolean;
     showSpinner?: boolean;
+    codeLayout?: LoginFormCodeLayout;
+    onBack?: () => void;
 };
 /**
  * LoginForm component for rendering a login form with email and password
@@ -87,9 +90,11 @@ type LoginFormProps = {
  * @param {'text' | 'message'} [props.errorStyle='text'] - `text` shows the error as red text under the buttons; `message` as an error `InlineMessage` above the submit button.
  * @param {boolean} [props.toastErrors=true] - Also shows each error in a toast.
  * @param {boolean} [props.showSpinner=true] - Shows a spinner under the form while `login` runs. Turn it off when `renderSubmit` already shows the wait.
+ * @param {'replace' | 'below'} [props.codeLayout='replace'] - `replace` swaps the email and password for the code step; `below` keeps them on screen, read-only, with the code under them, and leaves them read-only instead of disabled while `login` runs. With `below` the browser only takes the sign-in as done when the code is accepted, not when the code step shows up.
+ * @param {Function} [props.onBack] - Called when the user leaves the code step or the MFA setup to edit the email and password.
  *
  * @returns {ReactNode} The rendered LoginForm component.
  */
-export declare function LoginForm({ login, callback, needCode, lengthCode, setupMfa, showPasswordAriaLabel, hidePasswordAriaLabel, getOtpDigitAriaLabel, loadingLabel, setupMfaAccessibilityLabels, title, description, labels, forgotPassword, footer, renderSubmit, errorStyle, toastErrors, showSpinner, }: LoginFormProps): ReactNode;
+export declare function LoginForm({ login, callback, needCode, lengthCode, setupMfa, showPasswordAriaLabel, hidePasswordAriaLabel, getOtpDigitAriaLabel, loadingLabel, setupMfaAccessibilityLabels, title, description, labels, forgotPassword, footer, renderSubmit, errorStyle, toastErrors, showSpinner, codeLayout, onBack, }: LoginFormProps): ReactNode;
 export {};
 //# sourceMappingURL=LoginForm.d.ts.map

package/dist/components/04-templates/LoginTemplate/LoginForm.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LoginForm.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginForm.tsx"],"names":[],"mappings":"AAGA,OAAO,~~EAAoB~~,SAAS,~~EAAuB~~,MAAM,OAAO,CAAC;~~AAYzE~~,OAAO,EAAY,KAAK,2BAA2B,EAAE,MAAM,YAAY,CAAC;~~AAExE~~,0EAA0E;AAC1E,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,kEAAkE;AAClE,MAAM,MAAM,oBAAoB,GAAG;IACjC,iCAAiC;IACjC,OAAO,EAAE,OAAO,CAAC;IACjB,uCAAuC;IACvC,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,SAAS,CAAC;AAErD,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IAC3D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC,SAAS,CAAC,CAAC;IACzE,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACjD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,2BAA2B,CAAC,EAAE,2BAA2B,CAAC;IAC1D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,SAAS,CAAC;IAC1D,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;~~CACvB~~,CAAC;~~AAUF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG~~;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,QAAgB,EAChB,UAAc,EACd,QAAQ,EACR,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,YAAY,EACZ,2BAA2B,EAC3B,KAAqB,EACrB,WAAW,EACX,MAAM,EACN,cAAc,EACd,MAAM,EACN,YAAY,EACZ,UAAmB,EACnB,WAAkB,EAClB,WAAkB,~~GACnB~~,EAAE,cAAc,GAAG,SAAS,~~CAkK5B~~"}
1	+ {"version":3,"file":"LoginForm.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginForm.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEL,SAAS,EAIV,MAAM,OAAO,CAAC;AAYf,OAAO,EAAY,KAAK,2BAA2B,EAAE,MAAM,YAAY,CAAC;AAGxE,0EAA0E;AAC1E,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,kEAAkE;AAClE,MAAM,MAAM,oBAAoB,GAAG;IACjC,iCAAiC;IACjC,OAAO,EAAE,OAAO,CAAC;IACjB,uCAAuC;IACvC,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,SAAS,CAAC;AAErD,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,OAAO,CAAC;AAEtD,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IAC3D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC,SAAS,CAAC,CAAC;IACzE,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACjD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,2BAA2B,CAAC,EAAE,2BAA2B,CAAC;IAC1D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,SAAS,CAAC;IAC1D,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAaF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,QAAgB,EAChB,UAAc,EACd,QAAQ,EACR,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,YAAY,EACZ,2BAA2B,EAC3B,KAAqB,EACrB,WAAW,EACX,MAAM,EACN,cAAc,EACd,MAAM,EACN,YAAY,EACZ,UAAmB,EACnB,WAAkB,EAClB,WAAkB,EAClB,UAAsB,EACtB,MAAM,GACP,EAAE,cAAc,GAAG,SAAS,CAoL5B"}

package/dist/components/04-templates/LoginTemplate/LoginForm.jsx CHANGED Viewed

@@ -1,10 +1,12 @@
 'use client';
 import clsx from 'clsx';
-import { useEffect, useState } from 'react';
+import { useEffect, useRef, useState, } from 'react';
 import { FiArrowRight } from 'react-icons/fi';
 import { Button, Heading, Input, OtpInput, Paragraph, showToast, Spinner, } from '../../01-atoms';
 import { InlineMessage } from '../../02-molecules';
 import { SetupMfa } from './SetupMfa';
+import { submitOnEnter } from './submitOnEnter';
+const READ_ONLY_TEXT = 'read-only:text-gray-1 dark:read-only:text-gray-2 read-only:focus:text-gray-1 dark:read-only:focus:text-gray-2';
 const DEFAULT_LABELS = {
     username: 'Usuario',
     password: 'Contraseña',
@@ -61,21 +63,38 @@ const DEFAULT_LABELS = {
  * @param {'text' | 'message'} [props.errorStyle='text'] - `text` shows the error as red text under the buttons; `message` as an error `InlineMessage` above the submit button.
  * @param {boolean} [props.toastErrors=true] - Also shows each error in a toast.
  * @param {boolean} [props.showSpinner=true] - Shows a spinner under the form while `login` runs. Turn it off when `renderSubmit` already shows the wait.
+ * @param {'replace' | 'below'} [props.codeLayout='replace'] - `replace` swaps the email and password for the code step; `below` keeps them on screen, read-only, with the code under them, and leaves them read-only instead of disabled while `login` runs. With `below` the browser only takes the sign-in as done when the code is accepted, not when the code step shows up.
+ * @param {Function} [props.onBack] - Called when the user leaves the code step or the MFA setup to edit the email and password.
  *
  * @returns {ReactNode} The rendered LoginForm component.
  */
-export function LoginForm({ login, callback, needCode = false, lengthCode = 6, setupMfa, showPasswordAriaLabel, hidePasswordAriaLabel, getOtpDigitAriaLabel, loadingLabel, setupMfaAccessibilityLabels, title = 'Bienvenido!', description, labels, forgotPassword, footer, renderSubmit, errorStyle = 'text', toastErrors = true, showSpinner = true, }) {
+export function LoginForm({ login, callback, needCode = false, lengthCode = 6, setupMfa, showPasswordAriaLabel, hidePasswordAriaLabel, getOtpDigitAriaLabel, loadingLabel, setupMfaAccessibilityLabels, title = 'Bienvenido!', description, labels, forgotPassword, footer, renderSubmit, errorStyle = 'text', toastErrors = true, showSpinner = true, codeLayout = 'replace', onBack, }) {
     const [errorMessage, setErrorMessage] = useState();
     const [otpCode, setOtpCode] = useState('');
     const [isPending, setIsPending] = useState(false);
     const [qr, setQr] = useState();
     const [showLogin, setShowLogin] = useState(!needCode);
+    const codeRef = useRef(null);
     const copy = { ...DEFAULT_LABELS, ...labels };
+    const showCredentials = showLogin || codeLayout === 'below';
+    // Chrome takes the sign-in as done when no field of the form can take focus once the request ends.
+    const lockedCredentials = !showLogin || (isPending && codeLayout === 'below');
+    const credentialState = {
+        disabled: isPending && codeLayout !== 'below',
+        readOnly: lockedCredentials,
+        className: lockedCredentials ? READ_ONLY_TEXT : undefined,
+    };
     useEffect(() => {
         setShowLogin(!needCode);
     }, [needCode]);
+    useEffect(() => {
+        if (!showLogin && !qr)
+            codeRef.current?.querySelector('input')?.focus();
+    }, [showLogin, qr]);
     const handlerSubmit = (event) => {
         event.preventDefault();
+        if (isPending)
+            return;
         setIsPending(true);
         setErrorMessage(undefined);
         const formData = new FormData(event.currentTarget);
@@ -100,6 +119,7 @@ export function LoginForm({ login, callback, needCode = false, lengthCode = 6, s
         setQr(undefined);
         setOtpCode('');
         setShowLogin(true);
+        onBack?.();
     };
     const handleSetupMfa = (firstCode, secondCode) => {
         return setupMfa?.(firstCode, secondCode);
@@ -118,25 +138,27 @@ export function LoginForm({ login, callback, needCode = false, lengthCode = 6, s
                 {description}
               </Paragraph>)}
           </div>
-          <form onSubmit={handlerSubmit} aria-busy={isPending} className="flex w-72 flex-col items-center gap-4">
-            {!!showLogin && (<>
+          <form onSubmit={handlerSubmit} onKeyDown={submitOnEnter} aria-busy={isPending} className="flex w-72 flex-col items-center gap-4">
+            {!!showCredentials && (<>
                 <Input label={copy.username} input={{
                     type: 'email',
                     name: 'username',
                     required: true,
                     autoComplete: 'email',
-                    disabled: isPending,
+                    ...credentialState,
                 }}/>
                 <Input label={copy.password} showPasswordAriaLabel={showPasswordAriaLabel} hidePasswordAriaLabel={hidePasswordAriaLabel} input={{
                     type: 'password',
                     name: 'password',
                     required: true,
                     autoComplete: 'current-password',
-                    disabled: isPending,
+                    ...credentialState,
                 }}/>
               </>)}
-            {!showLogin && (<OtpInput label={copy.code} length={lengthCode} handleSubmit={(otp) => setOtpCode(otp)} getDigitAriaLabel={getOtpDigitAriaLabel}/>)}
+            {!showLogin && (<div ref={codeRef} className="w-full">
+                <OtpInput label={copy.code} length={lengthCode} handleSubmit={(otp) => setOtpCode(otp)} getDigitAriaLabel={getOtpDigitAriaLabel}/>
+              </div>)}
             {errorStyle === 'message' && !!errorMessage && (<InlineMessage modifier="error" className="w-full">
                 {errorMessage}

package/dist/components/04-templates/LoginTemplate/LoginForm.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LoginForm.jsx","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginForm.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,~~EAA+B~~,SAAS,~~EAAE~~,QAAQ,~~EAAE~~,MAAM,OAAO,CAAC;~~AACzE~~,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EACL,MAAM,EACN,OAAO,EACP,KAAK,EACL,QAAQ,EACR,SAAS,EACT,SAAS,EACT,OAAO,GACR,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAoC,MAAM,YAAY,CAAC;~~AA4CxE~~,MAAM,cAAc,GAA8B;IAChD,QAAQ,EAAE,SAAS;IACnB,QAAQ,EAAE,YAAY;IACtB,IAAI,EAAE,wBAAwB;IAC9B,MAAM,EAAE,gBAAgB;IACxB,IAAI,EAAE,QAAQ;CACf,CAAC;AAEF~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG~~;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,UAAU,GAAG,CAAC,EACd,QAAQ,EACR,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,YAAY,EACZ,2BAA2B,EAC3B,KAAK,GAAG,aAAa,EACrB,WAAW,EACX,MAAM,EACN,cAAc,EACd,MAAM,EACN,YAAY,EACZ,UAAU,GAAG,MAAM,EACnB,WAAW,GAAG,IAAI,EAClB,WAAW,GAAG,IAAI,~~GACH~~;IACf,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,EAAU,CAAC;IAC3D,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IACnD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC3D,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,GAAG,QAAQ,EAAsB,CAAC;IACnD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAU,CAAC,QAAQ,CAAC,CAAC;IAC/D,MAAM,IAAI,GAAG,EAAE,GAAG,cAAc,EAAE,GAAG,MAAM,EAAE,CAAC;~~IAE9C~~,SAAS,CAAC,GAAG,EAAE;QACb,YAAY,CAAC,CAAC,QAAQ,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,aAAa,GAAsC,CAAC,KAAK,EAAE,EAAE;QACjE,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,eAAe,CAAC,SAAS,CAAC,CAAC;QAE3B,MAAM,QAAQ,GAAG,IAAI,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;QAEnD,IAAI,QAAQ,IAAI,OAAO,EAAE,CAAC;YACxB,QAAQ,CAAC,MAAM,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QACtC,CAAC;QAED,KAAK,CAAC,QAAQ,CAAC;aACZ,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE;YAChB,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC1C,CAAC,CAAC;aACD,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;YACf,MAAM,OAAO,GAAG,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACvE,eAAe,CAAC,OAAO,CAAC,CAAC;YACzB,IAAI,WAAW;gBAAE,SAAS,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;QAC/C,CAAC,CAAC;aACD,OAAO,CAAC,GAAG,EAAE;YACZ,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,CAAC,CAAC;IACP,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,KAAK,CAAC,SAAS,CAAC,CAAC;QACjB,UAAU,CAAC,EAAE,CAAC,CAAC;QACf,YAAY,CAAC,IAAI,CAAC,CAAC;~~IACrB~~,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,SAAiB,EAAE,UAAkB,EAAE,EAAE;QAC/D,OAAO,QAAQ,EAAE,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;IAC3C,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,YAAY,EAAE,CAAC;QAC5B,OAAO,EAAE,SAAS;QAClB,KAAK,EAAE,IAAI,CAAC,MAAM;KACnB,CAAC,IAAI,CACJ,CAAC,MAAM,CACL,IAAI,CAAC,QAAQ,CACb,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,AAAD,EAAG,CAAC,CACxB,aAAa,CAAC,CAAC,SAAS,CAAC,CACzB,QAAQ,CAAC,CAAC,SAAS,CAAC,CACpB,SAAS,CAAC,QAAQ,CAElB;MAAA,CAAC,IAAI,CAAC,MAAM,CACd;IAAA,EAAE,MAAM,CAAC,CACV,CAAC;IAEF,OAAO,CACL,EACE;MAAA,CAAC,CAAC,EAAE,IAAI,CACN,EACE;UAAA,CAAC,GAAG,CAAC,SAAS,CAAC,8CAA8C,CAC3D;YAAA,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,CACpC;YAAA,CAAC,CAAC,CAAC,WAAW,IAAI,CAChB,CAAC,SAAS,CAAC,SAAS,CAAC,0CAA0C,CAC7D;gBAAA,CAAC,WAAW,CACd;cAAA,EAAE,SAAS,CAAC,CACb,CACH;UAAA,EAAE,GAAG,CACL;UAAA,CAAC,IAAI,CACH,QAAQ,CAAC,CAAC,aAAa,CAAC,CACxB,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,SAAS,CAAC,uCAAuC,CAEjD;YAAA,CAAC,CAAC,CAAC,~~SAAS~~,IAAI,~~CACd~~,EACE;gBAAA,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACrB,KAAK,CAAC,CAAC;oBACL,IAAI,EAAE,OAAO;oBACb,IAAI,EAAE,UAAU;oBAChB,QAAQ,EAAE,IAAI;oBACd,YAAY,EAAE,OAAO;oBACrB,~~QAAQ~~,~~EAAE,SAAS~~;~~iBACpB~~,CAAC,EAEJ;gBAAA,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACrB,qBAAqB,CAAC,CAAC,qBAAqB,CAAC,CAC7C,qBAAqB,CAAC,CAAC,qBAAqB,CAAC,CAC7C,KAAK,CAAC,CAAC;oBACL,IAAI,EAAE,UAAU;oBAChB,IAAI,EAAE,UAAU;oBAChB,QAAQ,EAAE,IAAI;oBACd,YAAY,EAAE,kBAAkB;oBAChC,~~QAAQ~~,~~EAAE,SAAS~~;~~iBACpB~~,CAAC,EAEN;cAAA,GAAG,CACJ,CAED;;YAAA,CAAC,CAAC,SAAS,IAAI,CACb,CAAC,QAAQ,CACP,KAAK,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CACjB,MAAM,CAAC,CAAC,UAAU,CAAC,CACnB,YAAY,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CACvC,iBAAiB,CAAC,CAAC,oBAAoB,CAAC,~~EACxC~~,~~CACH~~,CAED;;YAAA,CAAC,UAAU,KAAK,SAAS,IAAI,CAAC,CAAC,YAAY,IAAI,CAC7C,CAAC,aAAa,CAAC,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CAChD;gBAAA,CAAC,YAAY,CACf;cAAA,EAAE,aAAa,CAAC,CACjB,CACD;YAAA,CAAC,CAAC,CAAC,SAAS,IAAI,cAAc,CAE9B;;YAAA,CAAC,MAAM,CACP;YAAA,CAAC,CAAC,SAAS,IAAI,CACb,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,CACvD;gBAAA,CAAC,IAAI,CAAC,IAAI,CACZ;cAAA,EAAE,MAAM,CAAC,CACV,CACD;YAAA,CAAC,UAAU,KAAK,MAAM,IAAI,CAAC,CAAC,YAAY,IAAI,CAC1C,CAAC,SAAS,CACR,IAAI,CAAC,OAAO,CACZ,SAAS,CAAC,0CAA0C,CACpD,IAAI,CAAC,OAAO,CAEZ;gBAAA,CAAC,YAAY,CACf;cAAA,EAAE,SAAS,CAAC,CACb,CACD;YAAA,CAAC,CAAC,CAAC,WAAW,IAAI,CAChB,CAAC,GAAG,CACF,SAAS,CAAC,CAAC,IAAI,CACb,aAAa,EACb,CAAC,SAAS,IAAI,qBAAqB,CACpC,CAAC,CAEF;gBAAA,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,EAC/B;cAAA,EAAE,GAAG,CAAC,CACP,CACH;UAAA,EAAE,IAAI,CACN;UAAA,CAAC,MAAM,CACT;QAAA,GAAG,CACJ,CACD;MAAA,CAAC,CAAC,CAAC,EAAE,IAAI,CACP,CAAC,QAAQ,CACP,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,EAAE,CAAC,CACZ,QAAQ,CAAC,CAAC,cAAc,CAAC,CACzB,mBAAmB,CAAC,CAAC,2BAA2B,CAAC,EACjD,CACH,CACH;IAAA,GAAG,CACJ,CAAC;AACJ,CAAC"}
1	+ {"version":3,"file":"LoginForm.jsx","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/LoginForm.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAGL,SAAS,EACT,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EACL,MAAM,EACN,OAAO,EACP,KAAK,EACL,QAAQ,EACR,SAAS,EACT,SAAS,EACT,OAAO,GACR,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAoC,MAAM,YAAY,CAAC;AACxE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAgDhD,MAAM,cAAc,GAClB,+GAA+G,CAAC;AAElH,MAAM,cAAc,GAA8B;IAChD,QAAQ,EAAE,SAAS;IACnB,QAAQ,EAAE,YAAY;IACtB,IAAI,EAAE,wBAAwB;IAC9B,MAAM,EAAE,gBAAgB;IACxB,IAAI,EAAE,QAAQ;CACf,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,MAAM,UAAU,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,UAAU,GAAG,CAAC,EACd,QAAQ,EACR,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,YAAY,EACZ,2BAA2B,EAC3B,KAAK,GAAG,aAAa,EACrB,WAAW,EACX,MAAM,EACN,cAAc,EACd,MAAM,EACN,YAAY,EACZ,UAAU,GAAG,MAAM,EACnB,WAAW,GAAG,IAAI,EAClB,WAAW,GAAG,IAAI,EAClB,UAAU,GAAG,SAAS,EACtB,MAAM,GACS;IACf,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,EAAU,CAAC;IAC3D,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IACnD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC3D,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,GAAG,QAAQ,EAAsB,CAAC;IACnD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAU,CAAC,QAAQ,CAAC,CAAC;IAC/D,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC7C,MAAM,IAAI,GAAG,EAAE,GAAG,cAAc,EAAE,GAAG,MAAM,EAAE,CAAC;IAC9C,MAAM,eAAe,GAAG,SAAS,IAAI,UAAU,KAAK,OAAO,CAAC;IAC5D,mGAAmG;IACnG,MAAM,iBAAiB,GAAG,CAAC,SAAS,IAAI,CAAC,SAAS,IAAI,UAAU,KAAK,OAAO,CAAC,CAAC;IAC9E,MAAM,eAAe,GAAG;QACtB,QAAQ,EAAE,SAAS,IAAI,UAAU,KAAK,OAAO;QAC7C,QAAQ,EAAE,iBAAiB;QAC3B,SAAS,EAAE,iBAAiB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS;KAC1D,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,YAAY,CAAC,CAAC,QAAQ,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,IAAI,CAAC,EAAE;YAAE,OAAO,CAAC,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,CAAC;IAC1E,CAAC,EAAE,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC;IAEpB,MAAM,aAAa,GAAsC,CAAC,KAAK,EAAE,EAAE;QACjE,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,SAAS;YAAE,OAAO;QACtB,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,eAAe,CAAC,SAAS,CAAC,CAAC;QAE3B,MAAM,QAAQ,GAAG,IAAI,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;QAEnD,IAAI,QAAQ,IAAI,OAAO,EAAE,CAAC;YACxB,QAAQ,CAAC,MAAM,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QACtC,CAAC;QAED,KAAK,CAAC,QAAQ,CAAC;aACZ,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE;YAChB,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC;QAC1C,CAAC,CAAC;aACD,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;YACf,MAAM,OAAO,GAAG,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACvE,eAAe,CAAC,OAAO,CAAC,CAAC;YACzB,IAAI,WAAW;gBAAE,SAAS,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;QAC/C,CAAC,CAAC;aACD,OAAO,CAAC,GAAG,EAAE;YACZ,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,CAAC,CAAC;IACP,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,KAAK,CAAC,SAAS,CAAC,CAAC;QACjB,UAAU,CAAC,EAAE,CAAC,CAAC;QACf,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,MAAM,EAAE,EAAE,CAAC;IACb,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,SAAiB,EAAE,UAAkB,EAAE,EAAE;QAC/D,OAAO,QAAQ,EAAE,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;IAC3C,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,YAAY,EAAE,CAAC;QAC5B,OAAO,EAAE,SAAS;QAClB,KAAK,EAAE,IAAI,CAAC,MAAM;KACnB,CAAC,IAAI,CACJ,CAAC,MAAM,CACL,IAAI,CAAC,QAAQ,CACb,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,AAAD,EAAG,CAAC,CACxB,aAAa,CAAC,CAAC,SAAS,CAAC,CACzB,QAAQ,CAAC,CAAC,SAAS,CAAC,CACpB,SAAS,CAAC,QAAQ,CAElB;MAAA,CAAC,IAAI,CAAC,MAAM,CACd;IAAA,EAAE,MAAM,CAAC,CACV,CAAC;IAEF,OAAO,CACL,EACE;MAAA,CAAC,CAAC,EAAE,IAAI,CACN,EACE;UAAA,CAAC,GAAG,CAAC,SAAS,CAAC,8CAA8C,CAC3D;YAAA,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,CACpC;YAAA,CAAC,CAAC,CAAC,WAAW,IAAI,CAChB,CAAC,SAAS,CAAC,SAAS,CAAC,0CAA0C,CAC7D;gBAAA,CAAC,WAAW,CACd;cAAA,EAAE,SAAS,CAAC,CACb,CACH;UAAA,EAAE,GAAG,CACL;UAAA,CAAC,IAAI,CACH,QAAQ,CAAC,CAAC,aAAa,CAAC,CACxB,SAAS,CAAC,CAAC,aAAa,CAAC,CACzB,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,SAAS,CAAC,uCAAuC,CAEjD;YAAA,CAAC,CAAC,CAAC,eAAe,IAAI,CACpB,EACE;gBAAA,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACrB,KAAK,CAAC,CAAC;oBACL,IAAI,EAAE,OAAO;oBACb,IAAI,EAAE,UAAU;oBAChB,QAAQ,EAAE,IAAI;oBACd,YAAY,EAAE,OAAO;oBACrB,GAAG,eAAe;iBACnB,CAAC,EAEJ;gBAAA,CAAC,KAAK,CACJ,KAAK,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACrB,qBAAqB,CAAC,CAAC,qBAAqB,CAAC,CAC7C,qBAAqB,CAAC,CAAC,qBAAqB,CAAC,CAC7C,KAAK,CAAC,CAAC;oBACL,IAAI,EAAE,UAAU;oBAChB,IAAI,EAAE,UAAU;oBAChB,QAAQ,EAAE,IAAI;oBACd,YAAY,EAAE,kBAAkB;oBAChC,GAAG,eAAe;iBACnB,CAAC,EAEN;cAAA,GAAG,CACJ,CAED;;YAAA,CAAC,CAAC,SAAS,IAAI,CACb,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,SAAS,CAAC,QAAQ,CACnC;gBAAA,CAAC,QAAQ,CACP,KAAK,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CACjB,MAAM,CAAC,CAAC,UAAU,CAAC,CACnB,YAAY,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CACvC,iBAAiB,CAAC,CAAC,oBAAoB,CAAC,EAE5C;cAAA,EAAE,GAAG,CAAC,CACP,CAED;;YAAA,CAAC,UAAU,KAAK,SAAS,IAAI,CAAC,CAAC,YAAY,IAAI,CAC7C,CAAC,aAAa,CAAC,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,QAAQ,CAChD;gBAAA,CAAC,YAAY,CACf;cAAA,EAAE,aAAa,CAAC,CACjB,CACD;YAAA,CAAC,CAAC,CAAC,SAAS,IAAI,cAAc,CAE9B;;YAAA,CAAC,MAAM,CACP;YAAA,CAAC,CAAC,SAAS,IAAI,CACb,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,CACvD;gBAAA,CAAC,IAAI,CAAC,IAAI,CACZ;cAAA,EAAE,MAAM,CAAC,CACV,CACD;YAAA,CAAC,UAAU,KAAK,MAAM,IAAI,CAAC,CAAC,YAAY,IAAI,CAC1C,CAAC,SAAS,CACR,IAAI,CAAC,OAAO,CACZ,SAAS,CAAC,0CAA0C,CACpD,IAAI,CAAC,OAAO,CAEZ;gBAAA,CAAC,YAAY,CACf;cAAA,EAAE,SAAS,CAAC,CACb,CACD;YAAA,CAAC,CAAC,CAAC,WAAW,IAAI,CAChB,CAAC,GAAG,CACF,SAAS,CAAC,CAAC,IAAI,CACb,aAAa,EACb,CAAC,SAAS,IAAI,qBAAqB,CACpC,CAAC,CAEF;gBAAA,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,EAC/B;cAAA,EAAE,GAAG,CAAC,CACP,CACH;UAAA,EAAE,IAAI,CACN;UAAA,CAAC,MAAM,CACT;QAAA,GAAG,CACJ,CACD;MAAA,CAAC,CAAC,CAAC,EAAE,IAAI,CACP,CAAC,QAAQ,CACP,UAAU,CAAC,CAAC,UAAU,CAAC,CACvB,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,OAAO,CAAC,CAAC,EAAE,CAAC,CACZ,QAAQ,CAAC,CAAC,cAAc,CAAC,CACzB,mBAAmB,CAAC,CAAC,2BAA2B,CAAC,EACjD,CACH,CACH;IAAA,GAAG,CACJ,CAAC;AACJ,CAAC"}

package/dist/components/04-templates/LoginTemplate/SetupMfa/StepThree.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepThree.d.ts","sourceRoot":"","sources":["../../../../../src/components/04-templates/LoginTemplate/SetupMfa/StepThree.tsx"],"names":[],"mappings":"~~AAUA~~,KAAK,cAAc,GAAG;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,EAAE,CACN,SAAS,EAAE,MAAM,EACjB,UAAU,EAAE,MAAM,KACf,OAAO,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IACpC,UAAU,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC9C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,wBAAgB,SAAS,CAAC,EACxB,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,UAAc,EACd,iBAAiB,EACjB,YAAY,GACb,EAAE,cAAc,+~~BAyFhB~~"}
1	+ {"version":3,"file":"StepThree.d.ts","sourceRoot":"","sources":["../../../../../src/components/04-templates/LoginTemplate/SetupMfa/StepThree.tsx"],"names":[],"mappings":"AAWA,KAAK,cAAc,GAAG;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,EAAE,CACN,SAAS,EAAE,MAAM,EACjB,UAAU,EAAE,MAAM,KACf,OAAO,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IACpC,UAAU,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC9C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,wBAAgB,SAAS,CAAC,EACxB,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,UAAc,EACd,iBAAiB,EACjB,YAAY,GACb,EAAE,cAAc,+BAgGhB"}

package/dist/components/04-templates/LoginTemplate/SetupMfa/StepThree.jsx CHANGED Viewed

@@ -1,11 +1,15 @@
 import { Button, Heading, OtpInput, Paragraph, Spinner, } from '../../../01-atoms';
 import { useState } from 'react';
 import clsx from 'clsx';
+import { submitOnEnter } from '../submitOnEnter';
 export function StepThree({ previousCode, previousStep, nextStep, onCancel, submit, lengthCode = 4, getDigitAriaLabel, loadingLabel, }) {
     const [secondCode, setSecondCode] = useState('');
     const [errorMessage, setErrorMessage] = useState('');
     const [isPending, setIsPending] = useState(false);
-    const handleSubmit = async () => {
+    const handleSubmit = (event) => {
+        event.preventDefault();
+        if (secondCode.length < lengthCode || isPending)
+            return;
         setIsPending(true);
         submit?.(previousCode, secondCode)
             ?.then(() => {
@@ -18,7 +22,7 @@ export function StepThree({ previousCode, previousStep, nextStep, onCancel, subm
             setIsPending(false);
         });
     };
-    return (<div className="col-1 flex w-72 flex-col items-center text-black dark:text-white">
+    return (<form noValidate onSubmit={handleSubmit} onKeyDown={submitOnEnter} aria-busy={isPending} className="col-1 flex w-72 flex-col items-center text-black dark:text-white">
       <Heading className="mb-4" level="h7">
         Configurar autenticación
       </Heading>
@@ -36,7 +40,7 @@ export function StepThree({ previousCode, previousStep, nextStep, onCancel, subm
       <OtpInput label="Codigo de Verificación 2" length={lengthCode} handleSubmit={setSecondCode} error={errorMessage} className="dark:[&_.text-error]:text-error-1" getDigitAriaLabel={getDigitAriaLabel}/>
-      <Button disabled={secondCode?.length < lengthCode || isPending} modifier="principal" className="my-2 w-full" type="button" onClick={handleSubmit} aria-disabled={isPending}>
+      <Button disabled={secondCode?.length < lengthCode || isPending} modifier="principal" className="my-2 w-full" type="submit" aria-disabled={isPending}>
         Verificar y Completar
       </Button>
@@ -53,6 +57,6 @@ export function StepThree({ previousCode, previousStep, nextStep, onCancel, subm
       <div className={clsx('mt-4 self-center', !isPending && 'invisible opacity-0')}>
         <Spinner label={loadingLabel}/>
       </div>
-    </div>);
+    </form>);
 }
 //# sourceMappingURL=StepThree.jsx.map

package/dist/components/04-templates/LoginTemplate/SetupMfa/StepThree.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepThree.jsx","sourceRoot":"","sources":["../../../../../src/components/04-templates/LoginTemplate/SetupMfa/StepThree.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,EACN,OAAO,EACP,QAAQ,EACR,SAAS,EACT,OAAO,GACR,MAAM,mBAAmB,CAAC;AAC3B,OAAO,~~EAAE~~,QAAQ,EAAE,MAAM,OAAO,CAAC;~~AACjC~~,OAAO,IAAI,MAAM,MAAM,CAAC;~~AAgBxB~~,MAAM,UAAU,SAAS,CAAC,EACxB,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,UAAU,GAAG,CAAC,EACd,iBAAiB,EACjB,YAAY,GACG;IACf,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IACzD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IAC7D,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAE3D,MAAM,YAAY,GAAG,KAAK,~~IAAI~~,EAAE;~~QAC9B~~,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,MAAM,EAAE,CAAC,YAAY,EAAE,UAAU,CAAC;YAChC,EAAE,IAAI,CAAC,GAAG,EAAE;YACV,QAAQ,EAAE,CAAC;QACb,CAAC,CAAC;YACF,EAAE,KAAK,CAAC,CAAC,KAAK,EAAE,EAAE;YAChB,eAAe,CAAC,KAAe,CAAC,CAAC;QACnC,CAAC,CAAC;YACF,EAAE,OAAO,CAAC,GAAG,EAAE;YACb,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,CAAC,CAAC;IACP,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,~~GAAG~~,CAAC,SAAS,CAAC,kEAAkE,~~CAC/E~~;MAAA,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAClC;;MACF,EAAE,OAAO,CAET;;MAAA,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CACvC;;MACF,EAAE,SAAS,CAEX;;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,iHAAiH,CAC9H;QAAA,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,eAAe,EAAE,SAAS,CACnD;QAAA,CAAC,SAAS,CACR,IAAI,CAAC,YAAY,CACjB,SAAS,CAAC,+DAA+D,CAEzE;UAAA,CAAC,YAAY,CACf;QAAA,EAAE,SAAS,CACb;MAAA,EAAE,GAAG,CAEL;;MAAA,CAAC,QAAQ,CACP,KAAK,CAAC,0BAA0B,CAChC,MAAM,CAAC,CAAC,UAAU,CAAC,CACnB,YAAY,CAAC,CAAC,aAAa,CAAC,CAC5B,KAAK,CAAC,CAAC,YAAY,CAAC,CACpB,SAAS,CAAC,mCAAmC,CAC7C,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,EAGvC;;MAAA,CAAC,MAAM,CACL,QAAQ,CAAC,CAAC,UAAU,EAAE,MAAM,GAAG,UAAU,IAAI,SAAS,CAAC,CACvD,QAAQ,CAAC,WAAW,CACpB,SAAS,CAAC,aAAa,CACvB,IAAI,CAAC,QAAQ,CACb,~~OAAO,CAAC,CAAC,YAAY,CAAC,CACtB,~~aAAa,CAAC,CAAC,SAAS,CAAC,CAEzB;;MACF,EAAE,MAAM,CAER;;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,yBAAyB,CACtC;QAAA,CAAC,MAAM,CACL,QAAQ,CAAC,QAAQ,CACjB,SAAS,CAAC,UAAU,CACpB,IAAI,CAAC,QAAQ,CACb,OAAO,CAAC,CAAC,QAAQ,CAAC,CAElB;;QACF,EAAE,MAAM,CAER;;QAAA,CAAC,MAAM,CACL,QAAQ,CAAC,QAAQ,CACjB,SAAS,CAAC,UAAU,CACpB,IAAI,CAAC,QAAQ,CACb,OAAO,CAAC,CAAC,YAAY,CAAC,CAEtB;;QACF,EAAE,MAAM,CACV;MAAA,EAAE,GAAG,CAEL;;MAAA,CAAC,GAAG,CACF,SAAS,CAAC,CAAC,IAAI,CACb,kBAAkB,EAClB,CAAC,SAAS,IAAI,qBAAqB,CACpC,CAAC,CAEF;QAAA,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,EAC/B;MAAA,EAAE,GAAG,CACP;IAAA,EAAE,~~GAAG~~,CAAC,~~CACP~~,CAAC;AACJ,CAAC"}
1	+ {"version":3,"file":"StepThree.jsx","sourceRoot":"","sources":["../../../../../src/components/04-templates/LoginTemplate/SetupMfa/StepThree.tsx"],"names":[],"mappings":"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"}

package/dist/components/04-templates/LoginTemplate/SetupMfa/StepTwo.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepTwo.d.ts","sourceRoot":"","sources":["../../../../../src/components/04-templates/LoginTemplate/SetupMfa/StepTwo.tsx"],"names":[],"mappings":"~~AAGA~~,KAAK,YAAY,GAAG;IAClB,QAAQ,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CAC/C,CAAC;AAEF,wBAAgB,OAAO,CAAC,EACtB,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,iBAAiB,GAClB,EAAE,YAAY,+~~BAkDd~~"}
1	+ {"version":3,"file":"StepTwo.d.ts","sourceRoot":"","sources":["../../../../../src/components/04-templates/LoginTemplate/SetupMfa/StepTwo.tsx"],"names":[],"mappings":"AAIA,KAAK,YAAY,GAAG;IAClB,QAAQ,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CAC/C,CAAC;AAEF,wBAAgB,OAAO,CAAC,EACtB,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,iBAAiB,GAClB,EAAE,YAAY,+BA6Dd"}

package/dist/components/04-templates/LoginTemplate/SetupMfa/StepTwo.jsx CHANGED Viewed

@@ -1,8 +1,15 @@
 import { useState } from 'react';
 import { Button, Heading, OtpInput, Paragraph } from '../../../01-atoms';
+import { submitOnEnter } from '../submitOnEnter';
 export function StepTwo({ nextStep, previousStep, onCancel, getDigitAriaLabel, }) {
     const [code, setCode] = useState('');
-    return (<div className="flex w-72 flex-col items-center text-black dark:text-white">
+    const handleSubmit = (event) => {
+        event.preventDefault();
+        if (code.length < 6)
+            return;
+        nextStep(code);
+    };
+    return (<form noValidate onSubmit={handleSubmit} onKeyDown={submitOnEnter} className="flex w-72 flex-col items-center text-black dark:text-white">
       <Heading className="mb-4" level="h7">
         Configurar autenticación
       </Heading>
@@ -13,7 +20,7 @@ export function StepTwo({ nextStep, previousStep, onCancel, getDigitAriaLabel, }
       <OtpInput label="Codigo de Verificación 1" length={6} handleSubmit={(otp) => setCode(otp)} getDigitAriaLabel={getDigitAriaLabel}/>
-      <Button modifier="principal" className="my-2 w-full" type="button" onClick={() => nextStep(code)} disabled={code.length < 6}>
+      <Button modifier="principal" className="my-2 w-full" type="submit" disabled={code.length < 6}>
         Continuar
       </Button>
@@ -26,6 +33,6 @@ export function StepTwo({ nextStep, previousStep, onCancel, getDigitAriaLabel, }
           Atrás
         </Button>
       </div>
-    </div>);
+    </form>);
 }
 //# sourceMappingURL=StepTwo.jsx.map

package/dist/components/04-templates/LoginTemplate/SetupMfa/StepTwo.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepTwo.jsx","sourceRoot":"","sources":["../../../../../src/components/04-templates/LoginTemplate/SetupMfa/StepTwo.tsx"],"names":[],"mappings":"AAAA,OAAO,~~EAAE~~,QAAQ,EAAE,MAAM,OAAO,CAAC;~~AACjC~~,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;~~AASzE~~,MAAM,UAAU,OAAO,CAAC,EACtB,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,iBAAiB,GACJ;IACb,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;~~IAC7C~~,OAAO,CACL,CAAC,~~GAAG~~,CAAC,SAAS,CAAC,4DAA4D,~~CACzE~~;MAAA,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAClC;;MACF,EAAE,OAAO,CAET;;MAAA,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CACvC;;MACF,EAAE,SAAS,CAEX;;MAAA,CAAC,QAAQ,CACP,KAAK,CAAC,0BAA0B,CAChC,MAAM,CAAC,CAAC,CAAC,CAAC,CACV,YAAY,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CACpC,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,EAGvC;;MAAA,CAAC,MAAM,CACL,QAAQ,CAAC,WAAW,CACpB,SAAS,CAAC,aAAa,CACvB,IAAI,CAAC,QAAQ,CACb,~~OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,~~QAAQ,CAAC,~~IAAI,~~CAAC,~~CAAC,CAC9B,QAAQ,CAAC,CAAC,~~IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAE1B;;MACF,EAAE,MAAM,CAER;;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,yBAAyB,CACtC;QAAA,CAAC,MAAM,CACL,QAAQ,CAAC,QAAQ,CACjB,SAAS,CAAC,UAAU,CACpB,IAAI,CAAC,QAAQ,CACb,OAAO,CAAC,CAAC,QAAQ,CAAC,CAElB;;QACF,EAAE,MAAM,CAER;;QAAA,CAAC,MAAM,CACL,QAAQ,CAAC,QAAQ,CACjB,SAAS,CAAC,UAAU,CACpB,IAAI,CAAC,QAAQ,CACb,OAAO,CAAC,CAAC,YAAY,CAAC,CAEtB;;QACF,EAAE,MAAM,CACV;MAAA,EAAE,GAAG,CACP;IAAA,EAAE,~~GAAG~~,CAAC,~~CACP~~,CAAC;AACJ,CAAC"}
1	+ {"version":3,"file":"StepTwo.jsx","sourceRoot":"","sources":["../../../../../src/components/04-templates/LoginTemplate/SetupMfa/StepTwo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzE,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AASjD,MAAM,UAAU,OAAO,CAAC,EACtB,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,iBAAiB,GACJ;IACb,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IAE7C,MAAM,YAAY,GAAG,CAAC,KAAiC,EAAE,EAAE;QACzD,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC;YAAE,OAAO;QAC5B,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjB,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,IAAI,CACH,UAAU,CACV,QAAQ,CAAC,CAAC,YAAY,CAAC,CACvB,SAAS,CAAC,CAAC,aAAa,CAAC,CACzB,SAAS,CAAC,4DAA4D,CAEtE;MAAA,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAClC;;MACF,EAAE,OAAO,CAET;;MAAA,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CACvC;;MACF,EAAE,SAAS,CAEX;;MAAA,CAAC,QAAQ,CACP,KAAK,CAAC,0BAA0B,CAChC,MAAM,CAAC,CAAC,CAAC,CAAC,CACV,YAAY,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,CACpC,iBAAiB,CAAC,CAAC,iBAAiB,CAAC,EAGvC;;MAAA,CAAC,MAAM,CACL,QAAQ,CAAC,WAAW,CACpB,SAAS,CAAC,aAAa,CACvB,IAAI,CAAC,QAAQ,CACb,QAAQ,CAAC,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAE1B;;MACF,EAAE,MAAM,CAER;;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,yBAAyB,CACtC;QAAA,CAAC,MAAM,CACL,QAAQ,CAAC,QAAQ,CACjB,SAAS,CAAC,UAAU,CACpB,IAAI,CAAC,QAAQ,CACb,OAAO,CAAC,CAAC,QAAQ,CAAC,CAElB;;QACF,EAAE,MAAM,CAER;;QAAA,CAAC,MAAM,CACL,QAAQ,CAAC,QAAQ,CACjB,SAAS,CAAC,UAAU,CACpB,IAAI,CAAC,QAAQ,CACb,OAAO,CAAC,CAAC,YAAY,CAAC,CAEtB;;QACF,EAAE,MAAM,CACV;MAAA,EAAE,GAAG,CACP;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC"}

package/dist/components/04-templates/LoginTemplate/index.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
 export { LoginTemplate } from './LoginTemplate';
 export { LoginForm } from './LoginForm';
-export type { LoginFormErrorStyle, LoginFormLabels, LoginFormSubmitState, } from './LoginForm';
+export type { LoginFormCodeLayout, LoginFormErrorStyle, LoginFormLabels, LoginFormSubmitState, } from './LoginForm';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/04-templates/LoginTemplate/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EACV,mBAAmB,EACnB,eAAe,EACf,oBAAoB,GACrB,MAAM,aAAa,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EACV,mBAAmB,EACnB,mBAAmB,EACnB,eAAe,EACf,oBAAoB,GACrB,MAAM,aAAa,CAAC"}

package/dist/components/04-templates/LoginTemplate/submitOnEnter.d.ts ADDED Viewed

@@ -0,0 +1,9 @@
+import type { KeyboardEvent } from 'react';
+/**
+ * Submits the form on Enter in one of its fields. The browser does not submit when something
+ * else, such as an extension, cancels the key first.
+ *
+ * @param {KeyboardEvent<HTMLFormElement>} event - The `keydown` of the form.
+ */
+export declare function submitOnEnter(event: KeyboardEvent<HTMLFormElement>): void;
+//# sourceMappingURL=submitOnEnter.d.ts.map

package/dist/components/04-templates/LoginTemplate/submitOnEnter.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"submitOnEnter.d.ts","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/submitOnEnter.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,aAAa,CAAC,eAAe,CAAC,GAAG,IAAI,CAKzE"}

package/dist/components/04-templates/LoginTemplate/submitOnEnter.js ADDED Viewed

@@ -0,0 +1,15 @@
+/**
+ * Submits the form on Enter in one of its fields. The browser does not submit when something
+ * else, such as an extension, cancels the key first.
+ *
+ * @param {KeyboardEvent<HTMLFormElement>} event - The `keydown` of the form.
+ */
+export function submitOnEnter(event) {
+    if (event.key !== 'Enter' || event.nativeEvent.isComposing)
+        return;
+    if (!(event.target instanceof HTMLInputElement))
+        return;
+    event.preventDefault();
+    event.currentTarget.requestSubmit();
+}
+//# sourceMappingURL=submitOnEnter.js.map

package/dist/components/04-templates/LoginTemplate/submitOnEnter.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"submitOnEnter.js","sourceRoot":"","sources":["../../../../src/components/04-templates/LoginTemplate/submitOnEnter.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH,MAAM,UAAU,aAAa,CAAC,KAAqC;IACjE,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,WAAW,CAAC,WAAW;QAAE,OAAO;IACnE,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,YAAY,gBAAgB,CAAC;QAAE,OAAO;IACxD,KAAK,CAAC,cAAc,EAAE,CAAC;IACvB,KAAK,CAAC,aAAa,CAAC,aAAa,EAAE,CAAC;AACtC,CAAC"}