# @decoloop/planner

> The Sieval Dedicated Solutions decoloop planner widget

Latest version **1.2.4** (published 2023-10-18) · MIT license · 0 weekly downloads

## Install

```sh
npm install @decoloop/planner
pnpm add @decoloop/planner
yarn add @decoloop/planner
bun add @decoloop/planner
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.2.4 |
| Published | 2023-10-18 |
| First published | 2020-03-25 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 2 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Sieval Dedicated Solutions |
| Maintainers | sieval-pdejong |
| Keywords | sieval, decoloop, widget, woontotaal |

## Links

- npm: https://www.npmjs.com/package/@decoloop/planner
- Homepage: https://www.sieval.com
- npm.io page: https://npm.io/package/@decoloop/planner

## Alternatives

- [@sindresorhus/slugify](https://npm.io/package/@sindresorhus/slugify.md) — 3.7M weekly downloads
- [solid-js](https://npm.io/package/solid-js.md) — 2.7M weekly downloads
- [expo-glass-effect](https://npm.io/package/expo-glass-effect.md) — 2.5M weekly downloads
- [nanoassert](https://npm.io/package/nanoassert.md) — 780.8K weekly downloads
- [@ffmpeg/ffmpeg](https://npm.io/package/@ffmpeg/ffmpeg.md) — 529.5K weekly downloads

## Recent versions

- 1.2.4 (latest) — 2023-10-18
- 1.2.0-beta.3 (beta) — 2023-08-22
- 1.2.3 — 2023-10-05
- 1.2.2 — 2023-10-02
- 1.2.1 — 2023-09-03
- 1.2.0 — 2023-08-24
- 1.2.0-beta.2 — 2023-08-14
- 1.2.0-beta.1 — 2023-06-22
- 1.2.0-beta.0 — 2023-06-21
- 1.1.6 — 2023-05-23
- 1.1.5 — 2023-05-22
- 1.1.4 — 2022-12-15
- 1.1.3 — 2022-12-12
- 1.1.2 — 2022-11-08
- 1.1.1 — 2022-02-08
- … 29 more at https://npm.io/package/@decoloop/planner/versions

## README

# Releases
## 1.2.4
- fix only hidden articles on validation

## 1.2.3
- add custom translations for 'datepicker'
- 'datepicker' validations
- hide summaries in 'all steps'

## 1.2.2
- add submit validation for 'all steps' modus
- fix to change an address

## 1.2.1
- Fix hidden articles

## 1.2.0
- new flow to show all steps at once.
- new option to apply selected quantity to all active articles (shared articles)
- new option to show calendar (datepicker)
- new way to visualize customer step (grid)
- improved styling


# Activity logging

Inline custom events like 'activity' are not supported in HTML.
JavaScript event listeners are needed to handle the 'activity' event.

```html
<decoloop-planner id="widget"/>

<script>
	document
        .getElementById("widget")
        .addEventListener("activity", e => { console.log(e.detail) });
</script>
```
```html
button name="dlpButtonLoader" id="widget-button">[text]</button>

<script>
	document
        .getElementById("widget-button")
        .addEventListener("activity", e => { console.log(e.detail) });
</script>
```

## Example logging object

```json
{
    "details": {
        "skillCode": "OTHER.MEASURE.PIECES",
        "active": true
    },
    "hasErrors": false,
    "errors": [],
    "kind": 0,
    "action": "toggle"
}
```

| Parameter | Type     | Description                |
| --------- | -------- | -------------------------- |
| `kind` | `int` |  Widget step |
| `action` | `string` | Action within the step |
| `details` | `object or null` | based on action |
| `hasErrors` | `boolean` | true when the `errors` list has values |
| `errors` | `string[]` | list of errors |

## Widget step: Articles
Kind = 0 

### Action: toggle

```json
{
    "details": {
        "skillCode": "OTHER.MEASURE.PIECES",
        "active": true
    },
    "hasErrors": false,
    "errors": [],
    "kind": 0,
    "action": "toggle"
}
```

| Parameter | Type     | Description                |
| --------- | -------- | -------------------------- |
| `skillCode` | `string` | selected article |
| `active` | `boolean` | selected or deselected |

### Action: change

```json
{
    "details": {
        "skillCode": "OTHER.MEASURE.PIECES",
        "quantity": "5"
    },
    "kind": 0,
    "hasErrors": false,
    "errors": [],
    "action": "change"
}
```

| Parameter | Type     | Description                |
| --------- | -------- | -------------------------- |
| `skillCode` | `string` | selected article |
| `quantity` | `int` | selected quantity |

### Action: submit

```json
{
    "details": {
        "articles": [
            {
                "code": "OTHER.MEASURE.PIECES",
                "quantity": 5
            }
        ]
    },
    "kind": 0,
    "hasErrors": false,
    "errors": [],
    "action": "submit"
}
```

| Parameter | Type     | Description                |
| --------- | -------- | -------------------------- |
| `articles` | `object[]` | list of selected articles |
| `articles[].code` | `string` | code |
| `articles[].quantity` | `int` | quantity |

Possible errors that can occur:
- error.session.session_expired
- error.articles.articles_requires_at_least_1_item
- error.articles.article_invalid
- error.employees.no_valid_skills"
    

## Widget step: Address
Kind = 1

### Action: autocomplete

- Works only on dutch addresses.
- Non-blocking action, full address fields are visible in case of invalid address

```json
{
    "details": {
        "request": {
            "streetNumber": "51",
            "zip": "8011CA"
        },
        "response": {
            "address": {
                "streetName": "Westerlaan",
                "streetNumber": "51",
                "addition": null,
                "zipCode": "8011CA",
                "cityName": "Zwolle",
                "country_ISO3166_1_2": "NL",
            },
            "isValid": true
        }
    },
    "kind": 1,
    "hasErrors": false,
    "errors": [],
    "action": "autocomplete"
}
```

| Parameter | Type     | Description                |
| --------- | -------- | -------------------------- |
| `request` | `object` | inserted address info |
| `request.streetNumber` | `string` | streetNumber |
| `request.zip` | `string` | zip |
| `response` | `object or null` | received info |
| `response.address.isValid` | `boolean` | if address can be found |
| `response.address` | `object or null` | address info, null when isValid is false |
| `response.address.streetName` | `string` | street name|
| `response.address.streetNumber` | `string` | street number |
| `response.address.addition` | `string` | addition |
| `response.address.zipCode` | `string` | zip |
| `response.address.cityName` | `string` | city |
| `response.address.country_ISO3166_1_2` | `string` | country code |

Possible errors that can occur:
- error.session.session_expired
- error.address.address_invalid
    

### Action: branch

```json
{
    "details": {
        "licenseeId": 999
    },
    "kind": 1,
    "hasErrors": false,
    "errors": [],
    "action": "branch"
}
```

| Parameter | Type     | Description                |
| --------- | -------- | -------------------------- |
| `licenseeId` | `int` | branch id |

### Action: submit

```json
{
    "details": {
        "request": {
            "streetNumber": "51",
            "zip": "8011",
            "streetName": "Westerlaan",
            "city": "Zwolle",
            "licenseeId": null
        },
        "response": {
            "streetName": "Westerlaan",
            "streetNumber": "51",
            "addition": null,
            "zipCode": "8011 CA",
            "cityName": "Zwolle",
            "country_ISO3166_1_2": "nl"
        }
    },
    "kind": 1,
    "hasErrors": false,
    "errors": [],
    "action": "submit"
}
```

| Parameter | Type     | Description                |
| --------- | -------- | -------------------------- |
| `request` | `object` | inserted address info |
| `request.streetNumber` | `string` | street number |
| `request.streetName` | `string` | street name |
| `request.zip` | `string` | zip |
| `request.city` | `string` | city |
| `request.licenseeId` | `int or null` | branch id |
| `response` | `object or null` | received info |
| `response.streetName` | `string` | street name|
| `response.streetNumber` | `string` | street number |
| `response.addition` | `string` | addition |
| `response.zipCode` | `string` | zip |
| `response.cityName` | `string` | city |
| `response.country_ISO3166_1_2` | `string` | country code |

Possible errors that can occur:
- error.session.session_expired
- error.address.address_invalid
- error.address.address_difference_detection
- error.address.address_difference_detection.zip
- error.address.address_difference_detection.street_name
- error.address.address_difference_detection.street_number
- error.address.address_difference_detection.city
- error.worklocation.none_in_area
- error.worklocation.none_in_max_distance
        

## Widget step: Schedule
Kind = 3

### Action: set_time

```json
{
    "details": {
        "time": "2022-12-28T12:00:00Z"
    },
    "kind": 2,
    "hasErrors": false,
    "errors": [],
    "action": "set_time"
}
```

| Parameter | Type     | Description                |
| --------- | -------- | -------------------------- |
| `time` | `DateTime` | selected date and time |

### Action: next_range

```json
{
    "details": null,
    "kind": 2,
    "hasErrors": false,
    "errors": [],
    "action": "next_range"
}
```

### Action: previous_range

```json
{
    "details": null,
    "kind": 2,
    "hasErrors": false,
    "errors": [],
    "action": "previous_range"
}
```

### Action: submit

```json
{
    "details": {
        "firstName": "John",
        "middleName": "",
        "lastName": "Doe",
        "emailAddress": "johndoe@decoloop.com",
        "phoneNumber": "0612345678",
        "mobilePhoneNumber": "",
        "languageAbbreviation": "nl",
        "remark": "Extra info"
    },
    "kind": 3,
    "hasErrors": false,
    "errors": [],
    "action": "submit"
}
```

| Parameter | Type     | Description                |
| --------- | -------- | -------------------------- |
| `firstName` | `string` |  |
| `middleName` | `string` |  |
| `lastName` | `string` |  |
| `emailAddress` | `string` |  |
| `phoneNumber` | `string` |  |
| `mobilePhoneNumber` | `string` | |
| `languageAbbreviation` | `string` |  |
| `remark` | `string` | |

## Widget step: Confirm
Kind = 4

### Action: submit

```json
{
    "details": {
        "reference": "1010.00125"
    },
    "kind": 4,
    "hasErrors": false,
    "errors": [],
    "action": "submit"
}
```

| Parameter | Type     | Description                |
| --------- | -------- | -------------------------- |
| `reference` | `string` | received reference number |

Possible errors that can occur:
- error.session_expired
- error.dateslot.invalid_timeslot
- error.unknown.unknown
    

## Generic action: previous
Available in each step
```json
{
    "details": null,
    "kind": 1,
    "hasErrors": false,
    "errors": [],
    "action": "previous"
}
```

---
_Source: https://npm.io/package/@decoloop/planner · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._