import React from 'react'; /** * * It is a component which allows setting working hours for the week. * * To use this component, you should install @bigbinary/neeto-time-zones package. * * @example * * yarn add @bigbinary/neeto-time-zones * @endexample *  * * How to Reset Form from outside Schedule Component: * * How to get the form errors from outside Schedule Component: * * This is the data structure for the periods prop: * * @example * * const periods = { * sunday: [], * monday: [ * { * id: "cf329f59-cbcb-445b-b567-ad04a2813b8c", * periodableType: "Availability", * periodableId: "2b9d8d31-8928-4f8e-87d2-8e8989b5be72", * wday: "monday", * period: null, * createdAt: "2022-10-31T07:07:44.796Z", * updatedAt: "2022-10-31T07:07:44.796Z", * startTime: "09:00 AM", * endTime: "05:00 PM", * }, * { * id: "9ad79a58-1a0f-4ee7-b540-d86d55765874", * periodableType: "Availability", * periodableId: "2b9d8d31-8928-4f8e-87d2-8e8989b5be72", * wday: "monday", * period: null, * createdAt: "2022-10-31T07:07:44.801Z", * updatedAt: "2022-10-31T07:07:44.801Z", * startTime: "06:00 PM", * endTime: "07:00 PM", * }, * ], * tuesday: [ * { * id: "8cd6d2c6-50f5-436f-89f5-35db1a4c44bb", * periodableType: "Availability", * periodableId: "2b9d8d31-8928-4f8e-87d2-8e8989b5be72", * wday: "tuesday", * period: null, * createdAt: "2022-10-31T07:07:44.806Z", * updatedAt: "2022-10-31T07:07:44.806Z", * startTime: "09:00 AM", * endTime: "05:00 PM", * }, * ], * wednesday: [ * { * id: "1ea6c1b7-2fdb-4b2b-b35a-dc75f58cb84d", * periodableType: "Availability", * periodableId: "2b9d8d31-8928-4f8e-87d2-8e8989b5be72", * wday: "wednesday", * period: null, * createdAt: "2022-10-31T07:07:44.810Z", * updatedAt: "2022-10-31T07:07:44.810Z", * startTime: "09:00 AM", * endTime: "05:00 PM", * }, * ], * thursday: [ * { * id: "a9b5ea22-4765-4db2-b0f8-78aa1dd458f2", * periodableType: "Availability", * periodableId: "2b9d8d31-8928-4f8e-87d2-8e8989b5be72", * wday: "thursday", * period: null, * createdAt: "2022-10-31T07:07:44.812Z", * updatedAt: "2022-10-31T07:07:44.812Z", * startTime: "09:00 AM", * endTime: "05:00 PM", * }, * ], * friday: [ * { * id: "b1e4852c-d91f-419e-bb95-1ead12da69b2", * periodableType: "Availability", * periodableId: "2b9d8d31-8928-4f8e-87d2-8e8989b5be72", * wday: "friday", * period: null, * createdAt: "2022-10-31T07:07:44.823Z", * updatedAt: "2022-10-31T07:07:44.823Z", * startTime: "09:00 AM", * endTime: "05:00 PM", * }, * ], * saturday: [], * }; * @endexample * @example * * import { useState } from "react"; * import Schedule from "@bigbinary/neeto-molecules/Schedule"; * import { periods } from "constants"; * * const App = () => { * const [isEditing, setIsEditing] = useState(false); * * return ( *