Error with date helper on 5.1.5 ?

[marcflausino]

Describe the bug

Trying to use 5.1.5 version i got an error.

Maybe i'm wrong but i think there is a bug in line 14 of @pdfme/schemas/src/date/helper.ts

import 'air-datepicker/air-datepicker.css';

This imports css file but is interpreted as javascript, so the first line that use a css class raise an error (see error log below)

If i fix the import and get "require("air-datepicker/air-datepicker.js");" i no longer have the issue.

To Reproduce

just running version with 5.1.5 schemas ?

Expected behavior

no error

Your Environment

- pdfme package(@pdfme/generator or @pdfme/ui): 5.1.5
- pdfme version: 5.1.5
- Operating system: Windows
- Node.js version or Browser name & version: 20

Your Error Log

Uncaught SyntaxError C:\DevCodigo\node\pdf-test\node_modules\air-datepicker\air-datepicker.css:1
.air-datepicker-cell.-year-.-other-decade-,.air-datepicker-cell.-day-.-other-month-{color:var(--adp-color-other-month)}.air-datepicker-cell.-year-.-other-decade-:hover,.air-datepicker-cell.-day-.-other-month-:hover{color:var(--adp-color-other-month-hover)}.-disabled-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-disabled-.-focus-.air-datepicker-cell.-day-.-other-month-{color:var(--adp-color-other-month)}.-selected-.air-datepicker-cell.-year-.-other-decade-,.-selected-.air-datepicker-cell.-day-.-other-month-{color:#fff;background:var(--adp-background-color-selected-other-month)}.-selected-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-selected-.-focus-.air-datepicker-cell.-day-.-other-month-{background:var(--adp-background-color-selected-other-month-focused)}.-in-range-.air-datepicker-cell.-year-.-other-decade-,.-in-range-.air-datepicker-cell.-day-.-other-month-{background-color:var(--adp-background-color-in-range);color:var(--adp-color)}.-in-range-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-in-range-.-focus-.air-datepicker-cell.-day-.-other-month-{background-color:var(--adp-background-color-in-range-focused)}.air-datepicker-cell.-year-.-other-decade-:empty,.air-datepicker-cell.-day-.-other-month-:empty{background:none;border:none}.air-datepicker-cell{border-radius:var(--adp-cell-border-radius);box-sizing:border-box;cursor:pointer;display:flex;position:relative;align-items:center;justify-content:center;z-index:1}.air-datepicker-cell.-focus-{background:var(--adp-cell-background-color-hover)}.air-datepicker-cell.-current-{color:var(--adp-color-current-date)}.air-datepicker-cell.-current-.-focus-{color:var(--adp-color)}.air-datepicker-cell.-current-.-in-range-{color:var(--adp-color-current-date)}.air-datepicker-cell.-disabled-{cursor:default;color:var(--adp-color-disabled)}.air-datepicker-cell.-disabled-.-focus-{color:var(--adp-color-disabled)}.air-datepicker-cell.-disabled-.-in-range-{color:var(--adp-color-disabled-in-range)}.air-datepicker-cell.-disabled-.-current-.-focus-{color:var(--adp-color-disabled)}.air-datepicker-cell.-in-range-{background:var(--adp-cell-background-color-in-range);border-radius:0}.air-datepicker-cell.-in-range-:hover,.air-datepicker-cell.-in-range-.-focus-{background:var(--adp-cell-background-color-in-range-hover)}.air-datepicker-cell.-range-from-{border:1px solid var(--adp-cell-border-color-in-range);background-color:var(--adp-cell-background-color-in-range);border-radius:var(--adp-cell-border-radius) 0 0 var(--adp-cell-border-radius)}.air-datepicker-cell.-range-to-{border:1px solid var(--adp-cell-border-color-in-range);background-color:var(--adp-cell-background-color-in-range);border-radius:0 var(--adp-cell-border-radius) var(--adp-cell-border-radius) 0}.air-datepicker-cell.-range-to-.-range-from-{border-radius:var(--adp-cell-border-radius)}.air-datepicker-cell.-selected-{color:#fff;border:none;background:var(--adp-cell-background-color-selected)}.air-datepicker-cell.-selected-.-current-{color:#fff;background:var(--adp-cell-background-color-selected)}.air-datepicker-cell.-selected-.-focus-{background:var(--adp-cell-background-color-selected-hover)}
^

**SyntaxError: Unexpected token '.'**
    at internalCompileFunction (<node_internals>/internal/vm:77:18)
    at wrapSafe (<node_internals>/internal/modules/cjs/loader:1288:20)
    at Module._compile (<node_internals>/internal/modules/cjs/loader:1340:27)
    at Module._extensions..js (<node_internals>/internal/modules/cjs/loader:1435:10)
    at Module.load (<node_internals>/internal/modules/cjs/loader:1207:32)
    at Module._load (<node_internals>/internal/modules/cjs/loader:1023:12)
    at Module.require (<node_internals>/internal/modules/cjs/loader:1235:19)
    at require (<node_internals>/internal/modules/helpers:176:18)
    **at <anonymous> (c:\DevCodigo\node\pdf-test\node_modules\@pdfme\schemas\dist\cjs\src\date\helper.js:19:1)**
    at Module._compile (<node_internals>/internal/modules/cjs/loader:1376:14
    at Module._extensions..js (<node_internals>/internal/modules/cjs/loader:1435:10)
    at Module.load (<node_internals>/internal/modules/cjs/loader:1207:32)
    at Module._load (<node_internals>/internal/modules/cjs/loader:1023:12)
    at Module.require (<node_internals>/internal/modules/cjs/loader:1235:19)
    at require (<node_internals>/internal/modules/helpers:176:18)
    at <anonymous> (c:\DevCodigo\node\pdf-test\node_modules\@pdfme\schemas\dist\cjs\src\date\dateTime.js:3:18)

Additional context

No response

[hand-dot]

Hey @marcflausino Could you create minimal reproducible repo?

I will handle this.

[hand-dot]

This error came from introduce date schema(5.1.0). So, I guess 5.0.0 is working.

[marcflausino]

until 5.1.1 it's working, my service use 5.1.1 and i have no problem with it. I think this commit introduced the air-datepicker.css import.

[hand-dot]

Yes, I will handle this.

[hand-dot]

This is fixed by https://github.com/pdfme/pdfme/pull/616 and Released https://github.com/pdfme/pdfme/releases/tag/5.1.6

@marcflausino Could you check this issue is fixed?

[marcflausino]

just checked, it's ok now :)

thanks @hand-dot !