Adding prop reorder exceptions (#1866)

* Adding prop reorder exceptions

* Reworking prop order flag

* Removing unnecessary variable

* Reverting build:backends script changes

* Adding operator

* Adding default positional arg

* Updating docstring function

* Updated radioitems prop order

* Prop order changes for dcc

* Updated DataTable prop order

* Update Checklist prop order

* Updated DataTable prop order

* Update DatePickerSingle, DatePickerRange, Input, Link prop orders

* Re-running tests

* Re-running tests

Author: HammadTheOne

components/dash-core-components/package.json

@@ -25,7 +25,7 @@
     "test:pyimport": "python -m unittest tests/test_dash_import.py",
     "prebuild:js": "cp node_modules/plotly.js/dist/plotly.min.js dash_core_components_base/plotly.min.js",
     "build:js": "webpack --mode production",
-    "build:backends": "dash-generate-components ./src/components dash_core_components -p package-info.json && cp dash_core_components_base/** dash_core_components/ && dash-generate-components ./src/components dash_core_components -p package-info.json --r-prefix 'dcc' --r-suggests 'dash,dashHtmlComponents,jsonlite,plotly' --jl-prefix 'dcc' && black dash_core_components",
+    "build:backends": "dash-generate-components ./src/components dash_core_components -p package-info.json  && cp dash_core_components_base/** dash_core_components/ && dash-generate-components ./src/components dash_core_components -p package-info.json -k RangeSlider,Slider,Dropdown,RadioItems,Checklist,DatePickerSingle,DatePickerRange,Input,Link --r-prefix 'dcc' --r-suggests 'dash,dashHtmlComponents,jsonlite,plotly' --jl-prefix 'dcc' && black dash_core_components",
     "build": "run-s prepublishOnly build:js build:backends",
     "postbuild": "es-check es5 dash_core_components/*.js",
     "build:watch": "watch 'npm run build' src",

components/dash-core-components/src/components/Checklist.react.js

@@ -148,11 +148,11 @@ Checklist.propTypes = {
     ),
 
     /**
-     * The ID of this component, used to identify dash components
-     * in callbacks. The ID needs to be unique across all of the
-     * components in an app.
+     * Indicates whether labelStyle should be inline or not
+     * True: Automatically set { 'display': 'inline-block' } to labelStyle
+     * False: No additional styles are passed into labelStyle.
      */
-    id: PropTypes.string,
+    inline: PropTypes.bool,
 
     /**
      * The class of the container (div)
@@ -186,6 +186,13 @@ Checklist.propTypes = {
      */
     labelClassName: PropTypes.string,
 
+    /**
+     * The ID of this component, used to identify dash components
+     * in callbacks. The ID needs to be unique across all of the
+     * components in an app.
+     */
+    id: PropTypes.string,
+
     /**
      * Dash-assigned callback that gets fired when the value changes.
      */
@@ -237,13 +244,6 @@ Checklist.propTypes = {
      * session: window.sessionStorage, data is cleared once the browser quit.
      */
     persistence_type: PropTypes.oneOf(['local', 'session', 'memory']),
-
-    /**
-     * Indicates whether labelStyle should be inline or not
-     * True: Automatically set { 'display': 'inline-block' } to labelStyle
-     * False: No additional styles are passed into labelStyle.
-     */
-    inline: PropTypes.bool,
 };
 
 Checklist.defaultProps = {

components/dash-core-components/src/components/DatePickerRange.react.js

@@ -27,32 +27,13 @@ export default class DatePickerRange extends Component {
 }
 
 DatePickerRange.propTypes = {
-    /**
-     * The ID of this component, used to identify dash components
-     * in callbacks. The ID needs to be unique across all of the
-     * components in an app.
-     */
-    id: PropTypes.string,
-
     /**
      * Specifies the starting date for the component.
      * Accepts datetime.datetime objects or strings
      * in the format 'YYYY-MM-DD'
      */
     start_date: PropTypes.string,
 
-    /**
-     * The HTML element ID of the start date input field.
-     * Not used by Dash, only by CSS.
-     */
-    start_date_id: PropTypes.string,
-
-    /**
-     * The HTML element ID of the end date input field.
-     * Not used by Dash, only by CSS.
-     */
-    end_date_id: PropTypes.string,
-
     /**
      * Specifies the ending date for the component.
      * Accepts datetime.datetime objects or strings
@@ -82,12 +63,20 @@ DatePickerRange.propTypes = {
     disabled_days: PropTypes.arrayOf(PropTypes.string),
 
     /**
-     * Specifies the month that is initially presented when the user
-     * opens the calendar. Accepts datetime.datetime objects or strings
-     * in the format 'YYYY-MM-DD'
-     *
+     * Specifies a minimum number of nights that must be selected between
+     * the startDate and the endDate
      */
-    initial_visible_month: PropTypes.string,
+    minimum_nights: PropTypes.number,
+
+    /**
+     * Determines when the component should update
+     * its value. If `bothdates`, then the DatePicker
+     * will only trigger its value when the user has
+     * finished picking both dates. If `singledate`, then
+     * the DatePicker will update its value
+     * as one date is picked.
+     */
+    updatemode: PropTypes.oneOf(['singledate', 'bothdates']),
 
     /**
      * Text that will be displayed in the first input
@@ -102,45 +91,43 @@ DatePickerRange.propTypes = {
     end_date_placeholder_text: PropTypes.string,
 
     /**
-     * Size of rendered calendar days, higher number
-     * means bigger day size and larger calendar overall
-     */
-    day_size: PropTypes.number,
-
-    /**
-     * Orientation of calendar, either vertical or horizontal.
-     * Valid options are 'vertical' or 'horizontal'.
+     * Specifies the month that is initially presented when the user
+     * opens the calendar. Accepts datetime.datetime objects or strings
+     * in the format 'YYYY-MM-DD'
+     *
      */
-    calendar_orientation: PropTypes.oneOf(['vertical', 'horizontal']),
+    initial_visible_month: PropTypes.string,
 
     /**
-     * Determines whether the calendar and days operate
-     * from left to right or from right to left
+     * Whether or not the dropdown is "clearable", that is, whether or
+     * not a small "x" appears on the right of the dropdown that removes
+     * the selected value.
      */
-    is_RTL: PropTypes.bool,
+    clearable: PropTypes.bool,
 
     /**
      * If True, the calendar will automatically open when cleared
      */
     reopen_calendar_on_clear: PropTypes.bool,
 
     /**
-     * Number of calendar months that are shown when calendar is opened
-     */
-    number_of_months_shown: PropTypes.number,
-
-    /**
-     * If True, calendar will open in a screen overlay portal,
-     * not supported on vertical calendar
+     * Specifies the format that the selected dates will be displayed
+     * valid formats are variations of "MM YY DD". For example:
+     * "MM YY DD" renders as '05 10 97' for May 10th 1997
+     * "MMMM, YY" renders as 'May, 1997' for May 10th 1997
+     * "M, D, YYYY" renders as '07, 10, 1997' for September 10th 1997
+     * "MMMM" renders as 'May' for May 10 1997
      */
-    with_portal: PropTypes.bool,
+    display_format: PropTypes.string,
 
     /**
-     * If True, calendar will open in a full screen overlay portal, will
-     * take precedent over 'withPortal' if both are set to true,
-     * not supported on vertical calendar
+     * Specifies the format that the month will be displayed in the calendar,
+     * valid formats are variations of "MM YY". For example:
+     * "MM YY" renders as '05 97' for May 1997
+     * "MMMM, YYYY" renders as 'May, 1997' for May 1997
+     * "MMM, YY" renders as 'Sep, 97' for September 1997
      */
-    with_full_screen_portal: PropTypes.bool,
+    month_format: PropTypes.string,
 
     /**
      * Specifies what day is the first day of the week, values must be
@@ -149,10 +136,10 @@ DatePickerRange.propTypes = {
     first_day_of_week: PropTypes.oneOf([0, 1, 2, 3, 4, 5, 6]),
 
     /**
-     * Specifies a minimum number of nights that must be selected between
-     * the startDate and the endDate
+     * If True the calendar will display days that rollover into
+     * the next month
      */
-    minimum_nights: PropTypes.number,
+    show_outside_days: PropTypes.bool,
 
     /**
      * If True the calendar will not close when the user has selected a value
@@ -161,46 +148,57 @@ DatePickerRange.propTypes = {
     stay_open_on_select: PropTypes.bool,
 
     /**
-     * If True the calendar will display days that rollover into
-     * the next month
+     * Orientation of calendar, either vertical or horizontal.
+     * Valid options are 'vertical' or 'horizontal'.
      */
-    show_outside_days: PropTypes.bool,
+    calendar_orientation: PropTypes.oneOf(['vertical', 'horizontal']),
 
     /**
-     * Specifies the format that the month will be displayed in the calendar,
-     * valid formats are variations of "MM YY". For example:
-     * "MM YY" renders as '05 97' for May 1997
-     * "MMMM, YYYY" renders as 'May, 1997' for May 1997
-     * "MMM, YY" renders as 'Sep, 97' for September 1997
+     * Number of calendar months that are shown when calendar is opened
      */
-    month_format: PropTypes.string,
+    number_of_months_shown: PropTypes.number,
 
     /**
-     * Specifies the format that the selected dates will be displayed
-     * valid formats are variations of "MM YY DD". For example:
-     * "MM YY DD" renders as '05 10 97' for May 10th 1997
-     * "MMMM, YY" renders as 'May, 1997' for May 10th 1997
-     * "M, D, YYYY" renders as '07, 10, 1997' for September 10th 1997
-     * "MMMM" renders as 'May' for May 10 1997
+     * If True, calendar will open in a screen overlay portal,
+     * not supported on vertical calendar
      */
-    display_format: PropTypes.string,
+    with_portal: PropTypes.bool,
+
+    /**
+     * If True, calendar will open in a full screen overlay portal, will
+     * take precedent over 'withPortal' if both are set to true,
+     * not supported on vertical calendar
+     */
+    with_full_screen_portal: PropTypes.bool,
+
+    /**
+     * Size of rendered calendar days, higher number
+     * means bigger day size and larger calendar overall
+     */
+    day_size: PropTypes.number,
+
+    /**
+     * Determines whether the calendar and days operate
+     * from left to right or from right to left
+     */
+    is_RTL: PropTypes.bool,
 
     /**
      * If True, no dates can be selected.
      */
     disabled: PropTypes.bool,
 
     /**
-     * Whether or not the dropdown is "clearable", that is, whether or
-     * not a small "x" appears on the right of the dropdown that removes
-     * the selected value.
+     * The HTML element ID of the start date input field.
+     * Not used by Dash, only by CSS.
      */
-    clearable: PropTypes.bool,
+    start_date_id: PropTypes.string,
 
     /**
-     * Dash-assigned callback that gets fired when the value changes.
+     * The HTML element ID of the end date input field.
+     * Not used by Dash, only by CSS.
      */
-    setProps: PropTypes.func,
+    end_date_id: PropTypes.string,
 
     /**
      * CSS styles appended to wrapper div
@@ -213,14 +211,16 @@ DatePickerRange.propTypes = {
     className: PropTypes.string,
 
     /**
-     * Determines when the component should update
-     * its value. If `bothdates`, then the DatePicker
-     * will only trigger its value when the user has
-     * finished picking both dates. If `singledate`, then
-     * the DatePicker will update its value
-     * as one date is picked.
+     * The ID of this component, used to identify dash components
+     * in callbacks. The ID needs to be unique across all of the
+     * components in an app.
      */
-    updatemode: PropTypes.oneOf(['singledate', 'bothdates']),
+    id: PropTypes.string,
+
+    /**
+     * Dash-assigned callback that gets fired when the value changes.
+     */
+    setProps: PropTypes.func,
 
     /**
      * Object that holds the loading state object coming from dash-renderer