opening-times.md

OpeningTimes

Source

An input for opening times.

Usage

You should have the chayns-components package installed. If that is not the case already, run

yarn add chayns-components

or

npm i chayns-components

After the chayns-components package is installed, you can import the component and use it with React:

import React from 'react'
import { OpeningTimes } from 'chayns-components';

// ...

<OpeningTimes {...} />

Props

The OpeningTimes-component takes the following props:

Name	Type	Default	Required
times	Array<{ weekDay: number, start: string, end: string, disabled: boolean }>		✓
onChange	function
className	string
style	{ [key: string]: string | number }
forceMobile	boolean	false
hintPosition	enum	OpeningTimes.hintPositions.TOP
hintText	string	''

times

times: Array<{
    weekDay: number;
    start: string;
    end: string;
    disabled: boolean;
}>;

An array of the timespans that are opening hours.

---

onChange

onChange?: function

Called after the user has changed the opening times. Receives the modified times as its first parameter.

---

className

className?: string

A classname string that will be applied to the root container.

---

style

style?: { [key: string]: string | number }

A React style object that will be applied to the root container.

---

forceMobile

forceMobile?: boolean

Wether to force a mobile view.

---

hintPosition

hintPosition?: enum

The hint position. Possible values are OpeningTimes.hintPositions.NONE, OpeningTimes.hintPositions.TOP and OpeningTimes.hintPositions.BOTTOM.

---

hintText

hintText?: string

The text to be shown inside of the hint.