{"id":15367231,"url":"https://github.com/arfedulov/semantic-ui-calendar-react","last_synced_at":"2025-05-16T08:06:51.319Z","repository":{"id":32417049,"uuid":"132748321","full_name":"arfedulov/semantic-ui-calendar-react","owner":"arfedulov","description":"Datepicker react component based on semantic-ui-react components ","archived":false,"fork":false,"pushed_at":"2024-04-11T19:49:46.000Z","size":2992,"stargazers_count":258,"open_issues_count":80,"forks_count":92,"subscribers_count":8,"default_branch":"master","last_synced_at":"2025-05-09T02:47:58.570Z","etag":null,"topics":["datepicker","react","semantic-ui-react"],"latest_commit_sha":null,"homepage":"https://arfedulov.github.io/semantic-ui-calendar-react/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/arfedulov.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-05-09T11:41:09.000Z","updated_at":"2025-01-01T09:27:28.000Z","dependencies_parsed_at":"2024-06-18T12:39:00.952Z","dependency_job_id":"6240078c-2e68-4298-b836-039078d0d7e7","html_url":"https://github.com/arfedulov/semantic-ui-calendar-react","commit_stats":{"total_commits":182,"total_committers":28,"mean_commits":6.5,"dds":"0.17032967032967028","last_synced_commit":"b76efe860d1e7f0fab7af469a94ab366d621899e"},"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arfedulov%2Fsemantic-ui-calendar-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arfedulov%2Fsemantic-ui-calendar-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arfedulov%2Fsemantic-ui-calendar-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/arfedulov%2Fsemantic-ui-calendar-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/arfedulov","download_url":"https://codeload.github.com/arfedulov/semantic-ui-calendar-react/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254453653,"owners_count":22073617,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["datepicker","react","semantic-ui-react"],"created_at":"2024-10-01T13:23:44.709Z","updated_at":"2025-05-16T08:06:46.307Z","avatar_url":"https://github.com/arfedulov.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":":tada: Starting with version 0.8.0 it's css free.\n:warning: Uncompatible with *semantic-ui-react* version 0.83.0\n\n# semantic-ui-calendar-react\nDatepicker react component based on semantic-ui-react components\n\nMy intention was to create something that looks like this https://github.com/mdehoog/Semantic-UI-Calendar.\n\nHere you can find a live example https://arfedulov.github.io/semantic-ui-calendar-react\n\n# installation\n\n## npm\n```\nnpm i semantic-ui-calendar-react\n```\n\n## CDN\n\n```html\n\u003cscript src=\"https://cdn.jsdelivr.net/npm/semantic-ui-calendar-react@latest/dist/umd/semantic-ui-calendar-react.js\"\u003e\u003c/script\u003e\n```\n\nThen you can access calendar components from your scripts like this:\n\n```js\nconst { DateInput } = SemanticUiCalendarReact;\n```\n\n# usage\nLet's create a form that needs date-related input fields.\n\nImport input components:\n\n```javascript\nimport {\n  DateInput,\n  TimeInput,\n  DateTimeInput,\n  DatesRangeInput\n} from 'semantic-ui-calendar-react';\n```\nThen build a form:\n\n```javascript\nclass DateTimeForm extends React.Component {\n  constructor(props) {\n    super(props);\n\n    this.state = {\n      date: '',\n      time: '',\n      dateTime: '',\n      datesRange: ''\n    };\n  }\n\n  handleChange = (event, {name, value}) =\u003e {\n    if (this.state.hasOwnProperty(name)) {\n      this.setState({ [name]: value });\n    }\n  }\n\n  render() {\n    return (\n      \u003cForm\u003e\n        \u003cDateInput\n          name=\"date\"\n          placeholder=\"Date\"\n          value={this.state.date}\n          iconPosition=\"left\"\n          onChange={this.handleChange}\n        /\u003e\n        \u003cTimeInput\n          name=\"time\"\n          placeholder=\"Time\"\n          value={this.state.time}\n          iconPosition=\"left\"\n          onChange={this.handleChange}\n        /\u003e\n        \u003cDateTimeInput\n          name=\"dateTime\"\n          placeholder=\"Date Time\"\n          value={this.state.dateTime}\n          iconPosition=\"left\"\n          onChange={this.handleChange}\n        /\u003e\n        \u003cDatesRangeInput\n          name=\"datesRange\"\n          placeholder=\"From - To\"\n          value={this.state.datesRange}\n          iconPosition=\"left\"\n          onChange={this.handleChange}\n        /\u003e\n      \u003c/Form\u003e\n    );\n  }\n}\n```\n\nAlso you can build a form with inline pickers as inputs. Just set ``inline`` prop on input element and it will be displayed as inline picker:\n\n```javascript\nclass DateTimeFormInline extends React.Component {\n handleChange = (event, {name, value}) =\u003e {\n    if (this.state.hasOwnProperty(name)) {\n      this.setState({ [name]: value });\n    }\n  }\n\n  render() {\n    return (\n      \u003cForm\u003e\n        \u003cDateInput\n          inline\n          name='date'\n          value={this.state.date}\n          onChange={this.handleDateChange}\n        /\u003e\n      \u003c/Form\u003e\n    );\n  }\n}\n```\n\nor you can make it cleanable in the following way,\n\n```javascript\nclass ClearableDateTimeForm extends React.Component {\n  handleChange = (event, {name, value}) =\u003e {\n    if (this.state.hasOwnProperty(name)) {\n      this.setState({ [name]: value });\n    }\n  }\n\n  render() {\n    return (\n      \u003cForm\u003e\n        \u003cDateInput\n          clearable\n          clearIcon={\u003cIcon name=\"remove\" color=\"red\" /\u003e}\n          name=\"date\"\n          value={this.state.date}\n          onChange={this.handleDateChange}\n        /\u003e\n      \u003c/Form\u003e\n    );\n  }\n}\n```\n\n# Locales support\n\nSince ``semantic-ui-calendar-react`` uses moment.js it supports locales.\nYou can set locale globally:\n\n```javascript\nimport moment from 'moment';\nimport 'moment/locale/ru';\n```\n\nYou can also set locale for *Input component locally using ``localization`` prop.\n\n```jsx\n\u003cDateInput localization='ru' /\u003e\n```\n\n# Supported elements\n\n### DateInput\n\n| Prop | Description |\n| -----| ------------|\n| all that can be used with SUIR Form.Input | |\n| ``value`` | {string} Currently selected value; must have format ``dateFormat``. |\n| ``dateFormat``| {string} Date formatting string. You can use here anything that can be passed to ``moment().format``. Default: ``DD-MM-YYYY``|\n| ``popupPosition``| {string} One of ['top left', 'top right', 'bottom left', 'bottom right', 'right center', 'left center', 'top center', 'bottom center']. Default: ``top left``|\n| ``inline`` | {bool} If ``true`` inline picker displayed. Default: ``false`` |\n| ``startMode`` | {string} Display mode to start. One of ['year', 'month', 'day']. Default: ``day``   |\n| ``closable`` | {bool} If true, popup closes after selecting a date   |\n| ``initialDate`` | {string\\|moment\\|Date} Date on which calendar opens. By default it opens on today's date. (Do not be confused by property name. For setting some default value just set into `value` prop). |\n| ``disable`` | {string\\|moment\\|Date\\|string[]\\|moment[]\\|Date[]} Date or list of dates that are displayed as disabled |\n| ``enable`` | {string[]\\|moment[]\\|Date[]} Date or list of dates that are enabled (the rest are disabled) |\n| ``maxDate`` | {string\\|moment} Maximum date that can be selected |\n| ``minDate`` | {string\\|moment} Minimum date that can be selected |\n| ``inlineLabel`` | {bool} A field can have its label next to instead of above it. |\n| ``closeOnMouseLeave`` | {bool} Should close when cursor leaves calendar popup. Default: ``true`` |\n| ``preserveViewMode`` | {bool} Preserve last mode (`day`, `hour`, `minute`) each time user opens dialog. Default ``true`` |\n| ``mountNode`` | {any} The node where the picker should mount. |\n| ``onClear`` | {func} Called after clear icon has clicked. |\n| ``clearable`` | {boolean} Using the clearable setting will let users remove their selection from a calendar. |\n| ``clearIcon`` | {any} Optional Icon to display inside the clearable Input. |\n| ``pickerWidth`` | {string} Optional width value for picker (any string value that could be assigned to `style.width`). |\n| ``pickerStyle`` | {object} Optional `style` object for picker. |\n| ``duration`` | {number} Optional duration of the CSS transition animation in milliseconds. Default: `200` |\n| ``animation`` | {string} Optional named animation event to used. Must be defined in CSS. Default: `'scale'` |\n| ``marked`` | {moment\\|Date\\|moment[]\\|Date[]} Date or list of dates that are displayed as marked |\n| ``markColor`` | {string\\|SemanticCOLORs} String specifying the mark color. Must be one of the Semantic UI colors |\n| ``localization`` | {string} Sets Moment date locale locally for this component. |\n| ``icon`` | {string\\|false} icon to display inside Input. |\n| ``iconPosition`` | {'left'\\|'right'} icon position inside Input. Default: 'right'. |\n| ``hideMobileKeyboard`` | {bool} Try to prevent mobile keyboard appearing. |\n\n### TimeInput\n\n| Prop | Description |\n| -----| ------------|\n| all that can be used with SUIR Form.Input | |\n| ``value`` | {string} Currently selected value; must have format ``dateFormat``. |\n| ``popupPosition``| {string} One of ['top left', 'top right', 'bottom left', 'bottom right', 'right center', 'left center', 'top center', 'bottom center']. Default: ``top left``|\n| ``inline`` | {bool} If ``true`` inline picker displayed. Default: ``false`` |\n| ``closable`` | {bool} If true, popup closes after selecting a time   |\n| ``inlineLabel`` | {bool} A field can have its label next to instead of above it. |\n| ``closeOnMouseLeave`` | {bool} Should close when cursor leaves calendar popup. Default: ``true`` |\n| ``timeFormat`` | {string} One of [\"24\", \"AMPM\", \"ampm\"]. Default: ``\"24\"`` |\n| ``disableMinute`` | {bool} If ``true``, minutes picker won't be shown after picking the hour. Default: ``false`` |\n| ``mountNode`` | {any} The node where the picker should mount. |\n| ``onClear`` | {func} Called after clear icon has clicked. |\n| ``clearable`` | {boolean} Using the clearable setting will let users remove their selection from a calendar. |\n| ``clearIcon`` | {any} Optional Icon to display inside the clearable Input. |\n| ``pickerWidth`` | {string} Optional width value for picker (any string value that could be assigned to `style.width`). |\n| ``pickerStyle`` | {object} Optional `style` object for picker. |\n| ``duration`` | {number} Optional duration of the CSS transition animation in milliseconds. Default: `200` |\n| ``animation`` | {string} Optional named animation event to used. Must be defined in CSS. Default: `'scale'` |\n| ``localization`` | {string} Sets Moment date locale locally for this component. |\n| ``icon`` | {string\\|false} icon to display inside Input. |\n| ``iconPosition`` | {'left'\\|'right'} icon position inside Input. Default: 'right'. |\n| ``hideMobileKeyboard`` | {bool} Try to prevent mobile keyboard appearing. |\n\n### DateTimeInput\n\n| Prop | Description |\n| -----| ------------|\n| all that can be used with SUIR Form.Input | |\n| ``value`` | {string} Currently selected value; must have format ``dateFormat``. |\n| ``dateTimeFormat`` | {string} Datetime formatting string for the input's `value`. You can use any string here that can be passed to ``moment().format``. If provided, it overrides ``dateFormat``, ``divider``, and ``timeFormat``. **Note:** this does not affect the formats used to display the pop-up date and time pickers; it only affects the format of the input's `value` field. Default: ``null`` |\n| ``dateFormat``| {string} Date formatting string. You can use any string here that can be passed to ``moment().format``. Default: ``DD-MM-YYYY``. This formats only the date component of the datetime. |\n| ``timeFormat`` | {string} One of [\"24\", \"AMPM\", \"ampm\"]. Default: ``\"24\"`` |\n| ``divider`` | {string} Date and time divider. Default: `` `` |\n| ``disableMinute`` | {bool} If ``true``, minutes picker won't be shown after picking the hour. Default: ``false`` |\n| ``popupPosition``| {string} One of ['top left', 'top right', 'bottom left', 'bottom right', 'right center', 'left center', 'top center', 'bottom center']. Default: ``top left``|\n| ``inline`` | {bool} If ``true`` inline picker displayed. Default: ``false`` |\n| ``startMode`` | {string} Display mode to start. One of ['year', 'month', 'day']. Default: ``day``   |\n| ``closable`` | {bool} If true, popup closes after selecting a date-time   |\n| ``initialDate`` | {string\\|moment\\|Date} Date on which calendar opens. By default it opens on today's date. (Do not be confused by property name. For setting some default value just set into `value` prop). |\n| ``disable`` | {string\\|moment\\|string[]\\|moment[]} Date or list of dates that are displayed as disabled |\n| ``maxDate`` | {string\\|moment} Maximum date that can be selected |\n| ``minDate`` | {string\\|moment} Minimum date that can be selected |\n| ``inlineLabel`` | {bool} A field can have its label next to instead of above it. |\n| ``closeOnMouseLeave`` | {bool} Should close when cursor leaves calendar popup. Default: ``true`` |\n| ``preserveViewMode`` | {bool} Preserve last mode (`day`, `hour`, `minute`) each time user opens dialog. Default ``true`` |\n| ``mountNode`` | {any} The node where the picker should mount. |\n| ``onClear`` | {func} Called after clear icon has clicked. |\n| ``clearable`` | {boolean} Using the clearable setting will let users remove their selection from a calendar. |\n| ``clearIcon`` | {any} Optional Icon to display inside the clearable Input. |\n| ``pickerWidth`` | {string} Optional width value for picker (any string value that could be assigned to `style.width`). |\n| ``pickerStyle`` | {object} Optional `style` object for picker. |\n| ``duration`` | {number} Optional duration of the CSS transition animation in milliseconds. Default: `200` |\n| ``animation`` | {string} Optional named animation event to used. Must be defined in CSS. Default: `'scale'` |\n| ``marked`` | {moment\\|Date\\|moment[]\\|Date[]} Date or list of dates that are displayed as marked |\n| ``markColor`` | {string\\|SemanticCOLORs} String specifying the mark color. Must be one of the Semantic UI colors |\n| ``localization`` | {string} Sets Moment date locale locally for this component. |\n| ``icon`` | {string\\|false} icon to display inside Input. |\n| ``iconPosition`` | {'left'\\|'right'} icon position inside Input. Default: 'right'. |\n| ``hideMobileKeyboard`` | {bool} Try to prevent mobile keyboard appearing. |\n\n### DatesRangeInput\n\n| Prop | Description |\n| -----| ------------|\n| all that can be used with SUIR Form.Input | |\n| ``value`` | {string} Currently selected value; must have format ``dateFormat``. |\n| ``dateFormat``| {string} Date formatting string. You can use here anything that can be passed to ``moment().format``. Default: ``DD.MM.YY``|\n| ``popupPosition``| {string} One of ['top left', 'top right', 'bottom left', 'bottom right', 'right center', 'left center', 'top center', 'bottom center']. Default: ``top left``|\n| ``inline`` | {bool} If ``true`` inline picker displayed. Default: ``false`` |\n| ``closable`` | {bool} If true, popup closes after selecting a dates range   |\n| ``initialDate`` | {string\\|moment\\|Date} Date on which calendar opens. By default it opens on today's date. (Do not be confused by property name. For setting some default value just set into `value` prop). |\n| ``maxDate`` | {string\\|moment} Maximum date that can be selected |\n| ``minDate`` | {string\\|moment} Minimum date that can be selected |\n| ``inlineLabel`` | {bool} A field can have its label next to instead of above it. |\n| ``closeOnMouseLeave`` | {bool} Should close when cursor leaves calendar popup. Default: ``true`` |\n| ``mountNode`` | {any} The node where the picker should mount. |\n| ``onClear`` | {func} Called after clear icon has clicked. |\n| ``clearable`` | {boolean} Using the clearable setting will let users remove their selection from a calendar. |\n| ``clearIcon`` | {any} Optional Icon to display inside the clearable Input. |\n| ``pickerWidth`` | {string} Optional width value for picker (any string value that could be assigned to `style.width`). |\n| ``pickerStyle`` | {object} Optional `style` object for picker. |\n| ``duration`` | {number} Optional duration of the CSS transition animation in milliseconds. Default: `200` |\n| ``animation`` | {string} Optional named animation event to used. Must be defined in CSS. Default: `'scale'` |\n| ``marked`` | {moment\\|Date\\|moment[]\\|Date[]} Date or list of dates that are displayed as marked |\n| ``markColor`` | {string\\|SemanticCOLORs} String specifying the mark color. Must be one of the Semantic UI colors |\n| ``localization`` | {string} Sets Moment date locale locally for this component. |\n| ``icon`` | {string\\|false} icon to display inside Input. |\n| ``iconPosition`` | {'left'\\|'right'} icon position inside Input. Default: 'right'. |\n| ``allowSameEndDate`` | {boolean} Allow end date to be the same as start date. |\n| ``hideMobileKeyboard`` | {bool} Try to prevent mobile keyboard appearing. |\n\n### YearInput\n\n| Prop | Description |\n| -----| ------------|\n| all that can be used with SUIR Form.Input | |\n| ``value`` | {string} Currently selected value; must have format ``dateFormat``. |\n| ``popupPosition``| {string} One of ['top left', 'top right', 'bottom left', 'bottom right', 'right center', 'left center', 'top center', 'bottom center']. Default: ``top left``|\n| ``inline`` | {bool} If ``true`` inline picker displayed. Default: ``false`` |\n| ``closable`` | {bool} If true, popup closes after selecting a year   |\n| ``inlineLabel`` | {bool} A field can have its label next to instead of above it. |\n| ``closeOnMouseLeave`` | {bool} Should close when cursor leaves calendar popup. Default: ``true`` |\n| ``initialDate`` | {string\\|moment\\|Date} Date on which calendar opens. By default it opens on today's date. (Do not be confused by property name. For setting some default value just set into `value` prop). |\n| ``mountNode`` | {any} The node where the picker should mount. |\n| ``onClear`` | {func} Called after clear icon has clicked. |\n| ``clearable`` | {boolean} Using the clearable setting will let users remove their selection from a calendar. |\n| ``clearIcon`` | {any} Optional Icon to display inside the clearable Input. |\n| ``pickerWidth`` | {string} Optional width value for picker (any string value that could be assigned to `style.width`). |\n| ``pickerStyle`` | {object} Optional `style` object for picker. |\n| ``duration`` | {number} Optional duration of the CSS transition animation in milliseconds. Default: `200` |\n| ``animation`` | {string} Optional named animation event to used. Must be defined in CSS. Default: `'scale'` |\n| ``localization`` | {string} Sets Moment date locale locally for this component. |\n| ``icon`` | {string\\|false} icon to display inside Input. |\n| ``iconPosition`` | {'left'\\|'right'} icon position inside Input. Default: 'right'. |\n| ``hideMobileKeyboard`` | {bool} Try to prevent mobile keyboard appearing. |\n\n### MonthInput\n\n| Prop | Description |\n| -----| ------------|\n| all that can be used with SUIR Form.Input | |\n| ``value`` | {string} Currently selected value; must have format ``dateFormat``. |\n| ``popupPosition``| {string} One of ['top left', 'top right', 'bottom left', 'bottom right', 'right center', 'left center', 'top center', 'bottom center']. Default: ``top left``|\n| ``inline`` | {bool} If ``true`` inline picker displayed. Default: ``false`` |\n| ``closable`` | {bool} If true, popup closes after selecting a month   |\n| ``inlineLabel`` | {bool} A field can have its label next to instead of above it. |\n| ``closeOnMouseLeave`` | {bool} Should close when cursor leaves calendar popup. Default: ``true`` |\n| ``dateFormat`` | {string} Moment date formatting string. Default: ``\"MMM\"`` |\n| ``disable`` | {string\\|Moment\\|Date\\|string[]\\|Moment[]\\|Date[]} Date or list of dates that are displayed as disabled. |\n| ``maxDate`` | {string\\|Moment\\|Date\\|string[]\\|Moment[]\\|Date[]} Maximum date that can be selected. |\n| ``minDate`` | {string\\|Moment\\|Date\\|string[]\\|Moment[]\\|Date[]} Minimum date that can be selected. |\n| ``mountNode`` | {any} The node where the picker should mount. |\n| ``onClear`` | {func} Called after clear icon has clicked. |\n| ``clearable`` | {boolean} Using the clearable setting will let users remove their selection from a calendar. |\n| ``clearIcon`` | {any} Optional Icon to display inside the clearable Input. |\n| ``pickerWidth`` | {string} Optional width value for picker (any string value that could be assigned to `style.width`). |\n| ``pickerStyle`` | {object} Optional `style` object for picker. |\n| ``duration`` | {number} Optional duration of the CSS transition animation in milliseconds. Default: `200` |\n| ``animation`` | {string} Optional named animation event to used. Must be defined in CSS. Default: `'scale'` |\n| ``localization`` | {string} Sets Moment date locale locally for this component. |\n| ``icon`` | {string\\|false} icon to display inside Input. |\n| ``iconPosition`` | {'left'\\|'right'} icon position inside Input. Default: 'right'. |\n| ``hideMobileKeyboard`` | {bool} Try to prevent mobile keyboard appearing. |\n\n### MonthRangeInput\n\n| Prop | Description |\n| -----| ------------|\n| all that can be used with SUIR Form.Input | |\n| ``value`` | {string} Currently selected value; must have format ``dateFormat``. |\n| ``popupPosition``| {string} One of ['top left', 'top right', 'bottom left', 'bottom right', 'right center', 'left center', 'top center', 'bottom center']. Default: ``top left``|\n| ``inline`` | {bool} If ``true`` inline picker displayed. Default: ``false`` |\n| ``closable`` | {bool} If true, popup closes after selecting a month   |\n| ``inlineLabel`` | {bool} A field can have its label next to instead of above it. |\n| ``closeOnMouseLeave`` | {bool} Should close when cursor leaves calendar popup. Default: ``true`` |\n| ``dateFormat`` | {string} Moment date formatting string. Default: ``\"MMM\"`` |\n| ``maxDate`` | {string\\|Moment\\|Date\\|string[]\\|Moment[]\\|Date[]} Maximum date that can be selected. |\n| ``minDate`` | {string\\|Moment\\|Date\\|string[]\\|Moment[]\\|Date[]} Minimum date that can be selected. |\n| ``mountNode`` | {any} The node where the picker should mount. |\n| ``onClear`` | {func} Called after clear icon has clicked. |\n| ``clearable`` | {boolean} Using the clearable setting will let users remove their selection from a calendar. |\n| ``clearIcon`` | {any} Optional Icon to display inside the clearable Input. |\n| ``pickerWidth`` | {string} Optional width value for picker (any string value that could be assigned to `style.width`). |\n| ``pickerStyle`` | {object} Optional `style` object for picker. |\n| ``duration`` | {number} Optional duration of the CSS transition animation in milliseconds. Default: `200` |\n| ``animation`` | {string} Optional named animation event to used. Must be defined in CSS. Default: `'scale'` |\n| ``localization`` | {string} Sets Moment date locale locally for this component. |\n| ``icon`` | {string\\|false} icon to display inside Input. |\n| ``iconPosition`` | {'left'\\|'right'} icon position inside Input. Default: 'right'. |\n| ``hideMobileKeyboard`` | {bool} Try to prevent mobile keyboard appearing. |\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farfedulov%2Fsemantic-ui-calendar-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Farfedulov%2Fsemantic-ui-calendar-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Farfedulov%2Fsemantic-ui-calendar-react/lists"}