Add Angular 18 support

.browserslistrc

@@ -1,11 +1,9 @@
-# This file is currently used by autoprefixer to adjust CSS to support the below specified browsers
-# For additional information regarding the format and rule options, please see:
-# https://github.com/browserslist/browserslist#queries
-#
-# For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed
-
-> 0.5%
-last 2 versions
+# Default Angular browser support
+# See: https://angular.dev/tools/cli/build#configuring-browser-compatibility
+# And: https://angular.dev/reference/versions#browser-support
+last 2 Chrome versions
+last 1 Firefox version
+last 2 Edge major versions
+last 2 Safari major versions
+last 2 iOS major versions
 Firefox ESR
-not dead
-not IE 9-11

.eslintrc.js

@@ -0,0 +1,208 @@
+/*
+👋 Hi! This file was autogenerated by tslint-to-eslint-config.
+https://github.com/typescript-eslint/tslint-to-eslint-config
+
+It represents the closest reasonable ESLint configuration to this
+project's original TSLint configuration.
+
+We recommend eventually switching this configuration to extend from
+the recommended rulesets in typescript-eslint. 
+https://github.com/typescript-eslint/tslint-to-eslint-config/blob/master/docs/FAQs.md
+
+Happy linting! 💖
+*/
+module.exports = {
+    "env": {
+        "browser": true,
+        "node": true
+    },
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+        "project": "tsconfig.json",
+        "sourceType": "module"
+    },
+    "plugins": [
+        "eslint-plugin-import",
+        "eslint-plugin-jsdoc",
+        "@angular-eslint/eslint-plugin",
+        "@typescript-eslint",
+        "@typescript-eslint/tslint"
+    ],
+    "root": true,
+    "rules": {
+        "@angular-eslint/component-class-suffix": "error",
+        "@angular-eslint/directive-class-suffix": "error",
+        "@angular-eslint/no-host-metadata-property": "error",
+        "@angular-eslint/no-input-rename": "error",
+        "@angular-eslint/no-inputs-metadata-property": "error",
+        "@angular-eslint/no-output-on-prefix": "error",
+        "@angular-eslint/no-output-rename": "error",
+        "@angular-eslint/no-outputs-metadata-property": "error",
+        "@angular-eslint/use-lifecycle-interface": "error",
+        "@angular-eslint/use-pipe-transform-interface": "error",
+        "@typescript-eslint/consistent-type-definitions": "error",
+        "@typescript-eslint/dot-notation": "off",
+        "@typescript-eslint/explicit-member-accessibility": [
+            "off",
+            {
+                "accessibility": "explicit"
+            }
+        ],
+        "@typescript-eslint/indent": "error",
+        "@typescript-eslint/member-delimiter-style": [
+            "error",
+            {
+                "multiline": {
+                    "delimiter": "semi",
+                    "requireLast": true
+                },
+                "singleline": {
+                    "delimiter": "semi",
+                    "requireLast": false
+                }
+            }
+        ],
+        "@typescript-eslint/member-ordering": "error",
+        "@typescript-eslint/naming-convention": [
+            "error",
+            {
+                "selector": "variable",
+                "format": [
+                    "camelCase",
+                    "UPPER_CASE"
+                ],
+                "leadingUnderscore": "forbid",
+                "trailingUnderscore": "forbid"
+            }
+        ],
+        "@typescript-eslint/no-empty-function": "off",
+        "@typescript-eslint/no-empty-interface": "error",
+        "@typescript-eslint/no-inferrable-types": [
+            "error",
+            {
+                "ignoreParameters": true
+            }
+        ],
+        "@typescript-eslint/no-misused-new": "error",
+        "@typescript-eslint/no-non-null-assertion": "error",
+        "@typescript-eslint/no-shadow": [
+            "error",
+            {
+                "hoist": "all"
+            }
+        ],
+        "@typescript-eslint/no-unused-expressions": "error",
+        "@typescript-eslint/prefer-function-type": "error",
+        "@typescript-eslint/quotes": [
+            "error",
+            "single"
+        ],
+        "@typescript-eslint/semi": [
+            "error",
+            "always"
+        ],
+        "@typescript-eslint/type-annotation-spacing": "error",
+        "@typescript-eslint/unified-signatures": "error",
+        "arrow-body-style": "error",
+        "brace-style": [
+            "error",
+            "1tbs"
+        ],
+        "constructor-super": "error",
+        "curly": "error",
+        "dot-notation": "off",
+        "eol-last": "error",
+        "eqeqeq": [
+            "error",
+            "smart"
+        ],
+        "guard-for-in": "error",
+        "id-denylist": "off",
+        "id-match": "off",
+        "import/no-deprecated": "warn",
+        "indent": "off",
+        "jsdoc/no-types": "error",
+        "max-len": [
+            "error",
+            {
+                "code": 140
+            }
+        ],
+        "no-bitwise": "error",
+        "no-caller": "error",
+        "no-console": [
+            "error",
+            {
+                "allow": [
+                    "log",
+                    "warn",
+                    "error",
+                    "dir",
+                    "timeLog",
+                    "assert",
+                    "clear",
+                    "count",
+                    "countReset",
+                    "group",
+                    "groupEnd",
+                    "table",
+                    "dirxml",
+                    "groupCollapsed",
+                    "Console",
+                    "profile",
+                    "profileEnd",
+                    "timeStamp",
+                    "context",
+                    "createTask"
+                ]
+            }
+        ],
+        "no-debugger": "error",
+        "no-empty": "off",
+        "no-empty-function": "off",
+        "no-eval": "error",
+        "no-fallthrough": "error",
+        "no-new-wrappers": "error",
+        "no-restricted-imports": [
+            "error",
+            "rxjs/Rx"
+        ],
+        "no-shadow": "off",
+        "no-throw-literal": "error",
+        "no-trailing-spaces": "error",
+        "no-undef-init": "error",
+        "no-underscore-dangle": "off",
+        "no-unused-expressions": "off",
+        "no-unused-labels": "error",
+        "no-var": "error",
+        "prefer-const": "error",
+        "quotes": "off",
+        "radix": "error",
+        "semi": "off",
+        "spaced-comment": [
+            "error",
+            "always",
+            {
+                "markers": [
+                    "/"
+                ]
+            }
+        ],
+        "@typescript-eslint/tslint/config": [
+            "error",
+            {
+                "rules": {
+                    "import-spacing": true,
+                    "whitespace": [
+                        true,
+                        "check-branch",
+                        "check-decl",
+                        "check-operator",
+                        "check-separator",
+                        "check-type"
+                    ]
+                }
+            }
+        ]
+    }
+};

.github/workflows/ci_test.yml

@@ -18,16 +18,16 @@ jobs:
   build:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v4
       - name: Upgrade Chrome browser
         run: |
             sudo apt-get update
             sudo apt-get --only-upgrade install google-chrome-stable
       - name: Use Node.js
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v4
         with:
-            node-version: '20.10.0'
+            node-version: lts/*
       - name: Install dependencies
-        run: npm ci
+        run: npm ci --include=optional
       - name: Run tests
-        run: npm run test-with-coverage     
+        run: npm run test-with-coverage

.travis.yml

@@ -7,7 +7,7 @@ cache:
 addons:
   chrome: stable
 before_script:
-  - npm install -g @angular/cli@17
+  - npm install -g @angular/cli@18
   - npm install
 script:
   - npm run test-with-coverage

README.md

@@ -4,12 +4,13 @@
 [![npm](https://img.shields.io/npm/v/@danielmoncada/angular-datetime-picker.svg?maxAge=2592000?style=flat-square)](https://www.npmjs.com/package/@danielmoncada/angular-datetime-picker)
 [![npm](https://img.shields.io/npm/dm/@danielmoncada/angular-datetime-picker.svg)](https://www.npmjs.com/package/@danielmoncada/angular-datetime-picker)
 
-**The current version of this package supports Angular 17**
+**The current version of this package supports Angular 18**
 
 If you need support for other Angular version, see *Breaking Changes* below.
 
 Breaking Changes
 -------
+ - Version 18.x.x >= no longer supports ng 17. If you need ng 17 support, stick with version 17.x.x.
  - Version 17.x.x >= no longer supports ng 16 - 13. If you need ng 16-13 support, stick with version 16.x.x.
  - Version 14.x.x >= no longer supports < ng 13. If you need View Engine support, stick with version 13.x.x.
  - Version 13.1.0+ no longer supports the `MomentJs` time adapter natively. If you want to use the MomentJs adapter, see [GitHub](https://github.com/danielmoncada/date-time-picker-moment-adapter) or [npm](https://www.npmjs.com/package/@danielmoncada/angular-datetime-picker-moment-adapter).
@@ -18,17 +19,17 @@ Breaking Changes
 Description
 -------
 Simple Angular date time picker. Online doc is [here](https://daniel-projects.firebaseapp.com/owlng/date-time-picker), Online demos(StackBlitz) are [here](https://stackblitz.com/edit/angular-vvp849) and [here](https://stackblitz.com/edit/angular-i7ykf5).
-This picker is responsive design, so feel free to try it in your desktops, tablets and mobile devices. 
+This picker is responsive design, so feel free to try it in your desktops, tablets and mobile devices.
 
 How to Use
 -------
 
  1. Install with [npm](https://www.npmjs.com): `npm install @danielmoncada/angular-datetime-picker --save`
  2. Add styles.
-    If you are using Angular CLI, you can add this to your styles.css: 
+    If you are using Angular CLI, you can add this to your styles.css:
     ```css
     @import "@danielmoncada/angular-datetime-picker/assets/style/picker.min.css";
-    ``` 
+    ```
     If you are not using the Angular CLI, you can include the picker.min.css via a ```<link>``` element in your index.html.
  3. Add __OwlDateTimeModule__ and __OwlNativeDateTimeModule__ to your __@NgModule__ like example below
     ```typescript
@@ -58,13 +59,13 @@ How to Use
     <span [owlDateTimeTrigger]="dt2"><i class="fa fa-calendar"></i></span>
     <owl-date-time #dt2></owl-date-time>
     ```
-    The examples above are quite basic. The picker has much more features, 
+    The examples above are quite basic. The picker has much more features,
     and you could learn more about those from [demo page](https://danielykpan.github.io/date-time-picker/).
-    
+
 
 Animation
 -------
-This picker uses angular animations to improve the user experience, 
+This picker uses angular animations to improve the user experience,
 therefore you need to install `@angular/animations` and import `BrowserAnimationsModule` to your application.
 ```
 npm install @angular/animations --save
@@ -114,7 +115,7 @@ Properties for `owl-date-time`
 |`yearOnly`|boolean|Optional|`false`| Restricts the calendar to only show the year and multi-year views for month selection. |
 |`multiyearOnly`|boolean|Optional|`false`| Restricts the calendar to only show the multi-year view for year selection. |
 |`startAt`| T/null |Optional|`null`| The moment to open the picker to initially. |
-|`endAt`| T/null |Optional|`null`| The the default selected time for range calendar end time | 
+|`endAt`| T/null |Optional|`null`| The the default selected time for range calendar end time |
 |`firstDayOfWeek`|number|Optional|`0`| Set the first day of week. Valid value is from 0 to 6. 0: Sunday - 6: Saturday|
 |`showSecondsTimer`|boolean|Optional|`false`| When specify it to true, it would show a timer to configure the second's value |
 |`hideOtherMonths`|boolean|Optional|`false`| Whether to hide dates in other months at the start or end of the current month |
@@ -182,7 +183,7 @@ Properties for `owl-date-time-inline`
 |`pickerType`|`both`, `calendar`, `timer`|Optional|`both`| Set the type of the dateTime picker. `both`: show both calendar and timer, `calendar`: only show calendar, `timer`: only show timer. |
 |`startView`|`month`, `year`, `multi-year`|Optional|`month`| The view that the calendar should start in. |
 |`startAt`| T/null |Optional|`null`| The moment to open the picker to initially. |
-|`endAt`| T/null |Optional|`null`| The the default selected time for range calendar end time | 
+|`endAt`| T/null |Optional|`null`| The the default selected time for range calendar end time |
 |`firstDayOfWeek`|number|Optional|`0`| Set the first day of week. Valid value is from 0 to 6. 0: Sunday - 6: Saturday|
 |`showSecondsTimer`|boolean|Optional|`false`| When specify it to true, it would show a timer to configure the second's value |
 |`hideOtherMonths`|boolean|Optional|`false`| Whether to hide dates in other months at the start or end of the current month |