Title: bug: React IonRange is disabled even if `disabled === undefined` · Issue #19563 · ionic-team/ionic-framework · GitHub
Open Graph Title: bug: React IonRange is disabled even if `disabled === undefined` · Issue #19563 · ionic-team/ionic-framework
X Title: bug: React IonRange is disabled even if `disabled === undefined` · Issue #19563 · ionic-team/ionic-framework
Description: Bug Report Ionic version: "@ionic/core": "^4.10.0", "@ionic/react": "^4.10.0-rc.3", Current behavior: Having IonRange component and it's prop disabled to which I pass variable that can be type boolean | undefined, -> when the variable is...
Open Graph Description: Bug Report Ionic version: "@ionic/core": "^4.10.0", "@ionic/react": "^4.10.0-rc.3", Current behavior: Having IonRange component and it's prop disabled to which I pass variable that can be type bool...
X Description: Bug Report Ionic version: "@ionic/core": "^4.10.0", "@ionic/react": "^4.10.0-rc.3", Current behavior: Having IonRange component and it's prop disabled to...
Opengraph URL: https://github.com/ionic-team/ionic-framework/issues/19563
X: @github
Domain: github.com
{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"bug: React IonRange is disabled even if `disabled === undefined`","articleBody":"\u003c!-- Before submitting an issue, please consult our docs (https://ionicframework.com/docs/). --\u003e\r\n\r\n\u003c!-- Please make sure you are posting an issue pertaining to the Ionic Framework. If you are having an issue with the Ionic Appflow services (Ionic View, Ionic Deploy, etc.) please consult the Ionic Appflow support portal (https://ionic.zendesk.com/hc/en-us) --\u003e\r\n\r\n\u003c!-- Please do not submit support requests or \"How to\" questions here. Instead, please use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/ --\u003e\r\n\r\n\u003c!-- ISSUES MISSING IMPORTANT INFORMATION MAY BE CLOSED WITHOUT INVESTIGATION. --\u003e\r\n\r\n# Bug Report\r\n\r\n**Ionic version:**\r\n\"@ionic/core\": \"^4.10.0\",\r\n\"@ionic/react\": \"^4.10.0-rc.3\",\r\n\r\n**Current behavior:**\r\n\u003c!-- Describe how the bug manifests. --\u003e\r\nHaving `IonRange` component and it's prop `disabled` to which I pass variable that can be `type boolean | undefined`,\r\n-\u003e when the variable is equal to `false` IonRange is **enabled**\r\n-\u003e when the variable is equal to `true` IonRange is **disabled**\r\n-\u003e when the variable is equal to `undefined` IonRange is **enabled**\r\n\r\n**Expected behavior:**\r\n\u003c!-- Describe what the behavior would be without the bug. --\u003e\r\nHaving `IonRange` component and it's prop `disabled` to which I pass variable that can be `type boolean | undefined`,\r\n-\u003e when the variable is equal to `false` IonRange have to be **enabled**\r\n-\u003e when the variable is equal to `true` IonRange have to be **disabled**\r\n-\u003e when the variable is equal to `undefined` IonRange have to be **disabled** because `undefined` is a falsy value\r\n\r\n**Steps to reproduce:**\r\n\u003c!-- Please explain the steps required to duplicate the issue, especially if you are able to provide a sample application. --\u003e\r\n\r\n**Related code:**\r\n```JSX\r\n\u003cdiv className={rangeModifier(urgencyIndex)}\u003e\r\n \u003cIonRange\r\n disabled={readOnly}\r\n max={urgency \u0026\u0026 urgency.size}\r\n min={1}\r\n mode='ios'\r\n onIonChange={onChange}\r\n snaps\r\n step={1}\r\n value={urgencyIndex}\r\n /\u003e\r\n \u003c/div\u003e\r\n```\r\n\r\n","author":{"url":"https://github.com/bohdanbirdie","@type":"Person","name":"bohdanbirdie"},"datePublished":"2019-10-07T08:46:45.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":1},"url":"https://github.com/19563/ionic-framework/issues/19563"}
| route-pattern | /_view_fragments/issues/show/:user_id/:repository/:id/issue_layout(.:format) |
| route-controller | voltron_issues_fragments |
| route-action | issue_layout |
| fetch-nonce | v2:543ac8b4-fd56-38e9-c0cd-58f1d172dca8 |
| current-catalog-service-hash | 81bb79d38c15960b92d99bca9288a9108c7a47b18f2423d0f6438c5b7bcd2114 |
| request-id | 937C:2CAFF1:2D01750:3BCB72D:6A651ADA |
| html-safe-nonce | 23384340ce2199c22d5d3625fdb37c27adbd94422d67b6232e51050c7edfed8e |
| visitor-payload | eyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiI5MzdDOjJDQUZGMToyRDAxNzUwOjNCQ0I3MkQ6NkE2NTFBREEiLCJ2aXNpdG9yX2lkIjoiMjAyOTYyNDIxOTU1OTg2MDk1NCIsInJlZ2lvbl9lZGdlIjoiaWFkIiwicmVnaW9uX3JlbmRlciI6ImlhZCJ9 |
| visitor-hmac | 36b3ed507e5031aba1f0c9879334ffef00c4a29be1d783952e45ee7d9348e33c |
| hovercard-subject-tag | issue:503312152 |
| github-keyboard-shortcuts | repository,issues,copilot |
| google-site-verification | Apib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I |
| octolytics-url | https://collector.github.com/github/collect |
| analytics-location | / |
| fb:app_id | 1401488693436528 |
| apple-itunes-app | app-id=1477376905, app-argument=https://github.com/_view_fragments/issues/show/ionic-team/ionic-framework/19563/issue_layout |
| twitter:image | https://opengraph.githubassets.com/95bf23205ed8dfc3b3a872caa30e4b3609c8fd67a9579c2951e31bafb54aec7d/ionic-team/ionic-framework/issues/19563 |
| twitter:card | summary_large_image |
| og:image | https://opengraph.githubassets.com/95bf23205ed8dfc3b3a872caa30e4b3609c8fd67a9579c2951e31bafb54aec7d/ionic-team/ionic-framework/issues/19563 |
| og:image:alt | Bug Report Ionic version: "@ionic/core": "^4.10.0", "@ionic/react": "^4.10.0-rc.3", Current behavior: Having IonRange component and it's prop disabled to which I pass variable that can be type bool... |
| og:image:width | 1200 |
| og:image:height | 600 |
| og:site_name | GitHub |
| og:type | object |
| og:author:username | bohdanbirdie |
| hostname | github.com |
| expected-hostname | github.com |
| None | 52c76df668885aaff23b50bdca1fa1ea44ac9c1553e888ebc70ff1e4daa4625b |
| turbo-cache-control | no-preview |
| go-import | github.com/ionic-team/ionic-framework git https://github.com/ionic-team/ionic-framework.git |
| octolytics-dimension-user_id | 3171503 |
| octolytics-dimension-user_login | ionic-team |
| octolytics-dimension-repository_id | 12256376 |
| octolytics-dimension-repository_nwo | ionic-team/ionic-framework |
| octolytics-dimension-repository_public | true |
| octolytics-dimension-repository_is_fork | false |
| octolytics-dimension-repository_network_root_id | 12256376 |
| octolytics-dimension-repository_network_root_nwo | ionic-team/ionic-framework |
| turbo-body-classes | logged-out env-production page-responsive |
| disable-turbo | false |
| browser-stats-url | https://api.github.com/_private/browser/stats |
| browser-errors-url | https://api.github.com/_private/browser/errors |
| release | 309153364422b3c499922d1a2a6404910a58ed8e |
| ui-target | full |
| theme-color | #1e2327 |
| color-scheme | light dark |
Links:
Viewport: width=device-width