@vonage/vivid-react/v3/VwcDateRangePicker/index.js

Vivid wrapped for easy React usage & IDE autocomplete support & typescript typings

/*
* DO NOT EDIT THIS FILE. IT IS GENERATED
*/
/*
Code in this file were generated using following JSON:
{
 "kind": "class",
 "description": "",
 "name": "DateRangePicker",
 "slots": [
  {
   "description": "Describes how to use the date-range-picker. Alternative to the `helper-text` attribute.",
   "name": "helper-text"
  }
 ],
 "members": [
  {
   "kind": "field",
   "name": "initialStart",
   "type": {
    "text": "string"
   },
   "default": "''",
   "description": "The initial start value. This value sets the `start` property\nonly when the `start` property has not been explicitly set."
  },
  {
   "kind": "field",
   "name": "initialEnd",
   "type": {
    "text": "string"
   },
   "default": "''",
   "description": "The initial end value. This value sets the `end` property\nonly when the `end` property has not been explicitly set."
  },
  {
   "kind": "field",
   "name": "#isInternalValueUpdate",
   "privacy": "private",
   "type": {
    "text": "boolean"
   },
   "default": "false"
  },
  {
   "kind": "field",
   "name": "start",
   "type": {
    "text": "string"
   },
   "default": "''",
   "description": "The start value of the date range."
  },
  {
   "kind": "field",
   "name": "end",
   "type": {
    "text": "string"
   },
   "default": "''",
   "description": "The end value of the date range."
  },
  {
   "kind": "field",
   "name": "currentStart",
   "type": {
    "text": "string"
   },
   "description": "The current start value of the element. This property serves as a mechanism\nto set the `start` property through both property assignment and the\n.setAttribute() method. This is useful for setting the field's value\nin UI libraries that bind data through the .setAttribute() API\nand don't support IDL attribute binding."
  },
  {
   "kind": "field",
   "name": "currentEnd",
   "type": {
    "text": "string"
   },
   "description": "The current end value of the element. This property serves as a mechanism\nto set the `end` property through both property assignment and the\n.setAttribute() method. This is useful for setting the field's value\nin UI libraries that bind data through the .setAttribute() API\nand don't support IDL attribute binding."
  },
  {
   "kind": "method",
   "name": "#updateValues",
   "parameters": [
    {
     "name": "range",
     "type": {
      "text": "Partial<DateRange>"
     }
    }
   ]
  },
  {
   "kind": "method",
   "name": "#handleChangedValues"
  },
  {
   "kind": "method",
   "name": "#updateFormValue"
  },
  {
   "kind": "method",
   "name": "#getVisibleRange",
   "return": {
    "type": {
     "text": "Partial<DateRange>"
    }
   }
  },
  {
   "kind": "field",
   "name": "min",
   "type": {
    "text": "string"
   },
   "description": "The earliest accepted date.",
   "privacy": "public",
   "default": "''",
   "inheritedFrom": {
    "name": "MinMaxCalendarPicker",
    "module": "src/shared/picker-field/mixins/min-max-calendar-picker.ts"
   }
  },
  {
   "kind": "field",
   "name": "max",
   "type": {
    "text": "string"
   },
   "description": "The latest accepted date.",
   "privacy": "public",
   "default": "''",
   "inheritedFrom": {
    "name": "MinMaxCalendarPicker",
    "module": "src/shared/picker-field/mixins/min-max-calendar-picker.ts"
   }
  },
  {
   "kind": "method",
   "name": "#isMonthAfterValidRange",
   "parameters": [
    {
     "name": "month",
     "type": {
      "text": "Month"
     }
    }
   ],
   "inheritedFrom": {
    "name": "CalendarPicker",
    "module": "src/shared/picker-field/mixins/calendar-picker.ts"
   }
  },
  {
   "kind": "method",
   "name": "#isMonthBeforeValidRange",
   "parameters": [
    {
     "name": "month",
     "type": {
      "text": "Month"
     }
    }
   ],
   "inheritedFrom": {
    "name": "CalendarPicker",
    "module": "src/shared/picker-field/mixins/calendar-picker.ts"
   }
  },
  {
   "kind": "field",
   "name": "value",
   "type": {
    "text": "string"
   },
   "description": "The current value of the element.",
   "default": "''",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "readOnly",
   "type": {
    "text": "boolean"
   },
   "default": "false",
   "description": "Whether the date-picker is readonly.",
   "privacy": "public",
   "inheritedFrom": {
    "name": "PickerField",
    "module": "src/shared/picker-field/picker-field.ts"
   }
  },
  {
   "kind": "field",
   "name": "#onFocusIn",
   "privacy": "private",
   "inheritedFrom": {
    "name": "PickerField",
    "module": "src/shared/picker-field/picker-field.ts"
   }
  },
  {
   "kind": "field",
   "name": "#onFocusOut",
   "privacy": "private",
   "inheritedFrom": {
    "name": "PickerField",
    "module": "src/shared/picker-field/picker-field.ts"
   }
  },
  {
   "kind": "field",
   "name": "#localeChangeHandler",
   "privacy": "private",
   "type": {
    "text": "object"
   },
   "default": "{\n\t\thandleChange: () => {\n\t\t\tthis._updatePresentationValue();\n\t\t},\n\t}",
   "inheritedFrom": {
    "name": "PickerField",
    "module": "src/shared/picker-field/picker-field.ts"
   }
  },
  {
   "kind": "field",
   "name": "#localeChangeObserver",
   "privacy": "private",
   "type": {
    "text": "BindingObserver"
   },
   "inheritedFrom": {
    "name": "PickerField",
    "module": "src/shared/picker-field/picker-field.ts"
   }
  },
  {
   "kind": "method",
   "name": "#startObservingLocaleChanges",
   "inheritedFrom": {
    "name": "PickerField",
    "module": "src/shared/picker-field/picker-field.ts"
   }
  },
  {
   "kind": "method",
   "name": "#stopObservingLocaleChanges",
   "inheritedFrom": {
    "name": "PickerField",
    "module": "src/shared/picker-field/picker-field.ts"
   }
  },
  {
   "kind": "field",
   "name": "#dismissOnClickOutside",
   "privacy": "private",
   "inheritedFrom": {
    "name": "PickerField",
    "module": "src/shared/picker-field/picker-field.ts"
   }
  },
  {
   "kind": "method",
   "name": "#openPopupIfPossible",
   "inheritedFrom": {
    "name": "PickerField",
    "module": "src/shared/picker-field/picker-field.ts"
   }
  },
  {
   "kind": "field",
   "name": "helperText",
   "type": {
    "text": "string | undefined"
   },
   "description": "Provides additional information to help the user enter the correct information.\nTo add HTML to the helper text, use the helper-text slot instead.",
   "privacy": "public",
   "inheritedFrom": {
    "name": "WithFeedback",
    "module": "src/shared/feedback/mixins.ts"
   }
  },
  {
   "kind": "field",
   "name": "errorText",
   "type": {
    "text": "string | undefined"
   },
   "description": "Provides a custom error message. Any current error state will be overridden.",
   "privacy": "public",
   "inheritedFrom": {
    "name": "WithErrorText",
    "module": "src/shared/patterns/form-elements/with-error-text.ts"
   }
  },
  {
   "kind": "field",
   "name": "#blockValidateCalls",
   "privacy": "private",
   "type": {
    "text": "boolean"
   },
   "default": "false",
   "inheritedFrom": {
    "name": "WithErrorText",
    "module": "src/shared/patterns/form-elements/with-error-text.ts"
   }
  },
  {
   "kind": "field",
   "name": "#originalValidateFn",
   "privacy": "private",
   "type": {
    "text": "() => void"
   },
   "inheritedFrom": {
    "name": "WithErrorText",
    "module": "src/shared/patterns/form-elements/with-error-text.ts"
   }
  },
  {
   "kind": "method",
   "name": "#forceCustomError",
   "parameters": [
    {
     "name": "errorMessage",
     "type": {
      "text": "string"
     }
    }
   ],
   "inheritedFrom": {
    "name": "WithErrorText",
    "module": "src/shared/patterns/form-elements/with-error-text.ts"
   }
  },
  {
   "kind": "method",
   "name": "#clearCustomErrorAndRevalidate",
   "inheritedFrom": {
    "name": "WithErrorText",
    "module": "src/shared/patterns/form-elements/with-error-text.ts"
   }
  },
  {
   "kind": "field",
   "name": "validate",
   "inheritedFrom": {
    "name": "WithErrorText",
    "module": "src/shared/patterns/form-elements/with-error-text.ts"
   }
  },
  {
   "kind": "field",
   "name": "label",
   "type": {
    "text": "string | undefined"
   },
   "description": "The label for the form element.",
   "inheritedFrom": {
    "name": "FormElement",
    "module": "src/shared/patterns/form-elements/form-element.ts"
   }
  },
  {
   "kind": "field",
   "name": "#handleInvalidEvent",
   "privacy": "private",
   "inheritedFrom": {
    "name": "FormElement",
    "module": "src/shared/patterns/form-elements/form-element.ts"
   }
  },
  {
   "kind": "field",
   "name": "validity",
   "type": {
    "text": "ValidityState"
   },
   "description": "Returns the validity state of the element",
   "readonly": true,
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "form",
   "type": {
    "text": "HTMLFormElement | null"
   },
   "description": "Retrieve a reference to the associated form.\nReturns null if not associated to any form.",
   "readonly": true,
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "validationMessage",
   "type": {
    "text": "string"
   },
   "description": "Retrieve the localized validation message,\nor custom validation message if set.",
   "readonly": true,
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "willValidate",
   "type": {
    "text": "boolean"
   },
   "description": "Whether the element will be validated when the\nform is submitted",
   "readonly": true,
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "labels",
   "type": {
    "text": "ReadonlyArray<Node>"
   },
   "description": "A reference to all associated label elements",
   "readonly": true,
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "currentValue",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "initialValue",
   "type": {
    "text": "string"
   },
   "description": "The default value of the element. This value sets the `value` property\nonly when the `value` property has not been explicitly set.",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "disabled",
   "type": {
    "text": "boolean"
   },
   "default": "false",
   "description": "Sets the element's disabled state. A disabled element will not be included during form submission.",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "name",
   "type": {
    "text": "string"
   },
   "description": "The name of the element. This element's value will be surfaced during form submission under the provided name.",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "required",
   "type": {
    "text": "boolean"
   },
   "description": "Require the field to be completed prior to form submission.",
   "default": "false",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "method",
   "name": "checkValidity",
   "return": {
    "type": {
     "text": "boolean"
    }
   },
   "description": "Return the current validity of the element.",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "method",
   "name": "reportValidity",
   "return": {
    "type": {
     "text": "boolean"
    }
   },
   "description": "Return the current validity of the element.\nIf false, fires an invalid event at the element.",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "kind": "field",
   "name": "VIVID_VERSION",
   "static": true,
   "default": "__PACKAGE_VERSION__",
   "description": "The current version of the Vivid library, which is useful for debugging.\nIt can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.",
   "type": {
    "text": "string"
   },
   "inheritedFrom": {
    "name": "VividElement",
    "module": "src/shared/foundation/vivid-element/vivid-element.ts"
   }
  },
  {
   "kind": "field",
   "name": "componentName",
   "type": {
    "text": "string"
   },
   "static": true,
   "description": "Core component name, without prefix",
   "inheritedFrom": {
    "name": "VividElement",
    "module": "src/shared/foundation/vivid-element/vivid-element.ts"
   }
  }
 ],
 "events": [
  {
   "type": {
    "text": "CustomEvent<undefined>"
   },
   "description": "Event emitted when the start value changes",
   "name": "input:start"
  },
  {
   "type": {
    "text": "CustomEvent<undefined>"
   },
   "description": "Event emitted when the end value changes",
   "name": "input:end"
  },
  {
   "type": {
    "text": "CustomEvent<undefined>"
   },
   "description": "Emitted when either the start or end value changes",
   "name": "input"
  },
  {
   "type": {
    "text": "CustomEvent<undefined>"
   },
   "description": "Emitted when either the start or end value changes",
   "name": "change"
  }
 ],
 "attributes": [
  {
   "name": "start",
   "type": {
    "text": "string"
   },
   "default": "''",
   "description": "The initial start value. This value sets the `start` property\nonly when the `start` property has not been explicitly set.",
   "fieldName": "initialStart"
  },
  {
   "name": "end",
   "type": {
    "text": "string"
   },
   "default": "''",
   "description": "The initial end value. This value sets the `end` property\nonly when the `end` property has not been explicitly set.",
   "fieldName": "initialEnd"
  },
  {
   "name": "current-start",
   "type": {
    "text": "string"
   },
   "description": "The current start value of the element. This property serves as a mechanism\nto set the `start` property through both property assignment and the\n.setAttribute() method. This is useful for setting the field's value\nin UI libraries that bind data through the .setAttribute() API\nand don't support IDL attribute binding.",
   "fieldName": "currentStart"
  },
  {
   "name": "current-end",
   "type": {
    "text": "string"
   },
   "description": "The current end value of the element. This property serves as a mechanism\nto set the `end` property through both property assignment and the\n.setAttribute() method. This is useful for setting the field's value\nin UI libraries that bind data through the .setAttribute() API\nand don't support IDL attribute binding.",
   "fieldName": "currentEnd"
  },
  {
   "name": "min",
   "type": {
    "text": "string"
   },
   "description": "The earliest accepted date.",
   "default": "''",
   "fieldName": "min",
   "inheritedFrom": {
    "name": "MinMaxCalendarPicker",
    "module": "src/shared/picker-field/mixins/min-max-calendar-picker.ts"
   }
  },
  {
   "name": "max",
   "type": {
    "text": "string"
   },
   "description": "The latest accepted date.",
   "default": "''",
   "fieldName": "max",
   "inheritedFrom": {
    "name": "MinMaxCalendarPicker",
    "module": "src/shared/picker-field/mixins/min-max-calendar-picker.ts"
   }
  },
  {
   "name": "readonly",
   "type": {
    "text": "boolean"
   },
   "default": "false",
   "description": "Whether the date-picker is readonly.",
   "fieldName": "readOnly",
   "inheritedFrom": {
    "name": "PickerField",
    "module": "src/shared/picker-field/picker-field.ts"
   }
  },
  {
   "name": "helper-text",
   "type": {
    "text": "string | undefined"
   },
   "description": "Provides additional information to help the user enter the correct information.\nTo add HTML to the helper text, use the helper-text slot instead.",
   "fieldName": "helperText",
   "inheritedFrom": {
    "name": "WithFeedback",
    "module": "src/shared/feedback/mixins.ts"
   }
  },
  {
   "name": "error-text",
   "type": {
    "text": "string | undefined"
   },
   "description": "Provides a custom error message. Any current error state will be overridden.",
   "fieldName": "errorText",
   "inheritedFrom": {
    "name": "WithErrorText",
    "module": "src/shared/patterns/form-elements/with-error-text.ts"
   }
  },
  {
   "name": "label",
   "type": {
    "text": "string | undefined"
   },
   "description": "The label for the form element.",
   "fieldName": "label",
   "inheritedFrom": {
    "name": "FormElement",
    "module": "src/shared/patterns/form-elements/form-element.ts"
   }
  },
  {
   "name": "current-value",
   "type": {
    "text": "string"
   },
   "description": "The current value of the element.",
   "fieldName": "value",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "name": "value",
   "type": {
    "text": "string"
   },
   "description": "The default value of the element. This value sets the `value` property\nonly when the `value` property has not been explicitly set.",
   "fieldName": "initialValue",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "name": "disabled",
   "type": {
    "text": "boolean"
   },
   "default": "false",
   "description": "Sets the element's disabled state. A disabled element will not be included during form submission.",
   "fieldName": "disabled",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "name": "name",
   "type": {
    "text": "string"
   },
   "description": "The name of the element. This element's value will be surfaced during form submission under the provided name.",
   "fieldName": "name",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  },
  {
   "name": "required",
   "type": {
    "text": "boolean"
   },
   "description": "Require the field to be completed prior to form submission.",
   "default": "false",
   "fieldName": "required",
   "inheritedFrom": {
    "name": "FormAssociated",
    "module": "src/shared/foundation/form-associated/form-associated.ts"
   }
  }
 ],
 "mixins": [
  {
   "name": "MinMaxCalendarPicker",
   "module": "/src/shared/picker-field/mixins/min-max-calendar-picker"
  },
  {
   "name": "CalendarPicker",
   "module": "/src/shared/picker-field/mixins/calendar-picker"
  }
 ],
 "superclass": {
  "name": "PickerField",
  "module": "/src/shared/picker-field/picker-field"
 },
 "vividComponent": {
  "public": true,
  "name": "date-range-picker",
  "vueModels": [
   {
    "name": "start",
    "propName": "start",
    "eventNames": [
     "input:start"
    ],
    "valueMapping": "event.currentTarget.start"
   },
   {
    "name": "end",
    "propName": "end",
    "eventNames": [
     "input:end"
    ],
    "valueMapping": "event.currentTarget.end"
   }
  ]
 }
}
*/
import wrapper from '@vonage/vivid-react-wrapper'
import { registerDateRangePicker } from '@vonage/vivid'

registerDateRangePicker('vvd3')

const VwcDateRangePicker = wrapper(`vvd3-date-range-picker`,  {
    events: [{"name":"change","propName":"onChange"},{"name":"input","propName":"onInput"},{"name":"input:end","propName":"onInput:end"},{"name":"input:start","propName":"onInput:start"}],
    attributes: [],
    properties: ['initialStart', 'initialEnd', 'start', 'end', 'currentStart', 'currentEnd', 'min', 'max', 'value', 'readOnly', 'helperText', 'errorText', 'validate', 'label', 'currentValue', 'initialValue', 'disabled', 'name', 'required', 'VIVID_VERSION', 'componentName']
})

VwcDateRangePicker.displayName = 'VwcDateRangePicker'

export default VwcDateRangePicker