@axzydev/axzy_ui_system 1.3.6 → 1.4.0
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.
- package/dist/index.cjs +8 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.js +8 -1
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/molecules/date-picker/datePicker.tsx +1 -0
- package/src/components/molecules/dropdown-menu/dropdown-menu.tsx +1 -0
- package/src/components/molecules/multi-select/multi-select.tsx +1 -0
- package/src/components/molecules/search-select/search-select.tsx +1 -0
- package/src/components/molecules/time-picker/timePicker.tsx +1 -0
- package/src/components/organisms/dialog/dialog.stories.tsx +48 -0
- package/src/hooks/useClickOutside.ts +6 -0
- package/src/hooks/useFloatingPanel.ts +4 -1
- package/src/showcases/FeedbackShowcases.tsx +16 -1
- package/src/showcases/HomeShowcase.tsx +552 -331
- package/src/showcases/ProductoDetalle.tsx +181 -0
- package/src/showcases/ProductoIcono.tsx +25 -0
- package/src/showcases/productos.ts +179 -0
- package/src/showcases/techIcons.ts +67 -0
package/dist/index.cjs
CHANGED
|
@@ -113,6 +113,8 @@ var useClickOutside = (ref, callback) => {
|
|
|
113
113
|
const clickedDialog = target?.closest("[data-it-dialog]");
|
|
114
114
|
const currentDialog = ref.current?.closest("[data-it-dialog]");
|
|
115
115
|
if (clickedDialog && clickedDialog !== currentDialog) return;
|
|
116
|
+
const clickedFloating = target?.closest("[data-it-floating]");
|
|
117
|
+
if (clickedFloating && !ref.current?.contains(clickedFloating)) return;
|
|
116
118
|
if (ref.current && !ref.current.contains(event.target)) {
|
|
117
119
|
callback();
|
|
118
120
|
}
|
|
@@ -308,7 +310,7 @@ function useFloatingPanel(anchorRef, isOpen, {
|
|
|
308
310
|
const spaceAbove = rect.top;
|
|
309
311
|
const flipAbove = spaceBelow < panelHeight + offset && spaceAbove > spaceBelow;
|
|
310
312
|
const width = matchWidth ? rect.width : void 0;
|
|
311
|
-
const panelWidth = panelRef.current?.offsetWidth ??
|
|
313
|
+
const panelWidth = width ?? panelRef.current?.offsetWidth ?? 0;
|
|
312
314
|
let left = align === "end" && panelWidth ? rect.right - panelWidth : rect.left;
|
|
313
315
|
if (panelWidth) {
|
|
314
316
|
left = Math.max(8, Math.min(left, viewportWidth - panelWidth - 8));
|
|
@@ -2537,6 +2539,7 @@ function ITDropdownMenu({
|
|
|
2537
2539
|
"div",
|
|
2538
2540
|
{
|
|
2539
2541
|
ref: panelRef,
|
|
2542
|
+
"data-it-floating": "true",
|
|
2540
2543
|
role: "menu",
|
|
2541
2544
|
"aria-label": triggerLabel,
|
|
2542
2545
|
style: panelStyle,
|
|
@@ -3522,6 +3525,7 @@ function ITMultiSelect({
|
|
|
3522
3525
|
"div",
|
|
3523
3526
|
{
|
|
3524
3527
|
ref: panelRef,
|
|
3528
|
+
"data-it-floating": "true",
|
|
3525
3529
|
role: "listbox",
|
|
3526
3530
|
"aria-multiselectable": "true",
|
|
3527
3531
|
style: panelStyle,
|
|
@@ -4191,6 +4195,7 @@ function ITSearchSelect({
|
|
|
4191
4195
|
"div",
|
|
4192
4196
|
{
|
|
4193
4197
|
ref: panelRef,
|
|
4198
|
+
"data-it-floating": "true",
|
|
4194
4199
|
style: panelStyle,
|
|
4195
4200
|
className: "bg-white dark:bg-slate-900 border border-secondary-200 dark:border-slate-800 rounded-lg shadow-xl overflow-hidden animate-in fade-in zoom-in duration-200 origin-top",
|
|
4196
4201
|
children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "max-h-60 overflow-y-auto", children: filteredOptions.length > 0 ? filteredOptions.map((option) => {
|
|
@@ -4436,6 +4441,7 @@ function ITDatePicker({
|
|
|
4436
4441
|
"div",
|
|
4437
4442
|
{
|
|
4438
4443
|
ref: panelRef,
|
|
4444
|
+
"data-it-floating": "true",
|
|
4439
4445
|
className: (0, import_clsx22.default)(
|
|
4440
4446
|
calendarClassName,
|
|
4441
4447
|
range ? "w-[320px]" : "w-[280px]"
|
|
@@ -5583,6 +5589,7 @@ function ITTimePicker({
|
|
|
5583
5589
|
"div",
|
|
5584
5590
|
{
|
|
5585
5591
|
ref: dropdownRef,
|
|
5592
|
+
"data-it-floating": "true",
|
|
5586
5593
|
className: "bg-white border border-secondary-100 shadow-xl rounded-xl w-64 overflow-hidden flex flex-col animate-in fade-in zoom-in-95 duration-200 origin-top it-timepicker-dropdown",
|
|
5587
5594
|
style: panelStyle,
|
|
5588
5595
|
children: [
|