@arquimedes.co/eureka-forms 3.0.48-test → 3.0.49-new-steps

package/dist/FormSteps/CalendarStep/MaterialCalendarStep/MaterialCalendarStep.module.css

@@ -0,0 +1,531 @@
+/* =========================================================================
+   MaterialCalendarStep
+   ========================================================================= */
+
+.container {
+    display: flex;
+    flex-direction: column;
+    padding: 10px;
+    padding-top: 5px;
+    padding-bottom: 0;
+    box-sizing: border-box;
+}
+
+/* =========================================================================
+   Toolbar
+   ========================================================================= */
+
+.toolbar {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 6px 2px 8px;
+    flex-wrap: wrap;
+}
+
+/* View switcher */
+
+.viewSwitcher {
+    display: flex;
+    border: 1px solid var(--eureka-outline, #ddd);
+    border-radius: 8px;
+    overflow: hidden;
+}
+
+.viewBtn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 5px 10px;
+    border: none;
+    border-right: 1px solid var(--eureka-outline, #ddd);
+    background: transparent;
+    cursor: pointer;
+    color: var(--eureka-text, #555);
+    opacity: 0.55;
+    transition: background 0.15s, opacity 0.15s;
+}
+
+.viewBtn:last-child {
+    border-right: none;
+}
+
+.viewBtn:hover {
+    background: rgba(0, 0, 0, 0.04);
+    opacity: 0.85;
+}
+
+.viewBtnActive {
+    background: var(--eureka-primary, #1976d2) !important;
+    color: #fff !important;
+    opacity: 1 !important;
+}
+
+/* Nav */
+
+.navGroup {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    flex: 1;
+    min-width: 0;
+}
+
+.navBtn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 4px;
+    border: none;
+    border-radius: 6px;
+    background: transparent;
+    cursor: pointer;
+    color: var(--eureka-text, #555);
+    opacity: 0.55;
+    transition: opacity 0.15s, background 0.15s;
+}
+
+.navBtn:hover {
+    background: rgba(0, 0, 0, 0.05);
+    opacity: 1;
+}
+
+.navLabel {
+    font-weight: 600;
+    font-size: 14px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    text-transform: capitalize;
+}
+
+.eventBadge {
+    font-size: 11px;
+    padding: 3px 8px;
+    border-radius: 100px;
+    background: var(--eureka-primary, #1976d2);
+    color: #fff;
+    font-weight: 500;
+    white-space: nowrap;
+}
+
+.hintText {
+    font-size: 11px;
+    opacity: 0.4;
+    white-space: nowrap;
+    margin-left: auto;
+}
+
+/* =========================================================================
+   Calendar card container
+   ========================================================================= */
+
+.calendarCard {
+    border: 1px solid var(--eureka-outline, #e0e0e0);
+    border-radius: 12px;
+    overflow: hidden;
+    background: var(--eureka-bg, #fff);
+}
+
+/* =========================================================================
+   Time grid (week / day)
+   ========================================================================= */
+
+.gridWrapper {
+    display: flex;
+    flex-direction: column;
+}
+
+/* Header */
+
+.gridHeader {
+    display: grid;
+    border-bottom: 2px solid var(--eureka-outline, #e0e0e0);
+    position: sticky;
+    top: 0;
+    z-index: 2;
+    background: var(--eureka-bg, #fff);
+}
+
+.cornerCell {
+    width: 48px;
+    border-right: 1px solid var(--eureka-outline, #e0e0e0);
+}
+
+.dayHeader {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 8px 4px;
+    cursor: pointer;
+    border-right: 1px solid var(--eureka-outline, #e0e0e0);
+    transition: background 0.1s;
+}
+
+.dayHeader:last-child {
+    border-right: none;
+}
+
+.dayHeader:hover {
+    background: rgba(0, 0, 0, 0.03);
+}
+
+.dayHeaderToday {
+    color: var(--eureka-primary, #1976d2);
+}
+
+.dayHeaderDow {
+    font-size: 11px;
+    text-transform: capitalize;
+    opacity: 0.6;
+}
+
+.dayHeaderNum {
+    font-size: 18px;
+    font-weight: 700;
+    line-height: 1.1;
+}
+
+.todayCircle {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 30px;
+    height: 30px;
+    border-radius: 50%;
+    background: var(--eureka-primary, #1976d2);
+    color: #fff !important;
+}
+
+/* Body */
+
+.gridBody {
+    overflow-y: auto;
+    max-height: 520px;
+}
+
+.gridInner {
+    display: grid;
+}
+
+/* Hour labels */
+
+.hourLabels {
+    border-right: 1px solid var(--eureka-outline, #e0e0e0);
+}
+
+.hourLabel {
+    display: flex;
+    align-items: flex-start;
+    justify-content: flex-end;
+    padding-right: 6px;
+    padding-top: 2px;
+    font-size: 10px;
+    opacity: 0.45;
+    box-sizing: border-box;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
+}
+
+/* Day columns */
+
+.dayColumn {
+    position: relative;
+    border-right: 1px solid var(--eureka-outline, #e0e0e0);
+    cursor: crosshair;
+    box-sizing: border-box;
+}
+
+.dayColumn:last-child {
+    border-right: none;
+}
+
+.hourLine {
+    position: absolute;
+    left: 0;
+    right: 0;
+    height: 1px;
+    background: rgba(0, 0, 0, 0.05);
+}
+
+/* =========================================================================
+   Event blocks
+   ========================================================================= */
+
+.eventBlock {
+    position: absolute;
+    left: 2px;
+    right: 2px;
+    border-radius: 4px;
+    padding: 2px 4px;
+    cursor: default;
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+    z-index: 1;
+    opacity: 0.9;
+    transition: opacity 0.1s;
+    box-sizing: border-box;
+}
+
+.eventBlock:hover {
+    opacity: 1;
+    z-index: 2;
+}
+
+.eventLabel {
+    font-size: 11px;
+    font-weight: 600;
+    color: #fff;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    line-height: 1.3;
+}
+
+.eventTime {
+    font-size: 10px;
+    color: rgba(255, 255, 255, 0.8);
+    white-space: nowrap;
+}
+
+.eventDeleteBtn {
+    position: absolute;
+    top: 2px;
+    right: 2px;
+    background: rgba(0, 0, 0, 0.25);
+    border: none;
+    border-radius: 3px;
+    cursor: pointer;
+    color: #fff;
+    display: none;
+    align-items: center;
+    justify-content: center;
+    padding: 1px;
+    line-height: 1;
+}
+
+.eventBlock:hover .eventDeleteBtn {
+    display: flex;
+}
+
+/* =========================================================================
+   Month view
+   ========================================================================= */
+
+.monthGrid {
+    display: grid;
+    grid-template-columns: repeat(7, 1fr);
+}
+
+.monthDowHeader {
+    padding: 8px 4px;
+    font-size: 11px;
+    font-weight: 600;
+    text-align: center;
+    opacity: 0.5;
+    text-transform: uppercase;
+    letter-spacing: 0.4px;
+    border-bottom: 1px solid var(--eureka-outline, #e0e0e0);
+}
+
+.monthCell {
+    min-height: 80px;
+    padding: 4px;
+    border-right: 1px solid var(--eureka-outline, #e0e0e0);
+    border-bottom: 1px solid var(--eureka-outline, #e0e0e0);
+    cursor: pointer;
+    transition: background 0.1s;
+    overflow: hidden;
+}
+
+.monthCell:nth-child(7n) {
+    border-right: none;
+}
+
+.monthCell:hover {
+    background: rgba(0, 0, 0, 0.02);
+}
+
+.monthCellOutside {
+    opacity: 0.3;
+}
+
+.monthCellToday .monthCellNum {
+    color: var(--eureka-primary, #1976d2);
+}
+
+.monthCellNum {
+    font-size: 13px;
+    font-weight: 600;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 24px;
+    height: 24px;
+    margin-bottom: 2px;
+    border-radius: 50%;
+}
+
+.monthEventDot {
+    font-size: 10px;
+    color: #fff;
+    border-radius: 3px;
+    padding: 1px 4px;
+    margin-bottom: 2px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.monthMoreLabel {
+    font-size: 10px;
+    opacity: 0.5;
+    padding-left: 2px;
+}
+
+/* =========================================================================
+   Create popover
+   ========================================================================= */
+
+.popoverPaper {
+    border-radius: 12px !important;
+    box-shadow: 0 8px 32px rgba(0,0,0,0.15) !important;
+    min-width: 260px;
+    max-width: 300px;
+}
+
+.popoverHeader {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 12px 14px 8px;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
+}
+
+.popoverTitle {
+    font-weight: 600;
+    font-size: 14px;
+}
+
+.popoverClose {
+    background: none;
+    border: none;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    opacity: 0.5;
+    padding: 2px;
+    border-radius: 4px;
+}
+
+.popoverClose:hover { opacity: 1; }
+
+.popoverBody {
+    padding: 12px 14px 14px;
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+}
+
+.popoverLabel {
+    font-size: 11px;
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: 0.4px;
+    opacity: 0.5;
+    margin-bottom: -4px;
+}
+
+.categoryGrid {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 6px;
+}
+
+.categoryChip {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+    padding: 4px 10px;
+    border: 1px solid var(--eureka-outline, #ddd);
+    border-radius: 100px;
+    background: transparent;
+    cursor: pointer;
+    font-size: 12px;
+    transition: border-color 0.15s, background 0.15s;
+}
+
+.categoryChip:hover {
+    border-color: var(--eureka-primary, #1976d2);
+}
+
+.categoryChipActive {
+    border-color: transparent !important;
+}
+
+.categoryDot {
+    width: 8px;
+    height: 8px;
+    border-radius: 50%;
+    flex-shrink: 0;
+}
+
+.popoverInput {
+    width: 100%;
+    padding: 7px 10px;
+    border: 1px solid var(--eureka-outline, #ccc);
+    border-radius: 6px;
+    font-size: 13px;
+    font-family: inherit;
+    box-sizing: border-box;
+    background: transparent;
+    color: inherit;
+    outline: none;
+    transition: border-color 0.15s;
+}
+
+.popoverInput:focus {
+    border-color: var(--eureka-primary, #1976d2);
+}
+
+.timeRow {
+    display: flex;
+    align-items: flex-end;
+    gap: 8px;
+}
+
+.timeRow > div {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+}
+
+.timeDash {
+    font-size: 16px;
+    font-weight: 300;
+    opacity: 0.4;
+    padding-bottom: 6px;
+}
+
+.createBtn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 6px;
+    padding: 9px 16px;
+    border: none;
+    border-radius: 8px;
+    color: #fff;
+    font-size: 13px;
+    font-weight: 600;
+    cursor: pointer;
+    margin-top: 4px;
+    transition: opacity 0.15s;
+    font-family: inherit;
+}
+
+.createBtn:hover {
+    opacity: 0.9;
+}

package/dist/FormSteps/ClassifierSelectorStep/MaterialClassifierSelectorStep/MaterialClassifierSelectorStep.js

@@ -34,7 +34,7 @@ function ClassifierSelectorStep({ step, editable }) {
     const form = useContext(FormContext);
     const classifier = form.classifiers?.[step.idClassifier ?? ''];
     const options = useMemo(() => {
-        return (classifier?.children
+        return classifier?.children
             ?.filter((idClassifier) => {
             const option = step.options[idClassifier];
             if (option?.type === ClassifierOptionTypes.HIDE || !form.classifiers?.[idClassifier]) {
@@ -48,7 +48,7 @@ function ClassifierSelectorStep({ step, editable }) {
                 value: classifier?._id,
                 label: classifier?.clientName?.trim?.() && preview ? classifier?.clientName : classifier?.name,
             };
-        }) ?? []);
+        });
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [dependenciesValues]);

package/dist/FormSteps/EntityValueStep/MaterialEntityValuePickerStep/MaterialEntityValuePickerStep.js

@@ -3,30 +3,16 @@ import React, { useCallback, useContext, useMemo, useState } from 'react';
 import FormStepTypes, { EntityValueDataTypes, EntityValueOptionTypes } from '../../../constants/FormStepTypes';
 import SmartSelect from '../../SmartSelectStep/MaterialSmartSelectStep/MaterialSmartSelectStep';
 import widgetInstance from '../../../Utils/AxiosWidget';
-import FormContext, { IdFormContext } from '../../../Contexts/FormContext';
+import FormContext from '../../../Contexts/FormContext';
 import StepFillerContainer from '../../Utils/@StepFiller/StepFiller';
 import { recursivelyCalcConditionSteps, selectDependencies } from '../../StepHooks';
-import { useApiSubscribe, useAppSelector } from '../../../hooks';
+import { useAppSelector } from '../../../hooks';
 import MaterialEntityValueDialog from './MaterialEntityValueDialog/MaterialEntityValueDialog';
 import InputIcon from '../../../Shared/InputIcon/InputIcon';
 import { evaluateCondition } from '../../StepFunctions';
 import StepComponent from '../../Step';
-import ErkValueTypes from '../../../constants/ErkValueTypes';
-import { IntegrationsApi } from '../../../Services/IntegrationService';
 function EntityValuePickerStep({ step, editable }) {
     const form = useContext(FormContext);
-    const subscribe = useApiSubscribe();
-    const idForm = useContext(IdFormContext);
-    const fetchFilterIntegration = useCallback(async (idIntegration, payload) => {
-        return ((await subscribe(IntegrationsApi.endpoints.fetchFilterIntegration.initiate({
-            idForm,
-            payload,
-            idIntegration,
-        }))) ?? []);
-    }, [subscribe, idForm]);
-    const getOptions = useCallback(async (step, dependencyStore, ids) => {
-        return await getEntityValueOptions(step, dependencyStore, ids, fetchFilterIntegration);
-    }, [fetchFilterIntegration]);
     const [dialogs, setDialogs] = useState();
     const dialogsIdStepDeps = useMemo(() => {
         const ids = [];
@@ -48,7 +34,7 @@ function EntityValuePickerStep({ step, editable }) {
             }
             : undefined);
     }, []);
-    return (_jsxs(React.Fragment, { children: [dialogs !== undefined && form.entities?.[step.idEntity] && (_jsx(MaterialEntityValueDialog, { type: dialogs.current.type, entity: form.entities?.[step.idEntity], entityValue: dialogs.value, message: dialogs.current.message, handleClose: handleCloseDialog })), _jsx(StepFillerContainer, { step: step, children: _jsx(SmartSelect, { step: step, editable: editable, getOptions: getOptions, getOptionalDependencies: getOptionalDependencies, IconComponent: () => (step.icon ? _jsx(InputIcon, { icon: step.icon }) : undefined), getOptionSelected: (option, value) => option._id === value._id, calcDepError: (steps) => {
+    return (_jsxs(React.Fragment, { children: [dialogs !== undefined && form.entities?.[step.idEntity] && (_jsx(MaterialEntityValueDialog, { type: dialogs.current.type, entity: form.entities?.[step.idEntity], entityValue: dialogs.value, message: dialogs.current.message, handleClose: handleCloseDialog })), _jsx(StepFillerContainer, { step: step, children: _jsx(SmartSelect, { step: step, editable: editable, getOptions: getEntityValueOptions, getOptionalDependencies: getOptionalDependencies, IconComponent: () => (step.icon ? _jsx(InputIcon, { icon: step.icon }) : undefined), getOptionSelected: (option, value) => option._id === value._id, calcDepError: (steps) => {
                         for (const step of steps) {
                             if (step.type === FormStepTypes.ENTITYVALUEPICKER) {
                                 return 'Selecciona un ' + step.label;
@@ -111,7 +97,7 @@ function EntityValuePickerStep({ step, editable }) {
                     } }) })] }));
 }
 export default EntityValuePickerStep;
-const getEntityValueOptions = async (step, dependencyStore, { idOrganization, idCurrentAgent, }, fetchFilterIntegration) => {
+const getEntityValueOptions = async (step, dependencyStore, { idOrganization, idCurrentAgent, }) => {
     if (!idOrganization)
         return null;
     let urlPath = '';
@@ -138,40 +124,6 @@ const getEntityValueOptions = async (step, dependencyStore, { idOrganization, id
     const params = new URLSearchParams({});
     for (const filter of step.filters) {
         switch (filter.type) {
-            case EntityValueDataTypes.INTEGRATION: {
-                const payload = {};
-                for (const [key, erkValue] of Object.entries(filter.values ?? {})) {
-                    switch (erkValue.type) {
-                        case ErkValueTypes.BOOLEAN:
-                            payload[key] = erkValue.value;
-                            break;
-                        case ErkValueTypes.DRAFT: {
-                            //TODO: Hacer esto bien, la lambda tiene que ser capaz de calcular un draft en un filtro
-                            // values[key] = await mapDraftEntities(
-                            //     `filters[${index}].values.${key}`
-                            // );
-                            break;
-                        }
-                        case ErkValueTypes.STEP: {
-                            const currentValue = dependencyStore[erkValue.idStep]?.value;
-                            if (currentValue) {
-                                if (typeof currentValue === 'string')
-                                    payload[key] = currentValue;
-                                else if (currentValue instanceof Date)
-                                    payload[key] = currentValue.toISOString();
-                                else
-                                    payload[key] = currentValue._id ?? currentValue.id;
-                            }
-                            else
-                                payload[key] = null;
-                            break;
-                        }
-                    }
-                }
-                const filtered = await fetchFilterIntegration(filter.idIntegration, payload);
-                params.set(filter.idProperty, filtered.join(','));
-                break;
-            }
             case EntityValueDataTypes.STEP: {
                 const currentValue = dependencyStore[filter.idStep]?.value;
                 if (currentValue) {

package/dist/FormSteps/LocationStep/LocationStep.d.ts

@@ -0,0 +1,10 @@
+import { LocationStep } from '../../@Types/LocationFormStep';
+import { StepProps } from '../Step';
+export interface LocationStepProps extends StepProps {
+    /** The LocationStep to display */
+    step: LocationStep;
+    /** The icon to display */
+    IconComponent?: React.ElementType;
+}
+declare function LocationStepComponent(props: LocationStepProps): JSX.Element;
+export default LocationStepComponent;

package/dist/FormSteps/LocationStep/LocationStep.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FormStyleTypes } from '../../constants/FormStepTypes';
+import MaterialLocationStep from './MaterialLocationStep/MaterialLocationStep';
+import { useAppSelector } from '../../hooks';
+function LocationStepComponent(props) {
+    const { formStyle } = useAppSelector((state) => state.global);
+    switch (formStyle.type) {
+        case FormStyleTypes.MATERIAL:
+        default: {
+            return _jsx(MaterialLocationStep, { ...props });
+        }
+    }
+}
+export default LocationStepComponent;

package/dist/FormSteps/LocationStep/MaterialLocationStep/MaterialLocationStep.d.ts

@@ -0,0 +1,3 @@
+import { LocationStepProps } from '../LocationStep';
+declare function MaterialLocationStep({ step, editable }: LocationStepProps): JSX.Element;
+export default MaterialLocationStep;