there's no equivalent to export default in cljs

i suppose you could do (def default ...)

@U61HA86AG i have used (def ^:export filename) but yes i cannot find a way to export it as default

^:export just means it will retain its full path in the final js (e.g some.namespace.foo())

it is not possible to export something as default in cljs

@U61HA86AG okay cause i seem to be getting the following issue:

[Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in.]

@U61HA86AG This is the only library i found that gives me a tourguide/ walkthough for new users, do you know any similar library that does that?

looking at that readme, there's nothing that says you must export as default

so the error is in the code that's importing your component namespace

@U61HA86AG this is my updated code for which i am getting the above error:

(def joy (.joyride JoyRide))
(def JoyrideStep  (r/adapt-react-class (.-JoyrideStep JoyRide)))
(def JoyrideText (r/adapt-react-class (.joyridable JoyRide (r/reactify-component (.-Text ReactNative)))) )

(defn ^:export joyride-page []
  [view
   [JoyrideStep (clj->js {:text  "Hey! This is the first step of the tour!"
                          :order 1
                          :name "openApp"})
    [JoyrideText "Welcome to the demo of joyride library"]])

(defn m-joyride-page []
  (let [m (-> joyride-page
              r/reactify-component
              joy
              r/adapt-react-class)]
    [m]))

if view is defined, and JoyRideStep is undefined, then that means that (def JoyrideStep (r/adapt-react-class (.-JoyrideStep JoyRide))) is not doing what you expect

(i am not familiar with whatever that cljs React wrapper is)

@U61HA86AG (def JoyrideStep (r/adapt-react-class (.-JoyrideStep JoyRide)) is taking joyride step and converting into react component wrapper

@U61HA86AG i have defined view in similar way (def view (r/adapt-react-class (.-View ReactNative))) and it seems to be working

i figured, but if it's undefined (as per the error you got), then there must be something wrong with it, right?

@U61HA86AG I agree, im stuck on that because it should work as it is supposed to but it isnt, i thought it a js<->clj interop issue but i doubt that too

how are you requiring JoyRide? it might be (.-JoyrideStep js/JoyRide) or JoyRide/JoyrideStep instead

This is how im requiring JoyRide (def JoyRide (js/require "react-native-joyride"))

JoyRide/JoyrideStep I dont think so this works in cljs

hmm, in that case i think it should work, perhaps you need to (.log js/console JoyRide) and validate your assumptions

@U61HA86AG i tried replacing it to (def JoyrideStep (r/adapt-react-class JoyRide/JoyrideStep)) but i get this issue

[TypeError: undefined is not an object (evaluating 'expo_demo.core.JoyRide.joyride')]

that must mean JoyRide is undefined?

I guess joyride is undefined

so the js/require is not working i guess

@U61HA86AG sorry you were right it was a js/require silly issue i made . This is the error i get [ReferenceError: Can't find variable: JoyRide]

right

using log on joyride gives me this

Object {
  "JoyrideStep": [Function JoyrideStep],
  "joyridable": [Function joyridable],
  "joyride": [Function joyride],
}

then .-JoyrideStep on that should work, right?

@U61HA86AG im getting the following Object only after changing it to .-JoyrideStep

log on JoyrideStep gives me

{
  "class": null,
  "id": null,
  "name": [Function JoyrideStep],
}

It seems im getting null on JoyrideStep

and log on JoyrideText gives

{
  "class": null,
  "id": null,
  "name": [Function anonymous],
}

then i suppose you might need to do (def JoyrideStep (.-name (.-JoyrideStep Joyride))

and the same for JoyrideText

i dont have to convert it by (r/adapt-react-class)?

i don't know about that, sorry

looks like a Reagent thing - you might try #reagent

@U61HA86AG using

(def JoyrideStep  (.-name (.-JoyrideStep JoyRide)))
(def JoyrideText (.-name (.joyridable JoyRide (r/reactify-component (.-Text ReactNative)))))

Error rendering component (in env.main.reloader > expo_demo.core.app_root > m-joyride-page >  > expo_demo.core.joyride_page)
15:58:40
[Error: Assert failed: Invalid tag: '' (in env.main.reloader > expo_demo.core.app_root > m-joyride-page >  > expo_demo.core.joyride_page)
tag]

So i need to use (r/adapt-react-class)

ok, right

using

(def JoyrideStep  (r/adapt-react-class (.-name (.-JoyrideStep JoyRide))))
(def JoyrideText  (r/adapt-react-class (.-name (.joyridable JoyRide (r/reactify-component (.-Text ReactNative))))))

[Invariant Violation: Expected a component class, got [object Object].]

{
  "class": null,
  "id": null,
  "name": "JoyrideStep",
}  {
  "class": null,
  "id": null,
  "name": "",
}

guess that's wrong too then, sorry 😞

@U61HA86AG np btw could you explain me why (.-name) had to be used? i dont know js actually

i just figured that you needed the component function, which seemed to be under the name property of that object. was a complete guess 😛

@U61HA86AG oh so when are the cases in which we need to use (.-name). I have used many libraries but never need to use this

that object you posted had the property name, which had a function value. the others were both null, so i guessed that you needed the function. to get the name property of a js object you use the .-name interop syntax

@U61HA86AG i understood for JoyrideStep but for JoyrideText has name earlier as [anonymous function] so how to access this?

and after using (.-name) on JoyrideText the name is ""

the name property of an anonymous function is ""

so that's what's happening there

JoyrideText must already be a function

@U61HA86AG JoyrideText must already be a function means?

if it was the object it would .-name would return a function, not a string

(.-name some-anonymous-fn) returns ""

so you mean to say JoyrideText is a function and not object?

yes

@U61HA86AG so i cannot use (.-name) in JoyrideText

.-name didn't work anyway right

true but it did change my error from

[Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in.]

[Invariant Violation: Expected a component class, got [object Object].]

so i think that was the correct direction

perhaps

@U61HA86AG thanks alot for your help

no worries! pity we couldn't figure it out 🙂

@U61HA86AG i just found out there is a dedicated channel #cljsrn for react native using cljs ill try posting it there

good luck!