@acpaas-ui/ngx-forms 6.1.10 → 6.1.11

package/package.json

@@ -1,17 +1,18 @@
 {
   "name": "@acpaas-ui/ngx-forms",
-  "version": "6.1.10",
+  "version": "6.1.11",
   "publishConfig": {
     "access": "public"
   },
   "dependencies": {
-    "@acpaas-ui/ngx-calendar": "^6.1.10",
+    "@acpaas-ui/ngx-calendar": "^6.1.11",
     "@acpaas-ui/ngx-flyout": "^6.1.5",
     "@acpaas-ui/ngx-icon": "^6.1.5",
     "@acpaas-ui/ngx-progress-bar": "^6.0.6",
     "@acpaas-ui/ngx-selectable-list": "^6.0.6",
-    "@acpaas-ui/ngx-utils": "^6.1.10",
-    "lodash-es": "~4.17.10"
+    "@acpaas-ui/ngx-utils": "^6.1.11",
+    "lodash-es": "~4.17.10",
+    "tslib": "^2.3.0"
   },
   "peerDependencies": {
     "@angular/common": ">=15.2.0",
@@ -19,5 +20,25 @@
     "@angular/forms": ">=15.2.0",
     "@angular/platform-browser": ">=15.2.0"
   },
-  "gitHead": "5531c62b14b1cb5cec521e8e21e29d43ec70bee2"
-}
+  "gitHead": "a1d4ee3bb2ad1660425529efc15832c07c8853a2",
+  "module": "fesm2015/acpaas-ui-ngx-forms.mjs",
+  "es2020": "fesm2020/acpaas-ui-ngx-forms.mjs",
+  "esm2020": "esm2020/acpaas-ui-ngx-forms.mjs",
+  "fesm2020": "fesm2020/acpaas-ui-ngx-forms.mjs",
+  "fesm2015": "fesm2015/acpaas-ui-ngx-forms.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2020": "./esm2020/acpaas-ui-ngx-forms.mjs",
+      "es2020": "./fesm2020/acpaas-ui-ngx-forms.mjs",
+      "es2015": "./fesm2015/acpaas-ui-ngx-forms.mjs",
+      "node": "./fesm2015/acpaas-ui-ngx-forms.mjs",
+      "default": "./fesm2020/acpaas-ui-ngx-forms.mjs"
+    }
+  },
+  "sideEffects": false
+}

package/.eslintrc.json

@@ -1,42 +0,0 @@
-{
-  "extends": "../../.eslintrc.json",
-  "ignorePatterns": [
-    "!**/*"
-  ],
-  "overrides": [
-    {
-      "files": [
-        "*.ts"
-      ],
-      "parserOptions": {
-        "project": [
-          "packages/ngx-forms/tsconfig.(lib|spec).json"
-        ]
-      },
-      "rules": {
-        "@angular-eslint/directive-selector": [
-          "error",
-          {
-            "type": "attribute",
-            "prefix": "aui",
-            "style": "camelCase"
-          }
-        ],
-        "@angular-eslint/component-selector": [
-          "error",
-          {
-            "type": "element",
-            "prefix": "aui",
-            "style": "kebab-case"
-          }
-        ]
-      }
-    },
-    {
-      "files": [
-        "*.html"
-      ],
-      "rules": {}
-    }
-  ]
-}

package/LICENSE.md

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2016-present Digipolis
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/dist/README.md

@@ -1,23 +0,0 @@
-# @acpaas-ui/ngx-forms
-
-The forms module is a collection of several forms-related modules, like an autocomplete, a datepicker, a range slider, a timepicker, etc.
-You can find an overview in the [Modules](#modules) section below.
-
-## Documentation
-
-Visit our [documentation site](https://antwerp-ui.digipolis.be/) for full how-to docs and guidelines
-
-## <a name="modules"></a>Modules
-
-| Name                 | Description                                                                                                                 | Documentation                                    |
-| -------------------- | --------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------ |
-| `AutoCompleteModule` | This module creates an input field with autocomplete functionality.                                                         | [Documentation](src/lib/auto-complete/README.md) |
-| `DatepickerModule`   | This package allows the user to select a date either by input or by picking one in the calendar flyout.                     | [Documentation](src/lib/datepicker/README.md)    |
-| `RangeSliderModule`  | This module provides a range slider.                                                                                        | [Documentation](src/lib/range-slider/README.md)  |
-| `SearchFilterModule` | This package allows the user to use a JIRA-like filter component with remote search capabilities.                           | [Documentation](src/lib/search-filter/README.md) |
-| `TimepickerModule`   | This package allows the user set the time either by choosing a slot in the dropdown or by typing in the autocomplete field. | [Documentation](src/lib/timepicker/README.md)    |
-| `UploadModule`       | This module provides a couple of upload components and a specific `Uploader` class.                                         | [Documentation](src/lib/upload/README.md)        |
-
-## Contributing
-
-Visit our [Contribution Guidelines](../../CONTRIBUTING.md) for more information on how to contribute.

package/dist/package.json

@@ -1,44 +0,0 @@
-{
-  "name": "@acpaas-ui/ngx-forms",
-  "version": "6.1.10",
-  "publishConfig": {
-    "access": "public"
-  },
-  "dependencies": {
-    "@acpaas-ui/ngx-calendar": "^6.1.10",
-    "@acpaas-ui/ngx-flyout": "^6.1.5",
-    "@acpaas-ui/ngx-icon": "^6.1.5",
-    "@acpaas-ui/ngx-progress-bar": "^6.0.6",
-    "@acpaas-ui/ngx-selectable-list": "^6.0.6",
-    "@acpaas-ui/ngx-utils": "^6.1.10",
-    "lodash-es": "~4.17.10",
-    "tslib": "^2.3.0"
-  },
-  "peerDependencies": {
-    "@angular/common": ">=15.2.0",
-    "@angular/core": ">=15.2.0",
-    "@angular/forms": ">=15.2.0",
-    "@angular/platform-browser": ">=15.2.0"
-  },
-  "gitHead": "5531c62b14b1cb5cec521e8e21e29d43ec70bee2",
-  "module": "fesm2015/acpaas-ui-ngx-forms.mjs",
-  "es2020": "fesm2020/acpaas-ui-ngx-forms.mjs",
-  "esm2020": "esm2020/acpaas-ui-ngx-forms.mjs",
-  "fesm2020": "fesm2020/acpaas-ui-ngx-forms.mjs",
-  "fesm2015": "fesm2015/acpaas-ui-ngx-forms.mjs",
-  "typings": "index.d.ts",
-  "exports": {
-    "./package.json": {
-      "default": "./package.json"
-    },
-    ".": {
-      "types": "./index.d.ts",
-      "esm2020": "./esm2020/acpaas-ui-ngx-forms.mjs",
-      "es2020": "./fesm2020/acpaas-ui-ngx-forms.mjs",
-      "es2015": "./fesm2015/acpaas-ui-ngx-forms.mjs",
-      "node": "./fesm2015/acpaas-ui-ngx-forms.mjs",
-      "default": "./fesm2020/acpaas-ui-ngx-forms.mjs"
-    }
-  },
-  "sideEffects": false
-}

package/karma.conf.js

@@ -1,38 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client: {
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    customLaunchers: {
-      ChromeHeadlessNoSandbox: {
-        base: 'ChromeHeadless',
-        flags: ['--no-sandbox']
-      }
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, '../../coverage/ngx-forms'),
-      reports: ['html', 'lcovonly', 'text-summary'],
-      fixWebpackSourcePaths: true
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['ChromeHeadlessNoSandbox'],
-    singleRun: true,
-    restartOnFileChange: true
-  });
-};

package/ng-package.json

@@ -1,8 +0,0 @@
-{
-  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
-  "dest": "./dist",
-  "lib": {
-    "entryFile": "src/public-api.ts"
-  },
-  "allowedNonPeerDependencies": ["@acpaas-ui", "lodash-es"]
-}

package/src/lib/auto-complete/README.md

@@ -1,148 +0,0 @@
-# @acpaas-ui/ngx-forms
-
-This module creates an input field with autocomplete functionality.
-
-## Usage
-
-```typescript
-import { AutoCompleteModule } from '@acpaas-ui/ngx-forms';
-```
-
-## Documentation
-
-Visit our [documentation site](https://antwerp-ui.digipolis.be/) for full how-to docs and guidelines
-
-### API
-
-| Name                                    | Default value | Description                                                                                                                                                                                                                                        |
-| --------------------------------------- | ------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `@Input() id: string;`                  | -             | The id used for the input field.                                                                                                                                                                                                                   |
-| `@Input() placeholder: string;`         | -             | The placeholder used for the input field.                                                                                                                                                                                                          |
-| `@Input() description: string;`         | -             | The description used for the input field.                                                                                                                                                                                                          |
-| `@Input() inputLabel: string;`          | -             | The label used for the input field.                                                                                                                                                                                                                |
-| `@Input() searchIncentiveText: string;` | -             | The message shown when the user focuses on the input field (useful for remote search).                                                                                                                                                             |
-| `@Input() loadingText: string;`         | -             | The message shown when the search is loading results (accompanied by a loading icon).                                                                                                                                                              |
-| `@Input() noResultsText: string;`       | -             | The message shown when the search is complete and there are no results.                                                                                                                                                                            |
-| `@Input() remote: boolean;`             | `false`       | Enable remote search.                                                                                                                                                                                                                              |
-| `@Input() minCharacters: number;`       | `0`           | The minimal required characters to trigger a search.                                                                                                                                                                                               |
-| `@Input() clearInvalid: boolean;`       | `false`       | Clear invalid searchstring values on blur (resets to modelvalue).                                                                                                                                                                                  |
-| `@Input() label: string;`               | -             | Provide a custom label prop for collections. This will be matched against for searching.                                                                                                                                                           |
-| `@Input() value: string;`               | -             | Provide a custom value prop for collections. This will be used as the actual value.                                                                                                                                                                |
-| `@Input() showAllByDefault: string;`    | -             | An attribute which can be set to true to show all items in `this.data` by default if no query is provided. This does need the `data`-attribute to have a correct value to work.                                                                    |
-| `@Input() data: any[];`                 | `[]`          | An array of filtered objects (use the label and value properties) or a flat array of filtered strings. Data is used to do basic filtering inside the component. It is also possible to do the filtering yourself and provide the results directly. |
-| `@Input() results: any[];`              | `[]`          | The values for the selectable list. This is an array of filtered objects (use the label and value properties) or a flat array of filtered strings.                                                                                                 |
-
-### Methods
-
-| Name                           | Description                                                  |
-| ------------------------------ | ------------------------------------------------------------ |
-| `search(search: string): void` | The hook to filter the data yourself with the search string. |
-| `select(item: any): void`      | The hook that will be triggered when an item is selected.    |
-
-### Example
-
-```typescript
-import { AutoCompleteModule } from '@acpaas-ui/ngx-forms';
-
-@NgModule({
-    imports: [
-        AutoCompleteModule,
-    ]
-});
-
-export class AppModule {};
-```
-
-#### Local search
-
-```typescript
-public heroList = [
-    {name: 'Batman'},
-    {name: 'Wonder Woman'},
-    {name: 'Wolverine'},
-    {name: 'Iron Man'},
-    {name: 'Deadpool'},
-];
-public setSelectedItem(hero: string): void {
-  // Do something
-}
-```
-
-```html
-<aui-auto-complete
-  id="hero-names"
-  placeholder="Choose your hero…"
-  description="Description"
-  inputLabel="Hero"
-  value=""
-  minCharacters="3"
-  clearInvalid="true"
-  showAllByDefault="true"
-  [data]="heroList"
-  (select)="setSelectedItem($event)"
->
-</aui-auto-complete>
-```
-
-#### Remote search with template
-
-```typescript
-public results = [];
-public heroList = [
-    {name: 'Batman'},
-    {name: 'Wonder Woman'},
-    {name: 'Wolverine'},
-    {name: 'Iron Man'},
-    {name: 'Deadpool'},
-];
-public searchValue = '';
-public selectedItem = '';
-
-public searchItems(search: string): void {
-    this.searchValue = search;
-    // Do search
-    this.debouncer.next(search);
-}
-
-public setSelectedItem(hero: {name}): void {
-    this.selectedItem = hero;
-}
-
-public formatLabel(input: any) {
-    const inputString = input.name;
-
-    if (!this.searchValue) {
-        return inputString;
-    }
-
-    // Highlight searchValue in result
-    const regEx = new RegExp(this.searchValue, 'ig');
-    const inputStringHighlighted = (inputString.replace(regEx, '<strong>' + this.searchValue + '</strong>'));
-    return \`<aui-icon name="ai-single-neutral" className="u-text-light u-margin-right-xs"></aui-icon>\${inputStringHighlighted}\`;
-}
-```
-
-```html
-<aui-auto-complete
-  id="hero"
-  placeholder="Choose your hero…"
-  description="Description"
-  remote="true"
-  [results]="results"
-  inputLabel="Hero"
-  key="id"
-  loadingText="Loading…"
-  noResultsText="No results found"
-  searchIncentiveText="Type one or more keywords to start searching"
-  (search)="searchItems($event)"
-  (select)="setSelectedItem($event)"
->
-  <ng-template let-item>
-    <div class="has-icon-left" [innerHTML]="formatLabel(item)"></div>
-  </ng-template>
-</aui-auto-complete>
-```
-
-## Contributing
-
-Visit our [Contribution Guidelines](../../../../../CONTRIBUTING.md) for more information on how to contribute.

package/src/lib/auto-complete/auto-complete.module.ts

@@ -1,15 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import { FlyoutModule } from '@acpaas-ui/ngx-flyout';
-import { SelectableListModule } from '@acpaas-ui/ngx-selectable-list';
-import { SearchService } from '../shared/services/search.service';
-import { AutoCompleteComponent } from './components/auto-complete/auto-complete.component';
-
-@NgModule({
-  imports: [CommonModule, FormsModule, FlyoutModule, SelectableListModule],
-  declarations: [AutoCompleteComponent],
-  exports: [AutoCompleteComponent],
-  providers: [SearchService],
-})
-export class AutoCompleteModule {}

package/src/lib/auto-complete/components/auto-complete/auto-complete.component.html

@@ -1,51 +0,0 @@
-<div
-  (closed)="onFlyoutClosed()"
-  [toggleClick]="false"
-  aria-haspopup="listbox"
-  auiFlyout
-  class="m-flyout m-flyout--scrollable m-flyout--full o-auto-complete"
->
-  <input
-    (focus)="onFocus()"
-    (keyArrowDown)="onKeyArrowDown()"
-    (keyArrowUp)="onKeyArrowUp()"
-    (keyEnter)="onKeyEnter($event)"
-    (keyEscape)="onKeyEscape()"
-    [(ngModel)]="query"
-    (ngModelChange)="doSearch()"
-    [disabled]="isDisabled ? true : null"
-    [id]="id"
-    [placeholder]="placeholder"
-    aria-autocomplete="list"
-    auiFlyoutAction
-    auiSelectableActions
-    [autocomplete]="autoComplete"
-    type="text"
-    class="a-input"
-  />
-  <div *ngIf="!isDisabled" auiFlyoutZone>
-    <span *ngIf="focused && loadingText && searching" class="a-spinner a-spinner--s u-margin-xs" role="alert">
-      <span class="a-spinner__circle"></span>
-      <span class="a-spinner__text">{{ loadingText }}</span>
-    </span>
-    <span
-      *ngIf="focused && searchIncentiveText && !searching && !query && !results.length"
-      class="o-auto-complete__info u-text-light u-margin-xs"
-      >{{ searchIncentiveText }}</span
-    >
-    <span
-      *ngIf="focused && noResultsText && !searching && query && !results.length"
-      class="o-auto-complete__info u-text-light u-margin-xs"
-      >{{ noResultsText }}</span
-    >
-    <aui-selectable-list
-      (selected)="onSelect($event)"
-      *ngIf="results.length > 0 && !(focused && loadingText && searching)"
-      [index]="index"
-      [itemTemplate]="template"
-      [items]="results"
-      [label]="label"
-      [search]="query"
-    ></aui-selectable-list>
-  </div>
-</div>

package/src/lib/auto-complete/components/auto-complete/auto-complete.component.scss

@@ -1,4 +0,0 @@
-.o-auto-complete,
-.o-auto-complete__info {
-  display: block;
-}