profile
viewpoint
Ilan Levy ilanl Self-Employed Israel www.linkedin.com/in/levyilan React/Node/MERN,iOS/Swift... TDD Enthusiast

ilanl/youtube-app-swift 1

YouTube Based Native iOS Swift App

ilanl/github-react-repos 0

React Github Profile

ilanl/parcoords-es 0

ES6 module of Syntagmatic's Parallel Coordinates

ilanl/react-map-api 0

react app google map - add/remove points on map

issue commentnecolas/react-native-web

Escape key will close all modals

I did some experiment on why this happened, it has to do with onAnimatedEvent being propagated to the lowest modal (depth 1) when closing depth 2 or more because it is a descendant of ModalAnimation. Please check the console on this sandbox to demonstrate my point https://codesandbox.io/s/modest-rain-z47nl

Because of the propagation, modal 1 is told to be closed.

I think we can stop the event to only target the caller div. What do you think?

endygower

comment created time in 5 hours

issue commentnecolas/react-native-web

Escape key will close all modals

It doesn't close all modals - it closes the lowest modal (with depth 1) - and the rest get closed because they're mounted within the modal you're displaying. The event gets stopped in that modal.

In the non-animated case, the same thing happens - except it goes with the last created (depth 2 or more) and then stops the propagation so it works as we'd like.

I'm not sure how to best approach this without adding a global state of the "stack" of visible modals somewhere. I had that implementation before but removed it to attempt a simplification.

endygower

comment created time in 7 hours

issue commentnecolas/react-native-web

Escape key will close all modals

cc: @imnotjames

endygower

comment created time in 7 hours

issue commentgoldbergyoni/nodebestpractices

Feedback before writing: A list of generic Docker practices

  • Always ensure you check if the full image is what you need or an alpine version of the image, this will save you a lot space.

  • Always use multistage build for your images and deployments. https://docs.docker.com/develop/develop-images/multistage-build/

  • Use standard secret management https://www.docker.com/blog/docker-secrets-management/

goldbergyoni

comment created time in 10 hours

issue openednecolas/react-native-web

Manage focus after closing modal

Is your feature request related to a problem? Please describe. WCGA spec is recommending that after closing modal focus should be brought back to the element that triggered it.

Describe a solution you'd like I've created a PR resolving that problem: #1821

created time in 11 hours

PR opened necolas/react-native-web

feat: implement refocusing trigger-element after closing modal

In a project which I'm part of right now we're working towards compatibility with WCAG spec. When using current implementation of <Modal /> component I've seen that you've handled focus trap problem in very clean manner but there's one more thing that I believe that should be implemented to be even more compliant with the spec.

A Web page implements modal dialogs via scripting. When the trigger button is activated, a dialog opens and focus is set to the first interactive element in the dialog. As long as the dialog is open, focus is limited to the elements of the dialog. When the dialog is dismissed, focus returns to the button or the element following the button.

source: https://www.w3.org/WAI/WCAG21/Understanding/focus-order Examples point 3

This PR is implementing such refocus element that triggered modal after closing it mechanism.

+14 -0

0 comment

1 changed file

pr created time in 11 hours

issue commentdiegohaz/rest

Feature Request: Generate DockerFile for the project

there is a guy that already done it in his project check out : https://github.com/cesar3030/Sileau-IoT/blob/master/express-server/Dockerfile

bsantos09

comment created time in 15 hours

issue commentdiegohaz/rest

Patch example

I am interested in having the method in the project if it's possible

Mustafax06

comment created time in 15 hours

issue commentnecolas/react-native-web

[Question] What is the best way of handling dynamic styles dependent on props?

I'm using rn-css on a full cross-platform project (iOS, Android, web, MacOS, Linux, Windows). I had no issue with it so far.

I don't see what you mean by a runtime overhead. Do you have a concrete example?

ElForastero

comment created time in 16 hours

issue commentnecolas/react-native-web

Modal styles

Following up in #1820

gesposito

comment created time in 17 hours

issue openednecolas/react-native-web

Modal's z-index is not applied properly

<!-- Thank you for reporting an issue. Please note that an issue must include the information that is marked as REQUIRED below, or it may be closed. -->

The problem <!-- REQUIRED: A clear and concise description of the bug or problem. -->

When a Modal is shown, z-index priority is lost

How to reproduce <!-- REQUIRED: Create a test case by forking this template https://codesandbox.io/s/6lx6ql1w5r

Failing to include a reduced test case may result in the issue being closed, and will delay any potential fix. Your application or GitHub project is NOT considered a reduced test case. If the issue only affects certain browsers, providing screenshots is also helpful. --> Simplified test case: https://codesandbox.io/s/elated-tereshkova-xihgc

Steps to reproduce:

  1. Tap "Show Modal"

Expected behavior <!-- REQUIRED: A clear and concise description of what you expected to happen.

Please check that the behaviour is not expected React Native behaviour by running your test case on iOS or Android using https://snack.expo.io. -->

Modal should show above the Top and Bottom buttons

Environment (include versions). Did this work in previous versions?

  • React Native for Web (version): 0.14.8
  • React (version): 16.13.1
  • Browser: Chrome, Safari, Firefox

<!-- OPTIONAL:

Additional context Add any other context about the problem here. -->

z-index seems to be applied on the aria-modal, but might need to be applied to the animated div (reference)

created time in 17 hours

issue commentnecolas/react-native-web

TextInput: autoexpandable

@woodpav This with multiline works great to increase the size of the text input, but it, unfortunately, doesn't shrink it when you remove text.

gut4

comment created time in 17 hours

issue commentnecolas/react-native-web

Picker fontFamily

Hi Guys This issue shouldn't be closed. I fully understand the logic behind what you wrote but in the end of the day my web app doesn't look good as expected and it prevent from a RNW to be perfect as it should. Do you know any way to bypass that? (global CSS doesn't work)

PeterKottas

comment created time in 18 hours

issue commentnecolas/react-native-web

animatedprops error only in production

@necolas Running into same issue

My setup is also same:

react-native-web: 0.12.3
react-native: 0.62

I'm using create-react-app's default react-scripts, i.e not the react-native-web babel plugin. Any ideas on how to fix this?

sirpy

comment created time in a day

issue commentnecolas/react-native-web

[Question] What is the best way of handling dynamic styles dependent on props?

@Sharcoux The main issue with them is that they add a one more level of runtime overhead and potential compatibility issues for web. In the end of the day we have only StyleSheet.create().

ElForastero

comment created time in a day

issue commentnecolas/react-native-web

[Question] What is the best way of handling dynamic styles dependent on props?

Well, wouldn't a solution such as styled-components or rn-css be the best fit for that?

ElForastero

comment created time in a day

Pull request review commentnecolas/react-native-web

Provide better API for opening in new tab

 const Linking = {   } }; -const open = url => {+const open = (url: string, target?: '_blank') => {   if (canUseDOM) {-    window.location = new URL(url, window.location).toString();+    window.open(url, target).focus();

This is indeed the goal

Sharcoux

comment created time in a day

issue commentnecolas/react-native-web

Open in new tab

Can Linking open an External Browser when running react-native-web inside a Mobile App in its WebView? For eg: A react-native-web PWA running inside a React Native App's webview

Code

  const openLink = async url => {
    const supported = await Linking.canOpenURL(url)
    if (supported) {
      await Linking.openURL(url)
    }
  }

The above code however redirects to a page within the WebView and not from an external Browser (eg, open with Chrome, etc) Any workarounds for this issue?

jfrolich

comment created time in a day

issue closednecolas/react-native-web

Open External Browser from App

How can I open an External Browser when running react-native-web inside a Mobile App in its WebView?

Code

  const openLink = async url => {
    const supported = await Linking.canOpenURL(url)
    if (supported) {
      await Linking.openURL(url)
    }
  }

The above code however redirects to a page within the WebView and not from an external Browser (eg, open with Chrome, etc)

closed time in a day

JijoBose

issue commentnecolas/react-native-web

Open External Browser from App

Duplicates #1544

JijoBose

comment created time in a day

issue closednecolas/react-native-web

Modal styles

Is your feature request related to a problem? Please describe. <!-- A clear and concise description of what the problem is, e.g., I have an issue when [...] --> I need to make it so Modal has an higher z-index

Describe a solution you'd like <!-- A clear and concise description of what you want to happen. Add any considered drawbacks. --> getAnimationStyle in ModalAnimation might parse the style property and append styles.

Describe alternatives you've considered <!-- A clear and concise description of any alternative solutions or features you've considered. --> I might patch it with patch-package

Additional context <!-- Add any other context or screenshots about the feature request here. -->

closed time in a day

gesposito

issue commentnecolas/react-native-web

Modal styles

Modals are appended to the document with a zindex. Please provide a test case for the problem, then I'll reopen https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/exports/Modal/ModalContent.js#L59

gesposito

comment created time in a day

created repositoryJoshK2/react-native-with-bit-harmony

created time in 2 days

issue commentnecolas/react-native-web

Modal styles

It is common for mobile apps to have absolute positioned elements, be the top header, search bar, or buttons on the bottom

Screenshot 2020-11-24 at 09 44 29

when a Modal is being shown we want to make sure all elements are covered "full screen"

using portals with no z-index we give all elements the same "stacking context", meaning we loose control of what is prioritized

gesposito

comment created time in 2 days

issue openednecolas/react-native-web

Open External Browser from App

How can I open an External Browser when running react-native-web inside a Mobile App in its WebView?

Code

  const openLink = async url => {
    const supported = await Linking.canOpenURL(url)
    if (supported) {
      await Linking.openURL(url)
    }
  }

The above code however redirects to a page within the WebView and not from an external Browser (eg, open with Chrome, etc)

created time in 2 days

created repositorysindresorhus/nano-queue

Tiny queue data structure

created time in 2 days

created repositoryiquirino/boticario-auth0-typeorm-typescript

created time in 2 days

issue commentnecolas/react-native-web

Modal styles

Please describe the actual problem that leads you to believe you need to control the zindex

gesposito

comment created time in 2 days

push eventgoldbergyoni/nodebestpractices

Vinaya Sathyanarayana

commit sha 3f619fc6b0ecd81027a4ccaf6455ceae14c5cc35

Refer to OpenAPI Refer to OpenAPI

view details

Vinaya Sathyanarayana

commit sha ae703cb957273864061737d457e4673de7458bf4

Update documentingusingswagger.md Updated EKA

view details

Vinaya Sathyanarayana

commit sha d60009a9a33626e4c5c08917414f338184c0ab2c

Update documentingusingswagger.md Spelling Corrected

view details

Kevyn Bruyere

commit sha cf9685ca7bce6b1ac47058e40d899b22de4ad81e

Merge pull request #790 from VinayaSathyanarayana/patch-4 Refer to OpenAPI

view details

push time in 2 days

PR merged goldbergyoni/nodebestpractices

Refer to OpenAPI

Refer to OpenAPI instead of the earlier name of Swagger

+2 -2

5 comments

1 changed file

VinayaSathyanarayana

pr closed time in 2 days

more