You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@royale.apache.org by Harbs <ha...@gmail.com> on 2018/03/15 11:51:25 UTC

Label

Is there a reason that the element type of Basic Label is span?

I tried adding a “TextOverflow” bead to a Label and it does not seem to work because spans don’t really have a working width. Switching the element type to div seems to make it work.

Harbs

Re: Label

Posted by Harbs <ha...@gmail.com>.
I’m not sure if you mean in the bead or the component. If you mean the component, that essentially converts the span to a div in everything but name. If you mean in the bead, yes, that’s what I’m going to do.

Harbs

> On Mar 16, 2018, at 10:04 AM, OmPrakash Muppirala <bi...@gmail.com> wrote:
> 
> Perhaps we can set display:inline-block for the span which renders the
> Label?


Re: Label

Posted by OmPrakash Muppirala <bi...@gmail.com>.
On Fri, Mar 16, 2018 at 12:39 AM, Harbs <ha...@gmail.com> wrote:

> That’s what the current TextOverflow bead does. It only works on elements
> which are display: block (which span is not by default).
>
> IMO using div here is not PAYG, but I’m finished discussing this as well.
> I thought changing Label from span to div was a simple change and not
> worthy of major discussion. It seems reasonable to specify x/y position,
> width, height, etc. on Label without changing the type (i.e. position:
> block). Either I’m not explaining myself well enough or we’re just going to
> have to agree to disagree.
>
> We *have* a component which encapsulates Span (i.e. HTMLText) so I don’t
> know what this fixation about keeping Label a span is all about, but
> whatever...
>
> I’m going to revert Label back to span and change the TextOverflow bead to
> explicitly set display: block even though I think it’s *less* PAYG. I do
> agree that this is not worthy of all this discussion.
>


Perhaps we can set display:inline-block for the span which renders the
Label?  Then you can set width/height etc. on it.

.spanInLabel {
    width:150px;
    display:inline-block;
}

Then you could do truncation like this (in a new bead):

.truncationBeadForLabel{
    overflow: hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

Thanks,
Om




>
> Harbs
>
> > On Mar 16, 2018, at 7:18 AM, OmPrakash Muppirala <bi...@gmail.com>
> wrote:
> >
> > Have you tried text-overflow:ellipsis?
> > Ex: http://jsfiddle.net/Qhdaz/5/ <http://jsfiddle.net/Qhdaz/5/>
> >
> > Apologies if you have already considered this and rejected the approach.
>
>

Re: Label

Posted by Harbs <ha...@gmail.com>.
That’s what the current TextOverflow bead does. It only works on elements which are display: block (which span is not by default).

IMO using div here is not PAYG, but I’m finished discussing this as well. I thought changing Label from span to div was a simple change and not worthy of major discussion. It seems reasonable to specify x/y position, width, height, etc. on Label without changing the type (i.e. position: block). Either I’m not explaining myself well enough or we’re just going to have to agree to disagree.

We *have* a component which encapsulates Span (i.e. HTMLText) so I don’t know what this fixation about keeping Label a span is all about, but whatever...

I’m going to revert Label back to span and change the TextOverflow bead to explicitly set display: block even though I think it’s *less* PAYG. I do agree that this is not worthy of all this discussion.

Harbs

> On Mar 16, 2018, at 7:18 AM, OmPrakash Muppirala <bi...@gmail.com> wrote:
> 
> Have you tried text-overflow:ellipsis?
> Ex: http://jsfiddle.net/Qhdaz/5/ <http://jsfiddle.net/Qhdaz/5/>
> 
> Apologies if you have already considered this and rejected the approach.


Re: Label

Posted by OmPrakash Muppirala <bi...@gmail.com>.
On Mar 15, 2018 6:13 AM, "Harbs" <ha...@gmail.com> wrote:

> Did you try some custom css to solve the problem just with span?

Yeah. I couldn’t figure out any way to truncate a span.


Have you tried text-overflow:ellipsis?
Ex: http://jsfiddle.net/Qhdaz/5/

Apologies if you have already considered this and rejected the approach.

Thanks,
Om



> On Mar 15, 2018, at 2:59 PM, Carlos Rovira <ca...@apache.org>
wrote:
>
> Maybe in Basic have sense to be span, but in Express, Jewel can be other
> thing. A div seems more like a "container" to me, but we're using divs to
> handle textfields, so maybe it would be ok with labels.
> Did you try some custom css to solve the problem just with span?
>
> 2018-03-15 13:34 GMT+01:00 Harbs <ha...@gmail.com>:
>
>> Gotcha. FWIW, we now have the HTML element component set which more
thinly
>> wraps HTML elements.
>>
>> I can’t think of any reason why Label would be better as a span than a
>> div. It seems to me that simply using div instead of span would make
Label
>> more versatile. Am I missing something?
>>
>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID> wrote:
>>>
>>> Label was one of the very first components and the idea was minimalism.
>>> Button was <button> and TextInput was <input type="text"> and Label was
>>> <span>.
>>>
>>> I'm wondering if we should have NativeButton, NativeLabel, etc. which
>>> would be these minimal elements and have others that are <div> wrapping.
>>> For instance, ImageAndTextButton is a <button><img src="goo.jpg">Label
>>> Here</button> which works but the alignment is weird so maybe
>>> ImageAndTextButton should be a <div><img>Text</div> which can be aligned
>>> and styled better.
>>>
>>> Anyway, that's the reason: simplicity.
>>>
>>> ‹peter
>>>
>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>>>
>>>> Is there a reason that the element type of Basic Label is span?
>>>>
>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not seem to
>>>> work because spans donąt really have a working width. Switching the
>>>> element type to div seems to make it work.
>>>>
>>>> Harbs
>>>
>>
>>
>
>
> --
> Carlos Rovira
> http://about.me/carlosrovira

Re: Label

Posted by Harbs <ha...@gmail.com>.
> Did you try some custom css to solve the problem just with span?

Yeah. I couldn’t figure out any way to truncate a span.

> On Mar 15, 2018, at 2:59 PM, Carlos Rovira <ca...@apache.org> wrote:
> 
> Maybe in Basic have sense to be span, but in Express, Jewel can be other
> thing. A div seems more like a "container" to me, but we're using divs to
> handle textfields, so maybe it would be ok with labels.
> Did you try some custom css to solve the problem just with span?
> 
> 2018-03-15 13:34 GMT+01:00 Harbs <ha...@gmail.com>:
> 
>> Gotcha. FWIW, we now have the HTML element component set which more thinly
>> wraps HTML elements.
>> 
>> I can’t think of any reason why Label would be better as a span than a
>> div. It seems to me that simply using div instead of span would make Label
>> more versatile. Am I missing something?
>> 
>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID> wrote:
>>> 
>>> Label was one of the very first components and the idea was minimalism.
>>> Button was <button> and TextInput was <input type="text"> and Label was
>>> <span>.
>>> 
>>> I'm wondering if we should have NativeButton, NativeLabel, etc. which
>>> would be these minimal elements and have others that are <div> wrapping.
>>> For instance, ImageAndTextButton is a <button><img src="goo.jpg">Label
>>> Here</button> which works but the alignment is weird so maybe
>>> ImageAndTextButton should be a <div><img>Text</div> which can be aligned
>>> and styled better.
>>> 
>>> Anyway, that's the reason: simplicity.
>>> 
>>> ‹peter
>>> 
>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>>> 
>>>> Is there a reason that the element type of Basic Label is span?
>>>> 
>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not seem to
>>>> work because spans donąt really have a working width. Switching the
>>>> element type to div seems to make it work.
>>>> 
>>>> Harbs
>>> 
>> 
>> 
> 
> 
> -- 
> Carlos Rovira
> http://about.me/carlosrovira


Re: Label

Posted by Peter Ent <pe...@adobe.com.INVALID>.
The problem with using HTML as a platform for interactive UI controls that
can positioned in a variety of ways is that HTML wasn't designed to do
this, which we all know. I've begun to think of DIV more like a base UI
element that just happens to also have another abilities. I think other
HTML-based frameworks do the same thing once you see the limitations of
the primitive elements.

That's why we have element and positioner.

—peter

On 3/15/18, 8:59 AM, "carlos.rovira@gmail.com on behalf of Carlos Rovira"
<carlos.rovira@gmail.com on behalf of carlosrovira@apache.org> wrote:

>Maybe in Basic have sense to be span, but in Express, Jewel can be other
>thing. A div seems more like a "container" to me, but we're using divs to
>handle textfields, so maybe it would be ok with labels.
>Did you try some custom css to solve the problem just with span?
>
>2018-03-15 13:34 GMT+01:00 Harbs <ha...@gmail.com>:
>
>> Gotcha. FWIW, we now have the HTML element component set which more
>>thinly
>> wraps HTML elements.
>>
>> I can’t think of any reason why Label would be better as a span than a
>> div. It seems to me that simply using div instead of span would make
>>Label
>> more versatile. Am I missing something?
>>
>> > On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID> wrote:
>> >
>> > Label was one of the very first components and the idea was
>>minimalism.
>> > Button was <button> and TextInput was <input type="text"> and Label
>>was
>> > <span>.
>> >
>> > I'm wondering if we should have NativeButton, NativeLabel, etc. which
>> > would be these minimal elements and have others that are <div>
>>wrapping.
>> > For instance, ImageAndTextButton is a <button><img src="goo.jpg">Label
>> > Here</button> which works but the alignment is weird so maybe
>> > ImageAndTextButton should be a <div><img>Text</div> which can be
>>aligned
>> > and styled better.
>> >
>> > Anyway, that's the reason: simplicity.
>> >
>> > ‹peter
>> >
>> > On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>> >
>> >> Is there a reason that the element type of Basic Label is span?
>> >>
>> >> I tried adding a łTextOverflow˛ bead to a Label and it does not seem
>>to
>> >> work because spans donąt really have a working width. Switching the
>> >> element type to div seems to make it work.
>> >>
>> >> Harbs
>> >
>>
>>
>
>
>-- 
>Carlos Rovira
>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fabout.me%2
>Fcarlosrovira&data=02%7C01%7Cpent%40adobe.com%7Cd14c10394efb4caf88b608d58a
>74963a%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636567155696967043&sda
>ta=cm3Z%2B%2BZBHdt9uEGRmkixGZlhupZYc%2FHW4SILUiDdkBg%3D&reserved=0


Re: Label

Posted by Carlos Rovira <ca...@apache.org>.
Maybe in Basic have sense to be span, but in Express, Jewel can be other
thing. A div seems more like a "container" to me, but we're using divs to
handle textfields, so maybe it would be ok with labels.
Did you try some custom css to solve the problem just with span?

2018-03-15 13:34 GMT+01:00 Harbs <ha...@gmail.com>:

> Gotcha. FWIW, we now have the HTML element component set which more thinly
> wraps HTML elements.
>
> I can’t think of any reason why Label would be better as a span than a
> div. It seems to me that simply using div instead of span would make Label
> more versatile. Am I missing something?
>
> > On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID> wrote:
> >
> > Label was one of the very first components and the idea was minimalism.
> > Button was <button> and TextInput was <input type="text"> and Label was
> > <span>.
> >
> > I'm wondering if we should have NativeButton, NativeLabel, etc. which
> > would be these minimal elements and have others that are <div> wrapping.
> > For instance, ImageAndTextButton is a <button><img src="goo.jpg">Label
> > Here</button> which works but the alignment is weird so maybe
> > ImageAndTextButton should be a <div><img>Text</div> which can be aligned
> > and styled better.
> >
> > Anyway, that's the reason: simplicity.
> >
> > ‹peter
> >
> > On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
> >
> >> Is there a reason that the element type of Basic Label is span?
> >>
> >> I tried adding a łTextOverflow˛ bead to a Label and it does not seem to
> >> work because spans donąt really have a working width. Switching the
> >> element type to div seems to make it work.
> >>
> >> Harbs
> >
>
>


-- 
Carlos Rovira
http://about.me/carlosrovira

Re: Label

Posted by Harbs <ha...@gmail.com>.
I’m not trying to prolong this discussion, but I couldn’t help commenting on this: ;-)

> On Mar 16, 2018, at 6:38 AM, Alex Harui <ah...@adobe.com.INVALID> wrote:
> 
> Span was an attempt to keep things from unintentionally wrapping, which I believe is the browser default.

This is possibly where some of the disconnect is coming from.

It’s not.

In fact, I believe that normally the entire point of span is that it DOES wrap. We are using element.style.whiteSpace = "nowrap”; to prevent the text from wrapping.


Harbs

Re: Label

Posted by Carlos Rovira <ca...@apache.org>.
Hi

my opinion is that Basic should be Basic, and so Label should be a span
If Label needs to be a div, that's a problem of other UI Set, maybe in
Jewel we can make it default to div

Just my 2

thanks

Carlos

2018-03-16 6:35 GMT+01:00 OmPrakash Muppirala <bi...@gmail.com>:

> Alex,
>
> After reading through the whole thread, I now agree with you.
>
> To be frank, I understand your frustration.  Please take a break.  You
> don't need to participate in every discussion :-)
>
> Thanks,
> Om
>
> On Thu, Mar 15, 2018 at 9:38 PM, Alex Harui <ah...@adobe.com.invalid>
> wrote:
>
> > For Migrating Users we are building a set of emulation components.  They
> > will not be PAYG.  They are intended to reduce the number of changes to
> > your Flex code base.
> >
> > But if after migrating, performance becomes an issue, users will be
> > encouraged to break apart the emulation components into their Basic
> > components and only the beads they need.  The Spark Label will be heavier
> > than MX Label because it has to carry around the "maxDisplayedLines"
> > property.  Spark Label defaulted to a single line, IIRC.
> >
> > Also note that the underlying behavior in Flex/Flash was to default to a
> > single line unless you asked for more.  Span was an attempt to keep
> things
> > from unintentionally wrapping, which I believe is the browser default.
> >
> > I think it would cause questions if there were no spans where most people
> > expect them in Royale output.  Unless we convince the whole world that
> div
> > really should replace span everywhere.
> >
> > Meanwhile, back to trying to create these emulation components...
> >
> > -Alex
> >
> > On 3/15/18, 9:22 PM, "Greg Dove" <gr...@gmail.com> wrote:
> >
> > >Alex, that may have been true for mx Label, but it is not the case for
> > >Spark. In the end it does become relevant for 'migrating users'
> migrating
> > >Flex 4/Spark apps.
> > >
> > >I'm just pointing this out. I was confused/annoyed when I used it last
> > >year
> > >expecting it to be similar to what I had been using not so long ago in
> > >Flex. If I was confused, I am probably not unique (I might be!). Yes, I
> > >made something else to do the job or found multilinelabel - I can't
> > >remember now. But maybe there is no extra 'pay' to use div? Anyhow, I am
> > >stopping further comments. Over to you guys.
> > >
> > >
> > >
> > >
> > >
> > >On Fri, Mar 16, 2018 at 5:13 PM, Alex Harui <ah...@adobe.com.invalid>
> > >wrote:
> > >
> > >>
> > >>
> > >> On 3/15/18, 8:47 PM, "Greg Dove" <gr...@gmail.com> wrote:
> > >>
> > >> >  Label is a single-line sequence of text.
> > >> >
> > >> >I think that is the statement that might be in the process of being
> > >> >indirectly debated.
> > >> >Is it documented as such?
> > >>
> > >> Really?  We're going to nitpick over the completeness of our doc?
> There
> > >> is a MultilineLabel component for a reason.  I did not like adding
> more
> > >> blades to the swiss-army knife in Spark Label.  That wasn't PAYG.  MX
> > >> Label doc is here:
> > >>
> > >>https://na01.safelinks.protection.outlook.com/?url=
> > https%3A%2F%2Fhelp.ado
> > >>be.com%2Fen_US%2FFlashPlatform%2Freference%
> > 2F&data=02%7C01%7Caharui%40ado
> > >>be.com%7C60c34e7c67b34f47a89008d58af59006%
> 7Cfa7b1b5a7b34438794aed2c178de
> > c
> > >>ee1%7C0%7C0%7C636567709645648492&sdata=YVjrfzkZGp%
> > 2BOHAyLmzbsMJQuY9r1%2BB
> > >>yJ2b%2B6tQwm5ho%3D&reserved=0
> > >> actionscript/3/mx/cont
> > >> rols/Label.html
> > >>
> > >> It says:  "The Label control displays a single line of noneditable
> > >>text."
> > >>
> > >> Still trying to help our migrating users...
> > >> -Alex
> > >> >
> > >> >On Fri, Mar 16, 2018 at 4:37 PM, Alex Harui <aharui@adobe.com.invalid
> >
> > >> >wrote:
> > >> >
> > >> >> Because, this isn't an issue of performance.  We give our users
> > >>choices
> > >> >> and a toolkit to replicate ANY HTML tree they want to.  We are
> > >>proposing
> > >> >> to replace what is to me the most obvious Flex-like component name
> > >>for
> > >> >> injecting a span into the DOM.  Label is a single-line sequence of
> > >>text.
> > >> >> So is Span.
> > >> >>
> > >> >> I'm not seeing a huge performance difference.  If you think it is
> > >> >> significant enough that our users should be alerted to use
> > >>SizeableLabel
> > >> >> or whatever we call the Div-wrapping-text version, start blogging
> it
> > >> >>after
> > >> >> you validate your test case.  I noticed that the number of Spans
> the
> > >> >>test
> > >> >> appears to report are higher than the number of Divs, but that
> might
> > >>be
> > >> >>a
> > >> >> false alarm.  You can be a hero in the web world if you are right
> and
> > >> >> change the advice I see elsewhere on the net to use Span for inline
> > >> >> elements and Div for other things.  Even the JSPerf page is using
> > >>spans.
> > >> >> Tell them to replace them.
> > >> >>
> > >> >> Meanwhile, I'm going back to try to migrate an app.  Sure wish we
> had
> > >> >>more
> > >> >> people helping on that.
> > >> >>
> > >> >> -Alex
> > >> >>
> > >> >>
> > >> >> We can certainly give them advice that SizedLabel is faster than
> > >>Label
> > >> >>if
> > >> >> that's important, but the different didn't seem that significant.
> > >> >>
> > >> >> On 3/15/18, 6:14 PM, "omuppi1@gmail.com on behalf of OmPrakash
> > >> >>Muppirala"
> > >> >> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
> > >> >>
> > >> >> >If creating a div is more performant than creating a span, why
> > >>insist
> > >> >>on
> > >> >> >using a span?  How is that pay as you go?
> > >> >> >
> > >> >> >Thanks,
> > >> >> >Om
> > >> >> >
> > >> >> >On Thu, Mar 15, 2018 at 5:19 PM, Alex Harui
> > >><ah...@adobe.com.invalid>
> > >> >> >wrote:
> > >> >> >
> > >> >> >> A Flex Label, and any Flex component was a swiss-army knife of
> > >> >>features
> > >> >> >> and not PAYG.  I have not given up on PAYG.  I think it will pay
> > >>off
> > >> >> >>when
> > >> >> >> we get to the last mile.  If we don't stick to PAYG, I think we
> > >>will
> > >> >> >>just
> > >> >> >> repeat the history of Flex and produce a fat framework that
> can't
> > >>run
> > >> >> >> everywhere.  Yes, a Div would probably better mimic a Flex
> Label,
> > >>but
> > >> >> >>the
> > >> >> >> Basic label is not a swiss-army knife.
> > >> >> >>
> > >> >> >> This article is old, but I think it says you can't put a Div in
> a
> > >> >>Span:
> > >> >> >>
> > >> >> >>https://na01.safelinks.protection.outlook.com/?url=
> > >> >> http%3A%2F%2Fdoctype.c
> > >> >> >>om%2Fspan-contain-div-html5&data=02%7C01%7Caharui%40adobe.com
> > >> >> %7C77b57b271
> > >> >> >>ef7423114c208d58ae0d810%7Cfa7b1b5a7b34438794aed2c178de
> > >> >> cee1%7C0%7C0%7C6365
> > >> >> >>67620658308491&sdata=o9msOjZpbwywflSfgJDebUdMM3hgNP
> > >> >> dN%2Btn%2BrcSZsV4%3D&r
> > >> >> >>eserved=0
> > >> >> >>
> > >> >> >> I think you can if you change the span's display to "block" but
> I
> > >> >>think
> > >> >> >> that is essentially replacing the element.
> > >> >> >>
> > >> >> >> Everything, including width and truncation should be opt-in,
> PAYG.
> > >> >> >>Make a
> > >> >> >> LabelWithWidth or SizeableLabel component that is a div if you
> > >>want.
> > >> >> >>
> > >> >> >> Again, the goal is to encapsulate common patterns.  I am not
> > >>seeing a
> > >> >> >>lot
> > >> >> >> of Divs wrapping text nodes.  I see lots of spans wrapping text
> > >> >>nodes.
> > >> >> >> Basic Label is that pattern.  The Basic component set would be
> > >> >> >>incomplete
> > >> >> >> if there wasn't a component that could inject a Span into the
> DOM.
> > >> >> >>Create
> > >> >> >> another component that is a Div wrapping a text node, give it a
> > >> >> >>different
> > >> >> >> name, and let's move on.
> > >> >> >>
> > >> >> >> Alina used Label quite often without setting width.  No need for
> > >> >>those
> > >> >> >> instances to be a Div, AFAICT.
> > >> >> >>
> > >> >> >> Do we even need to discuss span vs div if the truncation bead
> will
> > >> >>work
> > >> >> >>by
> > >> >> >> setting display:block?
> > >> >> >>
> > >> >> >> We have a huge opportunity here to get another app migrated and
> > >> >>prove to
> > >> >> >> the world that Royale is the right choice.  But we keep
> discussing
> > >> >>stuff
> > >> >> >> that IMO, isn't really moving the big pieces forward.  But, IMO,
> > >>we
> > >> >> >>should
> > >> >> >> not compromise on PAYG philosophy and patterns.
> > >> >> >>
> > >> >> >> My 2 cents,
> > >> >> >> -Alex
> > >> >> >>
> > >> >> >> On 3/15/18, 4:27 PM, "omuppi1@gmail.com on behalf of OmPrakash
> > >> >> >>Muppirala"
> > >> >> >> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
> > >> >> >>
> > >> >> >> >FWIW, it seems like creating divs is faster than creating
> spans.
> > >> >> >> >https://na01.safelinks.protection.outlook.com/?url=
> > >> >> >> https%3A%2F%2Fjsperf.co
> > >> >> >> >m%2Fspan-vs-div-creation&data=02%7C01%7Caharui%40adobe.com
> > >> >> >> %7C3664f690b3da4
> > >> >> >> >e4aefab08d58acc7bf0%7Cfa7b1b5a7b34438794aed2c178de
> > >> >> >> cee1%7C0%7C0%7C636567533
> > >> >> >> >215453966&sdata=oPPp2e9aRbQ%2FngKbcFMHMCmXi%2BKa%2B%
> > >> >> >> 2F0aA98XFFqxhFA%3D&res
> > >> >> >> >erved=0
> > >> >> >> >
> > >> >> >> >Thanks,
> > >> >> >> >Om
> > >> >> >> >
> > >> >> >> >On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <
> greg.dove@gmail.com>
> > >> >> wrote:
> > >> >> >> >
> > >> >> >> >> Observing from the sidelines, fwiw I agree with Harbs here.
> > >>Span
> > >> >>to
> > >> >> >>me
> > >> >> >> >> makes more sense as part of the text value of a label and not
> > >>as
> > >> >>the
> > >> >> >> >>basis
> > >> >> >> >> for the representation of the Label itself - div seems closer
> > >>to
> > >> >> >>what I
> > >> >> >> >>was
> > >> >> >> >> used to with legacy Flex (which may no longer be the
> > >>'reference'
> > >> >>for
> > >> >> >> >> choosing an implementation).
> > >> >> >> >> I don't think there is any semantic or other reason that
> makes
> > >> >>span
> > >> >> >>the
> > >> >> >> >> logical default tag for Label, in fact I recall that being a
> > >> >>problem
> > >> >> >> >>many
> > >> >> >> >> times with some work I was involved with last year using
> > >>FlexJS.
> > >> >> >> >> But maybe I am missing something in terms of understanding.
> > >> >> >> >>
> > >> >> >> >>
> > >> >> >> >>
> > >> >> >> >>
> > >> >> >> >> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <
> harbs.lists@gmail.com
> > >
> > >> >> >>wrote:
> > >> >> >> >>
> > >> >> >> >> > I’m suggesting to change it because span does not fit the
> use
> > >> >>case
> > >> >> >>of
> > >> >> >> >> > Label. Width and truncate are just two applications which
> > >> >>indicate
> > >> >> >> >>that
> > >> >> >> >> > span is not the correct element. I’m pretty sure I had
> other
> > >> >>edge
> > >> >> >> >>cases
> > >> >> >> >> > which were likely effected by the fact that Label is a
> span,
> > >> >> >>although
> > >> >> >> >>I’m
> > >> >> >> >> > not positive.
> > >> >> >> >> >
> > >> >> >> >> > I disagree with your distinction between span and div.
> > >> >> >> >> >
> > >> >> >> >> > Both span and div can have children. Spans can contain divs
> > >>and
> > >> >> >>divs
> > >> >> >> >>can
> > >> >> >> >> > contain spans. At its core, Span has nothing to do with
> text.
> > >> >>It’s
> > >> >> >> >>just
> > >> >> >> >> > often used for text because text (within its container) is
> > >> >>inline.
> > >> >> >> >> >
> > >> >> >> >> > MDN says[1] "<span> is very much like a <div> element, but
> > >><div>
> > >> >> >>is a
> > >> >> >> >> > block-level element whereas a <span> is an inline element.”
> > >> >> >> >> >
> > >> >> >> >> > Label is *not* necessarily an inline element. We have all
> > >>kinds
> > >> >>of
> > >> >> >> >> layouts
> > >> >> >> >> > for Label. Many (most?) of them are not inline.
> > >> >> >> >> >
> > >> >> >> >> > If you feel really strongly about this, I’ll revert even
> > >>though
> > >> >>I
> > >> >> >> >> disagree.
> > >> >> >> >> >
> > >> >> >> >> > FWIW, the truncate bead does not need to change the element
> > >> >>type.
> > >> >> >>It
> > >> >> >> >>can
> > >> >> >> >> > explicitly set the display of the element to block.
> > >> >> >> >> >
> > >> >> >> >> > Harbs
> > >> >> >> >> >
> > >> >> >> >> >
> > >> >> >> >>[1]https://na01.safelinks.protection.outlook.com/?url=
> > >> >> >> https%3A%2F%2Fdevel
> > >> >> >> >>oper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
> > >> >> >> 2Fspan&data=02%7C0
> > >> >> >> >>1%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> > >> >> >> 7bf0%7Cfa7b1b5a7b344
> > >> >> >> >>38794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
> > >> >> >> xrtF9H7%2BjFzqGDax
> > >> >> >> >>nj0%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0 <
> > >> >> >> >> >
> > >> >> >> >>https://na01.safelinks.protection.outlook.com/?url=
> > >> >> >> https%3A%2F%2Fdevelope
> > >> >> >> >>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
> > >> >> >> 2Fspan&data=02%7C01%7
> > >> >> >> >>Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> > >> >> >> 7bf0%7Cfa7b1b5a7b344387
> > >> >> >> >>94aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
> > >> >> >> xrtF9H7%2BjFzqGDaxnj0
> > >> >> >> >>%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0>
> > >> >> >> >> >
> > >> >> >> >> > > On Mar 15, 2018, at 11:25 PM, Alex Harui
> > >> >> >><ah...@adobe.com.INVALID>
> > >> >> >> >> > wrote:
> > >> >> >> >> > >
> > >> >> >> >> > > Label in Flex and Royale is not intended to have any
> > >>children
> > >> >> >>(other
> > >> >> >> >> than
> > >> >> >> >> > > bold, italic and other text markup).  Span represents
> that.
> > >> >>Div
> > >> >> >> >>does
> > >> >> >> >> > not.
> > >> >> >> >> > > You are suggesting changing to div JUST IN CASE someone
> > >>needs
> > >> >>to
> > >> >> >> >>set a
> > >> >> >> >> > > width and/or truncate.  Just-in-case code is not PAYG.
> > >> >> >> >> > >
> > >> >> >> >> > > My 2 cents,
> > >> >> >> >> > > -Alex
> > >> >> >> >> > >
> > >> >> >> >> > > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
> > >> >> >> >> > carlos.rovira@gmail.com> on behalf of Carlos Rovira"
> > >> >> >> >> > > <carlos.rovira@gmail.com <mailto:carlos.rovira@gmail.com
> >
> > >>on
> > >> >> >>behalf
> > >> >> >> >>of
> > >> >> >> >> > carlosrovira@apache.org <ma...@apache.org>>
> > >> wrote:
> > >> >> >> >> > >
> > >> >> >> >> > >> And why not change IBeadView in Label for a view that
> > >>uses a
> > >> >>div
> > >> >> >> >>when
> > >> >> >> >> > >> needed? ;)
> > >> >> >> >> > >> in the other cases, maintains the span
> > >> >> >> >> > >>
> > >> >> >> >> > >> 2018-03-15 21:05 GMT+01:00 Harbs <harbs.lists@gmail.com
> >:
> > >> >> >> >> > >>
> > >> >> >> >> > >>> I’m still not understanding you. What about Label says
> > >>it’s
> > >> >>a
> > >> >> >>span
> > >> >> >> >> > >>> instead
> > >> >> >> >> > >>> of a div? Why is making it a div not PAYG? Span simply
> > >> >>limits
> > >> >> >> >>Label
> > >> >> >> >> > >>> unnecessarily. I think span is not the appropriate
> > >>element
> > >> >>for
> > >> >> >> >>Label.
> > >> >> >> >> > >>>
> > >> >> >> >> > >>>> A Label without width should grow to the size of its
> > >>text.
> > >> >> >>Isn't
> > >> >> >> >> that
> > >> >> >> >> > >>> how
> > >> >> >> >> > >>>> it worked in Flex?
> > >> >> >> >> > >>>
> > >> >> >> >> > >>> Sure, and a div does that too. In Flex, a label could
> > >>have a
> > >> >> >>width
> > >> >> >> >> too
> > >> >> >> >> > >>> if
> > >> >> >> >> > >>> specified. Spans cannot.
> > >> >> >> >> > >>>
> > >> >> >> >> > >>> Harbs
> > >> >> >> >> > >>>
> > >> >> >> >> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui
> > >> >> >> >><ah...@adobe.com.INVALID>
> > >> >> >> >> > >>> wrote:
> > >> >> >> >> > >>>>
> > >> >> >> >> > >>>> Have the truncation bead swap the span for div.
> Again,
> > >> >>some
> > >> >> >> >> component
> > >> >> >> >> > >>> has
> > >> >> >> >> > >>>> to put a span in the DOM.  Label has been just fine
> for
> > >> >>that
> > >> >> >>so
> > >> >> >> >>far.
> > >> >> >> >> > >>>>
> > >> >> >> >> > >>>> A Label without width should grow to the size of its
> > >>text.
> > >> >> >>Isn't
> > >> >> >> >> that
> > >> >> >> >> > >>> how
> > >> >> >> >> > >>>> it worked in Flex?
> > >> >> >> >> > >>>>
> > >> >> >> >> > >>>> Maybe Label should be refactored to not have
> > >>width/height
> > >> >> >> >>properties
> > >> >> >> >> > >>> but
> > >> >> >> >> > >>>> IMO we have bigger fish to fry.
> > >> >> >> >> > >>>>
> > >> >> >> >> > >>>> I'm sure Div is used to wrap text in some frameworks,
> > >>but
> > >> >> >>those
> > >> >> >> >> > >>> frameworks
> > >> >> >> >> > >>>> probably aren't PAYG.  In Alina's app, Label has a
> usage
> > >> >> >>score of
> > >> >> >> >> 69,
> > >> >> >> >> > >>> but
> > >> >> >> >> > >>>> Label.width has a score of only 5.  We will have her
> use
> > >> >> >> >> > >>>> LabelWithTruncation or add the truncation bead on the
> > >>few
> > >> >> >>labels
> > >> >> >> >> that
> > >> >> >> >> > >>> need
> > >> >> >> >> > >>>>
> > >> >> >> >> > >>>> My 2 cents,
> > >> >> >> >> > >>>> -Alex
> > >> >> >> >> > >>>>
> > >> >> >> >> > >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com>
> > >> >>wrote:
> > >> >> >> >> > >>>>
> > >> >> >> >> > >>>>> But we already have a truncation bead. The only
> reason
> > >>it
> > >> >> >> >>doesn’t
> > >> >> >> >> > >>> work
> > >> >> >> >> > >>> in
> > >> >> >> >> > >>>>> Label is because spans don’t have widths.
> > >> >> >> >> > >>>>>
> > >> >> >> >> > >>>>> Label is not something which should flow beyond its
> > >> >>bounds —
> > >> >> >> >>which
> > >> >> >> >> is
> > >> >> >> >> > >>>>> what span is useful for. I still don’t see why you
> > >>think
> > >> >>span
> > >> >> >> >>makes
> > >> >> >> >> > >>> more
> > >> >> >> >> > >>>>> sense.
> > >> >> >> >> > >>>>>
> > >> >> >> >> > >>>>> FWIW, div *is* used as a container for text in
> various
> > >> >> >> >>frameworks.
> > >> >> >> >> > >>>>>
> > >> >> >> >> > >>>>> My $0.02,
> > >> >> >> >> > >>>>> Harbs
> > >> >> >> >> > >>>>>
> > >> >> >> >> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui
> > >> >> >> >><aharui@adobe.com.INVALID
> > >> >> >> >> >
> > >> >> >> >> > >>>>>> wrote:
> > >> >> >> >> > >>>>>>
> > >> >> >> >> > >>>>>> AIUI, "inline" is the default display style for
> Span.
> > >> >> >>"block"
> > >> >> >> >>is
> > >> >> >> >> > >>> the
> > >> >> >> >> > >>>>>> default for Div.  HTML flows inline by default for
> > >>just
> > >> >> >>plain
> > >> >> >> >> text.
> > >> >> >> >> > >>>>>> Basic
> > >> >> >> >> > >>>>>> components try to give Flex-friendly names for
> > >> >>HTMLElements.
> > >> >> >> >>Some
> > >> >> >> >> > >>>>>> component in Basic needs to inject a span into the
> > >>DOM.
> > >> >>In
> > >> >> >>a
> > >> >> >> >>few
> > >> >> >> >> > >>>>>> seconds
> > >> >> >> >> > >>>>>> of looking at a Google web page, I did not see any
> > >>divs
> > >> >>with
> > >> >> >> >>text
> > >> >> >> >> as
> > >> >> >> >> > >>>>>> children.  I saw spans.  The Divs all contained
> other
> > >> >> >>elements.
> > >> >> >> >> > >>>>>>
> > >> >> >> >> > >>>>>> I don't create HTML web pages for a living, but if I
> > >> >>were to
> > >> >> >> >> place a
> > >> >> >> >> > >>>>>> label
> > >> >> >> >> > >>>>>> over a control like I often see in Flex, I would not
> > >>wrap
> > >> >> >>the
> > >> >> >> >> label
> > >> >> >> >> > >>> in
> > >> >> >> >> > >>> a
> > >> >> >> >> > >>>>>> Div.  The control would be div, so I would us a span
> > >>or
> > >> >>just
> > >> >> >> >>plain
> > >> >> >> >> > >>> text.
> > >> >> >> >> > >>>>>> If I looked at the final DOM and saw Divs around
> every
> > >> >> >>chunk of
> > >> >> >> >> > >>> text, I
> > >> >> >> >> > >>>>>> would think there is something heavy about the
> > >>framework.
> > >> >> >> >> > >>>>>>
> > >> >> >> >> > >>>>>> Again, the goal is to encapsulate common patterns.
> > >>Label
> > >> >> >> >>combined
> > >> >> >> >> > >>> with
> > >> >> >> >> > >>>>>> some control is trying to replicate common patterns
> > >>for
> > >> >> >> >>labeling
> > >> >> >> >> > >>>>>> controls.
> > >> >> >> >> > >>>>>> You are trying to solve the common pattern of
> > >>truncating
> > >> >> >>text.
> > >> >> >> >> That
> > >> >> >> >> > >>>>>> will
> > >> >> >> >> > >>>>>> require a Div. But truncation, or even width/height
> is
> > >> >>not
> > >> >> >> >> something
> > >> >> >> >> > >>>>>> that
> > >> >> >> >> > >>>>>> should be built into Label for PAYG reasons.  IMO,
> you
> > >> >> >>should
> > >> >> >> >> > >>> create a
> > >> >> >> >> > >>>>>> different component with a different name.
> > >> >> >>TruncatingLabel, or
> > >> >> >> >> > >>>>>> LabelWIthTruncation.
> > >> >> >> >> > >>>>>>
> > >> >> >> >> > >>>>>> My 2 cents,
> > >> >> >> >> > >>>>>> -Alex
> > >> >> >> >> > >>>>>>
> > >> >> >> >> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <
> harbs.lists@gmail.com>
> > >> >> wrote:
> > >> >> >> >> > >>>>>>
> > >> >> >> >> > >>>>>>> Why is span lighter than div?
> > >> >> >> >> > >>>>>>>
> > >> >> >> >> > >>>>>>> Inline and nowrap is not specific to span. AFAICT,
> > >> >>there’s
> > >> >> >> >> nothing
> > >> >> >> >> > >>>>>>> specific to snap which fits Label better than div.
> > >> >> >> >> > >>>>>>>
> > >> >> >> >> > >>>>>>> As far as components which “does” span: Besides
> Span
> > >>in
> > >> >> >>HTML,
> > >> >> >> >>we
> > >> >> >> >> > >>> have
> > >> >> >> >> > >>>>>>> HTMLText in Basic which encapsulates span.
> > >> >> >> >> > >>>>>>>
> > >> >> >> >> > >>>>>>> I can revert the change I made to Label, but I have
> > >>not
> > >> >> >>seen
> > >> >> >> >>any
> > >> >> >> >> > >>>>>>> downside
> > >> >> >> >> > >>>>>>> to using div for Label. It seems to me that there’s
> > >> >> >>nothing in
> > >> >> >> >> the
> > >> >> >> >> > >>>>>>> Label
> > >> >> >> >> > >>>>>>> promise which dictates using span.
> > >> >> >> >> > >>>>>>>
> > >> >> >> >> > >>>>>>> Harbs
> > >> >> >> >> > >>>>>>>
> > >> >> >> >> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui
> > >> >> >> >> <aharui@adobe.com.INVALID
> > >> >> >> >> > >
> > >> >> >> >> > >>>>>>>> wrote:
> > >> >> >> >> > >>>>>>>>
> > >> >> >> >> > >>>>>>>>
> > >> >> >> >> > >>>>>>>>
> > >> >> >> >> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <
> harbs.lists@gmail.com
> > >
> > >> >> >>wrote:
> > >> >> >> >> > >>>>>>>>
> > >> >> >> >> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element
> > >>component
> > >> >>set
> > >> >> >> >>which
> > >> >> >> >> > >>> more
> > >> >> >> >> > >>>>>>>>> thinly wraps HTML elements.
> > >> >> >> >> > >>>>>>>>>
> > >> >> >> >> > >>>>>>>>> I can’t think of any reason why Label would be
> > >>better
> > >> >>as
> > >> >> >>a
> > >> >> >> >>span
> > >> >> >> >> > >>> than
> > >> >> >> >> > >>>>>>>>> a
> > >> >> >> >> > >>>>>>>>> div. It seems to me that simply using div instead
> > >>of
> > >> >>span
> > >> >> >> >>would
> > >> >> >> >> > >>> make
> > >> >> >> >> > >>>>>>>>> Label more versatile. Am I missing something?
> > >> >> >> >> > >>>>>>>>
> > >> >> >> >> > >>>>>>>> You may be missing that the only real goal of
> Royale
> > >> >>is to
> > >> >> >> >> > >>> encapsulate
> > >> >> >> >> > >>>>>>>> popular patterns.  Pretty sure I've seen span used
> > >>on
> > >> >>many
> > >> >> >> >>web
> > >> >> >> >> > >>> pages,
> > >> >> >> >> > >>>>>>>> so
> > >> >> >> >> > >>>>>>>> we need a component that does what it does,
> > >>including
> > >> >> >> >>assuming
> > >> >> >> >> > >>> inline
> > >> >> >> >> > >>>>>>>> instead of block display.  Similarly, what would
> you
> > >> >>think
> > >> >> >> >>of a
> > >> >> >> >> > >>>>>>>> framework
> > >> >> >> >> > >>>>>>>> that had a HelloWorld that used a div instead of a
> > >> >>span?
> > >> >> >>You
> > >> >> >> >> > >>> might
> > >> >> >> >> > >>>>>>>> think
> > >> >> >> >> > >>>>>>>> it is too heavy.
> > >> >> >> >> > >>>>>>>>
> > >> >> >> >> > >>>>>>>> Per PAYG, if span doesn’t' support certain
> features,
> > >> >>then
> > >> >> >>you
> > >> >> >> >> > >>> create
> > >> >> >> >> > >>> a
> > >> >> >> >> > >>>>>>>> LabelWithTruncation and have it use a Div if you
> > >>need
> > >> >>to.
> > >> >> >> >> > >>>>>>>>
> > >> >> >> >> > >>>>>>>> My 2 cents,
> > >> >> >> >> > >>>>>>>> -Alex
> > >> >> >> >> > >>>>>>>>>
> > >> >> >> >> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent
> > >> >> >> >><pent@adobe.com.INVALID
> > >> >> >> >> >
> > >> >> >> >> > >>>>>>>>>> wrote:
> > >> >> >> >> > >>>>>>>>>>
> > >> >> >> >> > >>>>>>>>>> Label was one of the very first components and
> the
> > >> >>idea
> > >> >> >>was
> > >> >> >> >> > >>>>>>>>>> minimalism.
> > >> >> >> >> > >>>>>>>>>> Button was <button> and TextInput was <input
> > >> >> >>type="text">
> > >> >> >> >>and
> > >> >> >> >> > >>> Label
> > >> >> >> >> > >>>>>>>>>> was
> > >> >> >> >> > >>>>>>>>>> <span>.
> > >> >> >> >> > >>>>>>>>>>
> > >> >> >> >> > >>>>>>>>>> I'm wondering if we should have NativeButton,
> > >> >> >>NativeLabel,
> > >> >> >> >> etc.
> > >> >> >> >> > >>>>>>>>>> which
> > >> >> >> >> > >>>>>>>>>> would be these minimal elements and have others
> > >>that
> > >> >>are
> > >> >> >> >><div>
> > >> >> >> >> > >>>>>>>>>> wrapping.
> > >> >> >> >> > >>>>>>>>>> For instance, ImageAndTextButton is a
> <button><img
> > >> >> >> >> > >>>>>>>>>> src="goo.jpg">Label
> > >> >> >> >> > >>>>>>>>>> Here</button> which works but the alignment is
> > >>weird
> > >> >>so
> > >> >> >> >>maybe
> > >> >> >> >> > >>>>>>>>>> ImageAndTextButton should be a
> > >><div><img>Text</div>
> > >> >> >>which
> > >> >> >> >>can
> > >> >> >> >> be
> > >> >> >> >> > >>>>>>>>>> aligned
> > >> >> >> >> > >>>>>>>>>> and styled better.
> > >> >> >> >> > >>>>>>>>>>
> > >> >> >> >> > >>>>>>>>>> Anyway, that's the reason: simplicity.
> > >> >> >> >> > >>>>>>>>>>
> > >> >> >> >> > >>>>>>>>>> ‹peter
> > >> >> >> >> > >>>>>>>>>>
> > >> >> >> >> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs"
> > >><ha...@gmail.com>
> > >> >> >> wrote:
> > >> >> >> >> > >>>>>>>>>>
> > >> >> >> >> > >>>>>>>>>>> Is there a reason that the element type of
> Basic
> > >> >>Label
> > >> >> >>is
> > >> >> >> >> span?
> > >> >> >> >> > >>>>>>>>>>>
> > >> >> >> >> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label
> > >>and
> > >> >>it
> > >> >> >> >>does
> > >> >> >> >> not
> > >> >> >> >> > >>>>>>>>>>> seem
> > >> >> >> >> > >>>>>>>>>>> to
> > >> >> >> >> > >>>>>>>>>>> work because spans donąt really have a working
> > >> >>width.
> > >> >> >> >> Switching
> > >> >> >> >> > >>> the
> > >> >> >> >> > >>>>>>>>>>> element type to div seems to make it work.
> > >> >> >> >> > >>>>>>>>>>>
> > >> >> >> >> > >>>>>>>>>>> Harbs
> > >> >> >> >> > >>>>>>>>>>
> > >> >> >> >> > >>>>>>>>>
> > >> >> >> >> > >>>>>>>>
> > >> >> >> >> > >>>>>>>
> > >> >> >> >> > >>>>>>
> > >> >> >> >> > >>>>>
> > >> >> >> >> > >>>>
> > >> >> >> >> > >>>
> > >> >> >> >> > >>>
> > >> >> >> >> > >>
> > >> >> >> >> > >>
> > >> >> >> >> > >> --
> > >> >> >> >> > >> Carlos Rovira
> > >> >> >> >> > >> https://na01.safelinks.protection.outlook.com/?url=
> > >> >> >> >> > http%3A%2F%2Fabout.me%2
> > >> >> >> >><https://na01.safelinks.protection.outlook.com/?url=
> > >> >> >> https%3A%2F%2Fna01.sa
> > >> >> >>
> > >> >> >>>>felinks&data=02%7C01%7Caharui%40adobe.com%
> > >> >> 7C3664f690b3da4e4aefab08d58ac
> > >> >> >>>>c
> > >> >> >> 7
> > >> >> >> >>bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> > >> >> >> 7C636567533215453966&sdata
> > >> >> >>
> > >>>>=exoH%2BPKzuyM%2BykE65GQeHk%2BjPAZSsUFjsKwx3BRvjsk%3D&reserved=0.
> > >> >> >> >> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
> > >> >> >> >> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com
> > >> >> >>
> > >> >> >>>><https://na01.safelinks.protection.outlook.com/?url=
> > >> >> http%3A%2F%2F40adob
> > >> >> >>>>e
> > >> >> >> .
> > >> >> >>
> > >> >> >>>>com%2F&data=02%7C01%7Caharui%40adobe.com%
> > >> >> 7C3664f690b3da4e4aefab08d58acc
> > >> >> >> 7b
> > >> >> >> >>f0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> > >> >> >> 7C636567533215453966&sdata=
> > >> >> >> >>ewhtNMkSjHssIseUSvxq9etF%2FtrcA%2Buqk3sZlJkjHuc%3D&reserved=0
> > >> >> >> >> >%
> > >> >> >> >> > 7Cae539925833d453aaa2e08d5
> > >> >> >> >> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> > >> >> >> >> > 7C636567454874235113&s
> > >> >> >> >> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY
> > >> >> 1WVtz2xsNvc%3D&reserved=0
> > >> >> >> >> >
> > >> >> >> >> >
> > >> >> >> >>
> > >> >> >>
> > >> >> >>
> > >> >>
> > >> >>
> > >>
> > >>
> >
> >
>



-- 
Carlos Rovira
http://about.me/carlosrovira

Re: Label

Posted by OmPrakash Muppirala <bi...@gmail.com>.
Alex,

After reading through the whole thread, I now agree with you.

To be frank, I understand your frustration.  Please take a break.  You
don't need to participate in every discussion :-)

Thanks,
Om

On Thu, Mar 15, 2018 at 9:38 PM, Alex Harui <ah...@adobe.com.invalid>
wrote:

> For Migrating Users we are building a set of emulation components.  They
> will not be PAYG.  They are intended to reduce the number of changes to
> your Flex code base.
>
> But if after migrating, performance becomes an issue, users will be
> encouraged to break apart the emulation components into their Basic
> components and only the beads they need.  The Spark Label will be heavier
> than MX Label because it has to carry around the "maxDisplayedLines"
> property.  Spark Label defaulted to a single line, IIRC.
>
> Also note that the underlying behavior in Flex/Flash was to default to a
> single line unless you asked for more.  Span was an attempt to keep things
> from unintentionally wrapping, which I believe is the browser default.
>
> I think it would cause questions if there were no spans where most people
> expect them in Royale output.  Unless we convince the whole world that div
> really should replace span everywhere.
>
> Meanwhile, back to trying to create these emulation components...
>
> -Alex
>
> On 3/15/18, 9:22 PM, "Greg Dove" <gr...@gmail.com> wrote:
>
> >Alex, that may have been true for mx Label, but it is not the case for
> >Spark. In the end it does become relevant for 'migrating users' migrating
> >Flex 4/Spark apps.
> >
> >I'm just pointing this out. I was confused/annoyed when I used it last
> >year
> >expecting it to be similar to what I had been using not so long ago in
> >Flex. If I was confused, I am probably not unique (I might be!). Yes, I
> >made something else to do the job or found multilinelabel - I can't
> >remember now. But maybe there is no extra 'pay' to use div? Anyhow, I am
> >stopping further comments. Over to you guys.
> >
> >
> >
> >
> >
> >On Fri, Mar 16, 2018 at 5:13 PM, Alex Harui <ah...@adobe.com.invalid>
> >wrote:
> >
> >>
> >>
> >> On 3/15/18, 8:47 PM, "Greg Dove" <gr...@gmail.com> wrote:
> >>
> >> >  Label is a single-line sequence of text.
> >> >
> >> >I think that is the statement that might be in the process of being
> >> >indirectly debated.
> >> >Is it documented as such?
> >>
> >> Really?  We're going to nitpick over the completeness of our doc?  There
> >> is a MultilineLabel component for a reason.  I did not like adding more
> >> blades to the swiss-army knife in Spark Label.  That wasn't PAYG.  MX
> >> Label doc is here:
> >>
> >>https://na01.safelinks.protection.outlook.com/?url=
> https%3A%2F%2Fhelp.ado
> >>be.com%2Fen_US%2FFlashPlatform%2Freference%
> 2F&data=02%7C01%7Caharui%40ado
> >>be.com%7C60c34e7c67b34f47a89008d58af59006%7Cfa7b1b5a7b34438794aed2c178de
> c
> >>ee1%7C0%7C0%7C636567709645648492&sdata=YVjrfzkZGp%
> 2BOHAyLmzbsMJQuY9r1%2BB
> >>yJ2b%2B6tQwm5ho%3D&reserved=0
> >> actionscript/3/mx/cont
> >> rols/Label.html
> >>
> >> It says:  "The Label control displays a single line of noneditable
> >>text."
> >>
> >> Still trying to help our migrating users...
> >> -Alex
> >> >
> >> >On Fri, Mar 16, 2018 at 4:37 PM, Alex Harui <ah...@adobe.com.invalid>
> >> >wrote:
> >> >
> >> >> Because, this isn't an issue of performance.  We give our users
> >>choices
> >> >> and a toolkit to replicate ANY HTML tree they want to.  We are
> >>proposing
> >> >> to replace what is to me the most obvious Flex-like component name
> >>for
> >> >> injecting a span into the DOM.  Label is a single-line sequence of
> >>text.
> >> >> So is Span.
> >> >>
> >> >> I'm not seeing a huge performance difference.  If you think it is
> >> >> significant enough that our users should be alerted to use
> >>SizeableLabel
> >> >> or whatever we call the Div-wrapping-text version, start blogging it
> >> >>after
> >> >> you validate your test case.  I noticed that the number of Spans the
> >> >>test
> >> >> appears to report are higher than the number of Divs, but that might
> >>be
> >> >>a
> >> >> false alarm.  You can be a hero in the web world if you are right and
> >> >> change the advice I see elsewhere on the net to use Span for inline
> >> >> elements and Div for other things.  Even the JSPerf page is using
> >>spans.
> >> >> Tell them to replace them.
> >> >>
> >> >> Meanwhile, I'm going back to try to migrate an app.  Sure wish we had
> >> >>more
> >> >> people helping on that.
> >> >>
> >> >> -Alex
> >> >>
> >> >>
> >> >> We can certainly give them advice that SizedLabel is faster than
> >>Label
> >> >>if
> >> >> that's important, but the different didn't seem that significant.
> >> >>
> >> >> On 3/15/18, 6:14 PM, "omuppi1@gmail.com on behalf of OmPrakash
> >> >>Muppirala"
> >> >> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
> >> >>
> >> >> >If creating a div is more performant than creating a span, why
> >>insist
> >> >>on
> >> >> >using a span?  How is that pay as you go?
> >> >> >
> >> >> >Thanks,
> >> >> >Om
> >> >> >
> >> >> >On Thu, Mar 15, 2018 at 5:19 PM, Alex Harui
> >><ah...@adobe.com.invalid>
> >> >> >wrote:
> >> >> >
> >> >> >> A Flex Label, and any Flex component was a swiss-army knife of
> >> >>features
> >> >> >> and not PAYG.  I have not given up on PAYG.  I think it will pay
> >>off
> >> >> >>when
> >> >> >> we get to the last mile.  If we don't stick to PAYG, I think we
> >>will
> >> >> >>just
> >> >> >> repeat the history of Flex and produce a fat framework that can't
> >>run
> >> >> >> everywhere.  Yes, a Div would probably better mimic a Flex Label,
> >>but
> >> >> >>the
> >> >> >> Basic label is not a swiss-army knife.
> >> >> >>
> >> >> >> This article is old, but I think it says you can't put a Div in a
> >> >>Span:
> >> >> >>
> >> >> >>https://na01.safelinks.protection.outlook.com/?url=
> >> >> http%3A%2F%2Fdoctype.c
> >> >> >>om%2Fspan-contain-div-html5&data=02%7C01%7Caharui%40adobe.com
> >> >> %7C77b57b271
> >> >> >>ef7423114c208d58ae0d810%7Cfa7b1b5a7b34438794aed2c178de
> >> >> cee1%7C0%7C0%7C6365
> >> >> >>67620658308491&sdata=o9msOjZpbwywflSfgJDebUdMM3hgNP
> >> >> dN%2Btn%2BrcSZsV4%3D&r
> >> >> >>eserved=0
> >> >> >>
> >> >> >> I think you can if you change the span's display to "block" but I
> >> >>think
> >> >> >> that is essentially replacing the element.
> >> >> >>
> >> >> >> Everything, including width and truncation should be opt-in, PAYG.
> >> >> >>Make a
> >> >> >> LabelWithWidth or SizeableLabel component that is a div if you
> >>want.
> >> >> >>
> >> >> >> Again, the goal is to encapsulate common patterns.  I am not
> >>seeing a
> >> >> >>lot
> >> >> >> of Divs wrapping text nodes.  I see lots of spans wrapping text
> >> >>nodes.
> >> >> >> Basic Label is that pattern.  The Basic component set would be
> >> >> >>incomplete
> >> >> >> if there wasn't a component that could inject a Span into the DOM.
> >> >> >>Create
> >> >> >> another component that is a Div wrapping a text node, give it a
> >> >> >>different
> >> >> >> name, and let's move on.
> >> >> >>
> >> >> >> Alina used Label quite often without setting width.  No need for
> >> >>those
> >> >> >> instances to be a Div, AFAICT.
> >> >> >>
> >> >> >> Do we even need to discuss span vs div if the truncation bead will
> >> >>work
> >> >> >>by
> >> >> >> setting display:block?
> >> >> >>
> >> >> >> We have a huge opportunity here to get another app migrated and
> >> >>prove to
> >> >> >> the world that Royale is the right choice.  But we keep discussing
> >> >>stuff
> >> >> >> that IMO, isn't really moving the big pieces forward.  But, IMO,
> >>we
> >> >> >>should
> >> >> >> not compromise on PAYG philosophy and patterns.
> >> >> >>
> >> >> >> My 2 cents,
> >> >> >> -Alex
> >> >> >>
> >> >> >> On 3/15/18, 4:27 PM, "omuppi1@gmail.com on behalf of OmPrakash
> >> >> >>Muppirala"
> >> >> >> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
> >> >> >>
> >> >> >> >FWIW, it seems like creating divs is faster than creating spans.
> >> >> >> >https://na01.safelinks.protection.outlook.com/?url=
> >> >> >> https%3A%2F%2Fjsperf.co
> >> >> >> >m%2Fspan-vs-div-creation&data=02%7C01%7Caharui%40adobe.com
> >> >> >> %7C3664f690b3da4
> >> >> >> >e4aefab08d58acc7bf0%7Cfa7b1b5a7b34438794aed2c178de
> >> >> >> cee1%7C0%7C0%7C636567533
> >> >> >> >215453966&sdata=oPPp2e9aRbQ%2FngKbcFMHMCmXi%2BKa%2B%
> >> >> >> 2F0aA98XFFqxhFA%3D&res
> >> >> >> >erved=0
> >> >> >> >
> >> >> >> >Thanks,
> >> >> >> >Om
> >> >> >> >
> >> >> >> >On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <gr...@gmail.com>
> >> >> wrote:
> >> >> >> >
> >> >> >> >> Observing from the sidelines, fwiw I agree with Harbs here.
> >>Span
> >> >>to
> >> >> >>me
> >> >> >> >> makes more sense as part of the text value of a label and not
> >>as
> >> >>the
> >> >> >> >>basis
> >> >> >> >> for the representation of the Label itself - div seems closer
> >>to
> >> >> >>what I
> >> >> >> >>was
> >> >> >> >> used to with legacy Flex (which may no longer be the
> >>'reference'
> >> >>for
> >> >> >> >> choosing an implementation).
> >> >> >> >> I don't think there is any semantic or other reason that makes
> >> >>span
> >> >> >>the
> >> >> >> >> logical default tag for Label, in fact I recall that being a
> >> >>problem
> >> >> >> >>many
> >> >> >> >> times with some work I was involved with last year using
> >>FlexJS.
> >> >> >> >> But maybe I am missing something in terms of understanding.
> >> >> >> >>
> >> >> >> >>
> >> >> >> >>
> >> >> >> >>
> >> >> >> >> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <harbs.lists@gmail.com
> >
> >> >> >>wrote:
> >> >> >> >>
> >> >> >> >> > I’m suggesting to change it because span does not fit the use
> >> >>case
> >> >> >>of
> >> >> >> >> > Label. Width and truncate are just two applications which
> >> >>indicate
> >> >> >> >>that
> >> >> >> >> > span is not the correct element. I’m pretty sure I had other
> >> >>edge
> >> >> >> >>cases
> >> >> >> >> > which were likely effected by the fact that Label is a span,
> >> >> >>although
> >> >> >> >>I’m
> >> >> >> >> > not positive.
> >> >> >> >> >
> >> >> >> >> > I disagree with your distinction between span and div.
> >> >> >> >> >
> >> >> >> >> > Both span and div can have children. Spans can contain divs
> >>and
> >> >> >>divs
> >> >> >> >>can
> >> >> >> >> > contain spans. At its core, Span has nothing to do with text.
> >> >>It’s
> >> >> >> >>just
> >> >> >> >> > often used for text because text (within its container) is
> >> >>inline.
> >> >> >> >> >
> >> >> >> >> > MDN says[1] "<span> is very much like a <div> element, but
> >><div>
> >> >> >>is a
> >> >> >> >> > block-level element whereas a <span> is an inline element.”
> >> >> >> >> >
> >> >> >> >> > Label is *not* necessarily an inline element. We have all
> >>kinds
> >> >>of
> >> >> >> >> layouts
> >> >> >> >> > for Label. Many (most?) of them are not inline.
> >> >> >> >> >
> >> >> >> >> > If you feel really strongly about this, I’ll revert even
> >>though
> >> >>I
> >> >> >> >> disagree.
> >> >> >> >> >
> >> >> >> >> > FWIW, the truncate bead does not need to change the element
> >> >>type.
> >> >> >>It
> >> >> >> >>can
> >> >> >> >> > explicitly set the display of the element to block.
> >> >> >> >> >
> >> >> >> >> > Harbs
> >> >> >> >> >
> >> >> >> >> >
> >> >> >> >>[1]https://na01.safelinks.protection.outlook.com/?url=
> >> >> >> https%3A%2F%2Fdevel
> >> >> >> >>oper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
> >> >> >> 2Fspan&data=02%7C0
> >> >> >> >>1%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> >> >> >> 7bf0%7Cfa7b1b5a7b344
> >> >> >> >>38794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
> >> >> >> xrtF9H7%2BjFzqGDax
> >> >> >> >>nj0%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0 <
> >> >> >> >> >
> >> >> >> >>https://na01.safelinks.protection.outlook.com/?url=
> >> >> >> https%3A%2F%2Fdevelope
> >> >> >> >>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
> >> >> >> 2Fspan&data=02%7C01%7
> >> >> >> >>Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> >> >> >> 7bf0%7Cfa7b1b5a7b344387
> >> >> >> >>94aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
> >> >> >> xrtF9H7%2BjFzqGDaxnj0
> >> >> >> >>%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0>
> >> >> >> >> >
> >> >> >> >> > > On Mar 15, 2018, at 11:25 PM, Alex Harui
> >> >> >><ah...@adobe.com.INVALID>
> >> >> >> >> > wrote:
> >> >> >> >> > >
> >> >> >> >> > > Label in Flex and Royale is not intended to have any
> >>children
> >> >> >>(other
> >> >> >> >> than
> >> >> >> >> > > bold, italic and other text markup).  Span represents that.
> >> >>Div
> >> >> >> >>does
> >> >> >> >> > not.
> >> >> >> >> > > You are suggesting changing to div JUST IN CASE someone
> >>needs
> >> >>to
> >> >> >> >>set a
> >> >> >> >> > > width and/or truncate.  Just-in-case code is not PAYG.
> >> >> >> >> > >
> >> >> >> >> > > My 2 cents,
> >> >> >> >> > > -Alex
> >> >> >> >> > >
> >> >> >> >> > > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
> >> >> >> >> > carlos.rovira@gmail.com> on behalf of Carlos Rovira"
> >> >> >> >> > > <carlos.rovira@gmail.com <ma...@gmail.com>
> >>on
> >> >> >>behalf
> >> >> >> >>of
> >> >> >> >> > carlosrovira@apache.org <ma...@apache.org>>
> >> wrote:
> >> >> >> >> > >
> >> >> >> >> > >> And why not change IBeadView in Label for a view that
> >>uses a
> >> >>div
> >> >> >> >>when
> >> >> >> >> > >> needed? ;)
> >> >> >> >> > >> in the other cases, maintains the span
> >> >> >> >> > >>
> >> >> >> >> > >> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
> >> >> >> >> > >>
> >> >> >> >> > >>> I’m still not understanding you. What about Label says
> >>it’s
> >> >>a
> >> >> >>span
> >> >> >> >> > >>> instead
> >> >> >> >> > >>> of a div? Why is making it a div not PAYG? Span simply
> >> >>limits
> >> >> >> >>Label
> >> >> >> >> > >>> unnecessarily. I think span is not the appropriate
> >>element
> >> >>for
> >> >> >> >>Label.
> >> >> >> >> > >>>
> >> >> >> >> > >>>> A Label without width should grow to the size of its
> >>text.
> >> >> >>Isn't
> >> >> >> >> that
> >> >> >> >> > >>> how
> >> >> >> >> > >>>> it worked in Flex?
> >> >> >> >> > >>>
> >> >> >> >> > >>> Sure, and a div does that too. In Flex, a label could
> >>have a
> >> >> >>width
> >> >> >> >> too
> >> >> >> >> > >>> if
> >> >> >> >> > >>> specified. Spans cannot.
> >> >> >> >> > >>>
> >> >> >> >> > >>> Harbs
> >> >> >> >> > >>>
> >> >> >> >> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui
> >> >> >> >><ah...@adobe.com.INVALID>
> >> >> >> >> > >>> wrote:
> >> >> >> >> > >>>>
> >> >> >> >> > >>>> Have the truncation bead swap the span for div.  Again,
> >> >>some
> >> >> >> >> component
> >> >> >> >> > >>> has
> >> >> >> >> > >>>> to put a span in the DOM.  Label has been just fine for
> >> >>that
> >> >> >>so
> >> >> >> >>far.
> >> >> >> >> > >>>>
> >> >> >> >> > >>>> A Label without width should grow to the size of its
> >>text.
> >> >> >>Isn't
> >> >> >> >> that
> >> >> >> >> > >>> how
> >> >> >> >> > >>>> it worked in Flex?
> >> >> >> >> > >>>>
> >> >> >> >> > >>>> Maybe Label should be refactored to not have
> >>width/height
> >> >> >> >>properties
> >> >> >> >> > >>> but
> >> >> >> >> > >>>> IMO we have bigger fish to fry.
> >> >> >> >> > >>>>
> >> >> >> >> > >>>> I'm sure Div is used to wrap text in some frameworks,
> >>but
> >> >> >>those
> >> >> >> >> > >>> frameworks
> >> >> >> >> > >>>> probably aren't PAYG.  In Alina's app, Label has a usage
> >> >> >>score of
> >> >> >> >> 69,
> >> >> >> >> > >>> but
> >> >> >> >> > >>>> Label.width has a score of only 5.  We will have her use
> >> >> >> >> > >>>> LabelWithTruncation or add the truncation bead on the
> >>few
> >> >> >>labels
> >> >> >> >> that
> >> >> >> >> > >>> need
> >> >> >> >> > >>>>
> >> >> >> >> > >>>> My 2 cents,
> >> >> >> >> > >>>> -Alex
> >> >> >> >> > >>>>
> >> >> >> >> > >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com>
> >> >>wrote:
> >> >> >> >> > >>>>
> >> >> >> >> > >>>>> But we already have a truncation bead. The only reason
> >>it
> >> >> >> >>doesn’t
> >> >> >> >> > >>> work
> >> >> >> >> > >>> in
> >> >> >> >> > >>>>> Label is because spans don’t have widths.
> >> >> >> >> > >>>>>
> >> >> >> >> > >>>>> Label is not something which should flow beyond its
> >> >>bounds —
> >> >> >> >>which
> >> >> >> >> is
> >> >> >> >> > >>>>> what span is useful for. I still don’t see why you
> >>think
> >> >>span
> >> >> >> >>makes
> >> >> >> >> > >>> more
> >> >> >> >> > >>>>> sense.
> >> >> >> >> > >>>>>
> >> >> >> >> > >>>>> FWIW, div *is* used as a container for text in various
> >> >> >> >>frameworks.
> >> >> >> >> > >>>>>
> >> >> >> >> > >>>>> My $0.02,
> >> >> >> >> > >>>>> Harbs
> >> >> >> >> > >>>>>
> >> >> >> >> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui
> >> >> >> >><aharui@adobe.com.INVALID
> >> >> >> >> >
> >> >> >> >> > >>>>>> wrote:
> >> >> >> >> > >>>>>>
> >> >> >> >> > >>>>>> AIUI, "inline" is the default display style for Span.
> >> >> >>"block"
> >> >> >> >>is
> >> >> >> >> > >>> the
> >> >> >> >> > >>>>>> default for Div.  HTML flows inline by default for
> >>just
> >> >> >>plain
> >> >> >> >> text.
> >> >> >> >> > >>>>>> Basic
> >> >> >> >> > >>>>>> components try to give Flex-friendly names for
> >> >>HTMLElements.
> >> >> >> >>Some
> >> >> >> >> > >>>>>> component in Basic needs to inject a span into the
> >>DOM.
> >> >>In
> >> >> >>a
> >> >> >> >>few
> >> >> >> >> > >>>>>> seconds
> >> >> >> >> > >>>>>> of looking at a Google web page, I did not see any
> >>divs
> >> >>with
> >> >> >> >>text
> >> >> >> >> as
> >> >> >> >> > >>>>>> children.  I saw spans.  The Divs all contained other
> >> >> >>elements.
> >> >> >> >> > >>>>>>
> >> >> >> >> > >>>>>> I don't create HTML web pages for a living, but if I
> >> >>were to
> >> >> >> >> place a
> >> >> >> >> > >>>>>> label
> >> >> >> >> > >>>>>> over a control like I often see in Flex, I would not
> >>wrap
> >> >> >>the
> >> >> >> >> label
> >> >> >> >> > >>> in
> >> >> >> >> > >>> a
> >> >> >> >> > >>>>>> Div.  The control would be div, so I would us a span
> >>or
> >> >>just
> >> >> >> >>plain
> >> >> >> >> > >>> text.
> >> >> >> >> > >>>>>> If I looked at the final DOM and saw Divs around every
> >> >> >>chunk of
> >> >> >> >> > >>> text, I
> >> >> >> >> > >>>>>> would think there is something heavy about the
> >>framework.
> >> >> >> >> > >>>>>>
> >> >> >> >> > >>>>>> Again, the goal is to encapsulate common patterns.
> >>Label
> >> >> >> >>combined
> >> >> >> >> > >>> with
> >> >> >> >> > >>>>>> some control is trying to replicate common patterns
> >>for
> >> >> >> >>labeling
> >> >> >> >> > >>>>>> controls.
> >> >> >> >> > >>>>>> You are trying to solve the common pattern of
> >>truncating
> >> >> >>text.
> >> >> >> >> That
> >> >> >> >> > >>>>>> will
> >> >> >> >> > >>>>>> require a Div. But truncation, or even width/height is
> >> >>not
> >> >> >> >> something
> >> >> >> >> > >>>>>> that
> >> >> >> >> > >>>>>> should be built into Label for PAYG reasons.  IMO, you
> >> >> >>should
> >> >> >> >> > >>> create a
> >> >> >> >> > >>>>>> different component with a different name.
> >> >> >>TruncatingLabel, or
> >> >> >> >> > >>>>>> LabelWIthTruncation.
> >> >> >> >> > >>>>>>
> >> >> >> >> > >>>>>> My 2 cents,
> >> >> >> >> > >>>>>> -Alex
> >> >> >> >> > >>>>>>
> >> >> >> >> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com>
> >> >> wrote:
> >> >> >> >> > >>>>>>
> >> >> >> >> > >>>>>>> Why is span lighter than div?
> >> >> >> >> > >>>>>>>
> >> >> >> >> > >>>>>>> Inline and nowrap is not specific to span. AFAICT,
> >> >>there’s
> >> >> >> >> nothing
> >> >> >> >> > >>>>>>> specific to snap which fits Label better than div.
> >> >> >> >> > >>>>>>>
> >> >> >> >> > >>>>>>> As far as components which “does” span: Besides Span
> >>in
> >> >> >>HTML,
> >> >> >> >>we
> >> >> >> >> > >>> have
> >> >> >> >> > >>>>>>> HTMLText in Basic which encapsulates span.
> >> >> >> >> > >>>>>>>
> >> >> >> >> > >>>>>>> I can revert the change I made to Label, but I have
> >>not
> >> >> >>seen
> >> >> >> >>any
> >> >> >> >> > >>>>>>> downside
> >> >> >> >> > >>>>>>> to using div for Label. It seems to me that there’s
> >> >> >>nothing in
> >> >> >> >> the
> >> >> >> >> > >>>>>>> Label
> >> >> >> >> > >>>>>>> promise which dictates using span.
> >> >> >> >> > >>>>>>>
> >> >> >> >> > >>>>>>> Harbs
> >> >> >> >> > >>>>>>>
> >> >> >> >> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui
> >> >> >> >> <aharui@adobe.com.INVALID
> >> >> >> >> > >
> >> >> >> >> > >>>>>>>> wrote:
> >> >> >> >> > >>>>>>>>
> >> >> >> >> > >>>>>>>>
> >> >> >> >> > >>>>>>>>
> >> >> >> >> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <harbs.lists@gmail.com
> >
> >> >> >>wrote:
> >> >> >> >> > >>>>>>>>
> >> >> >> >> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element
> >>component
> >> >>set
> >> >> >> >>which
> >> >> >> >> > >>> more
> >> >> >> >> > >>>>>>>>> thinly wraps HTML elements.
> >> >> >> >> > >>>>>>>>>
> >> >> >> >> > >>>>>>>>> I can’t think of any reason why Label would be
> >>better
> >> >>as
> >> >> >>a
> >> >> >> >>span
> >> >> >> >> > >>> than
> >> >> >> >> > >>>>>>>>> a
> >> >> >> >> > >>>>>>>>> div. It seems to me that simply using div instead
> >>of
> >> >>span
> >> >> >> >>would
> >> >> >> >> > >>> make
> >> >> >> >> > >>>>>>>>> Label more versatile. Am I missing something?
> >> >> >> >> > >>>>>>>>
> >> >> >> >> > >>>>>>>> You may be missing that the only real goal of Royale
> >> >>is to
> >> >> >> >> > >>> encapsulate
> >> >> >> >> > >>>>>>>> popular patterns.  Pretty sure I've seen span used
> >>on
> >> >>many
> >> >> >> >>web
> >> >> >> >> > >>> pages,
> >> >> >> >> > >>>>>>>> so
> >> >> >> >> > >>>>>>>> we need a component that does what it does,
> >>including
> >> >> >> >>assuming
> >> >> >> >> > >>> inline
> >> >> >> >> > >>>>>>>> instead of block display.  Similarly, what would you
> >> >>think
> >> >> >> >>of a
> >> >> >> >> > >>>>>>>> framework
> >> >> >> >> > >>>>>>>> that had a HelloWorld that used a div instead of a
> >> >>span?
> >> >> >>You
> >> >> >> >> > >>> might
> >> >> >> >> > >>>>>>>> think
> >> >> >> >> > >>>>>>>> it is too heavy.
> >> >> >> >> > >>>>>>>>
> >> >> >> >> > >>>>>>>> Per PAYG, if span doesn’t' support certain features,
> >> >>then
> >> >> >>you
> >> >> >> >> > >>> create
> >> >> >> >> > >>> a
> >> >> >> >> > >>>>>>>> LabelWithTruncation and have it use a Div if you
> >>need
> >> >>to.
> >> >> >> >> > >>>>>>>>
> >> >> >> >> > >>>>>>>> My 2 cents,
> >> >> >> >> > >>>>>>>> -Alex
> >> >> >> >> > >>>>>>>>>
> >> >> >> >> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent
> >> >> >> >><pent@adobe.com.INVALID
> >> >> >> >> >
> >> >> >> >> > >>>>>>>>>> wrote:
> >> >> >> >> > >>>>>>>>>>
> >> >> >> >> > >>>>>>>>>> Label was one of the very first components and the
> >> >>idea
> >> >> >>was
> >> >> >> >> > >>>>>>>>>> minimalism.
> >> >> >> >> > >>>>>>>>>> Button was <button> and TextInput was <input
> >> >> >>type="text">
> >> >> >> >>and
> >> >> >> >> > >>> Label
> >> >> >> >> > >>>>>>>>>> was
> >> >> >> >> > >>>>>>>>>> <span>.
> >> >> >> >> > >>>>>>>>>>
> >> >> >> >> > >>>>>>>>>> I'm wondering if we should have NativeButton,
> >> >> >>NativeLabel,
> >> >> >> >> etc.
> >> >> >> >> > >>>>>>>>>> which
> >> >> >> >> > >>>>>>>>>> would be these minimal elements and have others
> >>that
> >> >>are
> >> >> >> >><div>
> >> >> >> >> > >>>>>>>>>> wrapping.
> >> >> >> >> > >>>>>>>>>> For instance, ImageAndTextButton is a <button><img
> >> >> >> >> > >>>>>>>>>> src="goo.jpg">Label
> >> >> >> >> > >>>>>>>>>> Here</button> which works but the alignment is
> >>weird
> >> >>so
> >> >> >> >>maybe
> >> >> >> >> > >>>>>>>>>> ImageAndTextButton should be a
> >><div><img>Text</div>
> >> >> >>which
> >> >> >> >>can
> >> >> >> >> be
> >> >> >> >> > >>>>>>>>>> aligned
> >> >> >> >> > >>>>>>>>>> and styled better.
> >> >> >> >> > >>>>>>>>>>
> >> >> >> >> > >>>>>>>>>> Anyway, that's the reason: simplicity.
> >> >> >> >> > >>>>>>>>>>
> >> >> >> >> > >>>>>>>>>> ‹peter
> >> >> >> >> > >>>>>>>>>>
> >> >> >> >> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs"
> >><ha...@gmail.com>
> >> >> >> wrote:
> >> >> >> >> > >>>>>>>>>>
> >> >> >> >> > >>>>>>>>>>> Is there a reason that the element type of Basic
> >> >>Label
> >> >> >>is
> >> >> >> >> span?
> >> >> >> >> > >>>>>>>>>>>
> >> >> >> >> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label
> >>and
> >> >>it
> >> >> >> >>does
> >> >> >> >> not
> >> >> >> >> > >>>>>>>>>>> seem
> >> >> >> >> > >>>>>>>>>>> to
> >> >> >> >> > >>>>>>>>>>> work because spans donąt really have a working
> >> >>width.
> >> >> >> >> Switching
> >> >> >> >> > >>> the
> >> >> >> >> > >>>>>>>>>>> element type to div seems to make it work.
> >> >> >> >> > >>>>>>>>>>>
> >> >> >> >> > >>>>>>>>>>> Harbs
> >> >> >> >> > >>>>>>>>>>
> >> >> >> >> > >>>>>>>>>
> >> >> >> >> > >>>>>>>>
> >> >> >> >> > >>>>>>>
> >> >> >> >> > >>>>>>
> >> >> >> >> > >>>>>
> >> >> >> >> > >>>>
> >> >> >> >> > >>>
> >> >> >> >> > >>>
> >> >> >> >> > >>
> >> >> >> >> > >>
> >> >> >> >> > >> --
> >> >> >> >> > >> Carlos Rovira
> >> >> >> >> > >> https://na01.safelinks.protection.outlook.com/?url=
> >> >> >> >> > http%3A%2F%2Fabout.me%2
> >> >> >> >><https://na01.safelinks.protection.outlook.com/?url=
> >> >> >> https%3A%2F%2Fna01.sa
> >> >> >>
> >> >> >>>>felinks&data=02%7C01%7Caharui%40adobe.com%
> >> >> 7C3664f690b3da4e4aefab08d58ac
> >> >> >>>>c
> >> >> >> 7
> >> >> >> >>bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> >> >> >> 7C636567533215453966&sdata
> >> >> >>
> >>>>=exoH%2BPKzuyM%2BykE65GQeHk%2BjPAZSsUFjsKwx3BRvjsk%3D&reserved=0.
> >> >> >> >> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
> >> >> >> >> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com
> >> >> >>
> >> >> >>>><https://na01.safelinks.protection.outlook.com/?url=
> >> >> http%3A%2F%2F40adob
> >> >> >>>>e
> >> >> >> .
> >> >> >>
> >> >> >>>>com%2F&data=02%7C01%7Caharui%40adobe.com%
> >> >> 7C3664f690b3da4e4aefab08d58acc
> >> >> >> 7b
> >> >> >> >>f0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> >> >> >> 7C636567533215453966&sdata=
> >> >> >> >>ewhtNMkSjHssIseUSvxq9etF%2FtrcA%2Buqk3sZlJkjHuc%3D&reserved=0
> >> >> >> >> >%
> >> >> >> >> > 7Cae539925833d453aaa2e08d5
> >> >> >> >> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> >> >> >> >> > 7C636567454874235113&s
> >> >> >> >> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY
> >> >> 1WVtz2xsNvc%3D&reserved=0
> >> >> >> >> >
> >> >> >> >> >
> >> >> >> >>
> >> >> >>
> >> >> >>
> >> >>
> >> >>
> >>
> >>
>
>

Re: Label

Posted by Alex Harui <ah...@adobe.com.INVALID>.
For Migrating Users we are building a set of emulation components.  They
will not be PAYG.  They are intended to reduce the number of changes to
your Flex code base.

But if after migrating, performance becomes an issue, users will be
encouraged to break apart the emulation components into their Basic
components and only the beads they need.  The Spark Label will be heavier
than MX Label because it has to carry around the "maxDisplayedLines"
property.  Spark Label defaulted to a single line, IIRC.

Also note that the underlying behavior in Flex/Flash was to default to a
single line unless you asked for more.  Span was an attempt to keep things
from unintentionally wrapping, which I believe is the browser default.

I think it would cause questions if there were no spans where most people
expect them in Royale output.  Unless we convince the whole world that div
really should replace span everywhere.

Meanwhile, back to trying to create these emulation components...

-Alex

On 3/15/18, 9:22 PM, "Greg Dove" <gr...@gmail.com> wrote:

>Alex, that may have been true for mx Label, but it is not the case for
>Spark. In the end it does become relevant for 'migrating users' migrating
>Flex 4/Spark apps.
>
>I'm just pointing this out. I was confused/annoyed when I used it last
>year
>expecting it to be similar to what I had been using not so long ago in
>Flex. If I was confused, I am probably not unique (I might be!). Yes, I
>made something else to do the job or found multilinelabel - I can't
>remember now. But maybe there is no extra 'pay' to use div? Anyhow, I am
>stopping further comments. Over to you guys.
>
>
>
>
>
>On Fri, Mar 16, 2018 at 5:13 PM, Alex Harui <ah...@adobe.com.invalid>
>wrote:
>
>>
>>
>> On 3/15/18, 8:47 PM, "Greg Dove" <gr...@gmail.com> wrote:
>>
>> >  Label is a single-line sequence of text.
>> >
>> >I think that is the statement that might be in the process of being
>> >indirectly debated.
>> >Is it documented as such?
>>
>> Really?  We're going to nitpick over the completeness of our doc?  There
>> is a MultilineLabel component for a reason.  I did not like adding more
>> blades to the swiss-army knife in Spark Label.  That wasn't PAYG.  MX
>> Label doc is here:
>> 
>>https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fhelp.ado
>>be.com%2Fen_US%2FFlashPlatform%2Freference%2F&data=02%7C01%7Caharui%40ado
>>be.com%7C60c34e7c67b34f47a89008d58af59006%7Cfa7b1b5a7b34438794aed2c178dec
>>ee1%7C0%7C0%7C636567709645648492&sdata=YVjrfzkZGp%2BOHAyLmzbsMJQuY9r1%2BB
>>yJ2b%2B6tQwm5ho%3D&reserved=0
>> actionscript/3/mx/cont
>> rols/Label.html
>>
>> It says:  "The Label control displays a single line of noneditable
>>text."
>>
>> Still trying to help our migrating users...
>> -Alex
>> >
>> >On Fri, Mar 16, 2018 at 4:37 PM, Alex Harui <ah...@adobe.com.invalid>
>> >wrote:
>> >
>> >> Because, this isn't an issue of performance.  We give our users
>>choices
>> >> and a toolkit to replicate ANY HTML tree they want to.  We are
>>proposing
>> >> to replace what is to me the most obvious Flex-like component name
>>for
>> >> injecting a span into the DOM.  Label is a single-line sequence of
>>text.
>> >> So is Span.
>> >>
>> >> I'm not seeing a huge performance difference.  If you think it is
>> >> significant enough that our users should be alerted to use
>>SizeableLabel
>> >> or whatever we call the Div-wrapping-text version, start blogging it
>> >>after
>> >> you validate your test case.  I noticed that the number of Spans the
>> >>test
>> >> appears to report are higher than the number of Divs, but that might
>>be
>> >>a
>> >> false alarm.  You can be a hero in the web world if you are right and
>> >> change the advice I see elsewhere on the net to use Span for inline
>> >> elements and Div for other things.  Even the JSPerf page is using
>>spans.
>> >> Tell them to replace them.
>> >>
>> >> Meanwhile, I'm going back to try to migrate an app.  Sure wish we had
>> >>more
>> >> people helping on that.
>> >>
>> >> -Alex
>> >>
>> >>
>> >> We can certainly give them advice that SizedLabel is faster than
>>Label
>> >>if
>> >> that's important, but the different didn't seem that significant.
>> >>
>> >> On 3/15/18, 6:14 PM, "omuppi1@gmail.com on behalf of OmPrakash
>> >>Muppirala"
>> >> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
>> >>
>> >> >If creating a div is more performant than creating a span, why
>>insist
>> >>on
>> >> >using a span?  How is that pay as you go?
>> >> >
>> >> >Thanks,
>> >> >Om
>> >> >
>> >> >On Thu, Mar 15, 2018 at 5:19 PM, Alex Harui
>><ah...@adobe.com.invalid>
>> >> >wrote:
>> >> >
>> >> >> A Flex Label, and any Flex component was a swiss-army knife of
>> >>features
>> >> >> and not PAYG.  I have not given up on PAYG.  I think it will pay
>>off
>> >> >>when
>> >> >> we get to the last mile.  If we don't stick to PAYG, I think we
>>will
>> >> >>just
>> >> >> repeat the history of Flex and produce a fat framework that can't
>>run
>> >> >> everywhere.  Yes, a Div would probably better mimic a Flex Label,
>>but
>> >> >>the
>> >> >> Basic label is not a swiss-army knife.
>> >> >>
>> >> >> This article is old, but I think it says you can't put a Div in a
>> >>Span:
>> >> >>
>> >> >>https://na01.safelinks.protection.outlook.com/?url=
>> >> http%3A%2F%2Fdoctype.c
>> >> >>om%2Fspan-contain-div-html5&data=02%7C01%7Caharui%40adobe.com
>> >> %7C77b57b271
>> >> >>ef7423114c208d58ae0d810%7Cfa7b1b5a7b34438794aed2c178de
>> >> cee1%7C0%7C0%7C6365
>> >> >>67620658308491&sdata=o9msOjZpbwywflSfgJDebUdMM3hgNP
>> >> dN%2Btn%2BrcSZsV4%3D&r
>> >> >>eserved=0
>> >> >>
>> >> >> I think you can if you change the span's display to "block" but I
>> >>think
>> >> >> that is essentially replacing the element.
>> >> >>
>> >> >> Everything, including width and truncation should be opt-in, PAYG.
>> >> >>Make a
>> >> >> LabelWithWidth or SizeableLabel component that is a div if you
>>want.
>> >> >>
>> >> >> Again, the goal is to encapsulate common patterns.  I am not
>>seeing a
>> >> >>lot
>> >> >> of Divs wrapping text nodes.  I see lots of spans wrapping text
>> >>nodes.
>> >> >> Basic Label is that pattern.  The Basic component set would be
>> >> >>incomplete
>> >> >> if there wasn't a component that could inject a Span into the DOM.
>> >> >>Create
>> >> >> another component that is a Div wrapping a text node, give it a
>> >> >>different
>> >> >> name, and let's move on.
>> >> >>
>> >> >> Alina used Label quite often without setting width.  No need for
>> >>those
>> >> >> instances to be a Div, AFAICT.
>> >> >>
>> >> >> Do we even need to discuss span vs div if the truncation bead will
>> >>work
>> >> >>by
>> >> >> setting display:block?
>> >> >>
>> >> >> We have a huge opportunity here to get another app migrated and
>> >>prove to
>> >> >> the world that Royale is the right choice.  But we keep discussing
>> >>stuff
>> >> >> that IMO, isn't really moving the big pieces forward.  But, IMO,
>>we
>> >> >>should
>> >> >> not compromise on PAYG philosophy and patterns.
>> >> >>
>> >> >> My 2 cents,
>> >> >> -Alex
>> >> >>
>> >> >> On 3/15/18, 4:27 PM, "omuppi1@gmail.com on behalf of OmPrakash
>> >> >>Muppirala"
>> >> >> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
>> >> >>
>> >> >> >FWIW, it seems like creating divs is faster than creating spans.
>> >> >> >https://na01.safelinks.protection.outlook.com/?url=
>> >> >> https%3A%2F%2Fjsperf.co
>> >> >> >m%2Fspan-vs-div-creation&data=02%7C01%7Caharui%40adobe.com
>> >> >> %7C3664f690b3da4
>> >> >> >e4aefab08d58acc7bf0%7Cfa7b1b5a7b34438794aed2c178de
>> >> >> cee1%7C0%7C0%7C636567533
>> >> >> >215453966&sdata=oPPp2e9aRbQ%2FngKbcFMHMCmXi%2BKa%2B%
>> >> >> 2F0aA98XFFqxhFA%3D&res
>> >> >> >erved=0
>> >> >> >
>> >> >> >Thanks,
>> >> >> >Om
>> >> >> >
>> >> >> >On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <gr...@gmail.com>
>> >> wrote:
>> >> >> >
>> >> >> >> Observing from the sidelines, fwiw I agree with Harbs here.
>>Span
>> >>to
>> >> >>me
>> >> >> >> makes more sense as part of the text value of a label and not
>>as
>> >>the
>> >> >> >>basis
>> >> >> >> for the representation of the Label itself - div seems closer
>>to
>> >> >>what I
>> >> >> >>was
>> >> >> >> used to with legacy Flex (which may no longer be the
>>'reference'
>> >>for
>> >> >> >> choosing an implementation).
>> >> >> >> I don't think there is any semantic or other reason that makes
>> >>span
>> >> >>the
>> >> >> >> logical default tag for Label, in fact I recall that being a
>> >>problem
>> >> >> >>many
>> >> >> >> times with some work I was involved with last year using
>>FlexJS.
>> >> >> >> But maybe I am missing something in terms of understanding.
>> >> >> >>
>> >> >> >>
>> >> >> >>
>> >> >> >>
>> >> >> >> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <ha...@gmail.com>
>> >> >>wrote:
>> >> >> >>
>> >> >> >> > I’m suggesting to change it because span does not fit the use
>> >>case
>> >> >>of
>> >> >> >> > Label. Width and truncate are just two applications which
>> >>indicate
>> >> >> >>that
>> >> >> >> > span is not the correct element. I’m pretty sure I had other
>> >>edge
>> >> >> >>cases
>> >> >> >> > which were likely effected by the fact that Label is a span,
>> >> >>although
>> >> >> >>I’m
>> >> >> >> > not positive.
>> >> >> >> >
>> >> >> >> > I disagree with your distinction between span and div.
>> >> >> >> >
>> >> >> >> > Both span and div can have children. Spans can contain divs
>>and
>> >> >>divs
>> >> >> >>can
>> >> >> >> > contain spans. At its core, Span has nothing to do with text.
>> >>It’s
>> >> >> >>just
>> >> >> >> > often used for text because text (within its container) is
>> >>inline.
>> >> >> >> >
>> >> >> >> > MDN says[1] "<span> is very much like a <div> element, but
>><div>
>> >> >>is a
>> >> >> >> > block-level element whereas a <span> is an inline element.”
>> >> >> >> >
>> >> >> >> > Label is *not* necessarily an inline element. We have all
>>kinds
>> >>of
>> >> >> >> layouts
>> >> >> >> > for Label. Many (most?) of them are not inline.
>> >> >> >> >
>> >> >> >> > If you feel really strongly about this, I’ll revert even
>>though
>> >>I
>> >> >> >> disagree.
>> >> >> >> >
>> >> >> >> > FWIW, the truncate bead does not need to change the element
>> >>type.
>> >> >>It
>> >> >> >>can
>> >> >> >> > explicitly set the display of the element to block.
>> >> >> >> >
>> >> >> >> > Harbs
>> >> >> >> >
>> >> >> >> >
>> >> >> >>[1]https://na01.safelinks.protection.outlook.com/?url=
>> >> >> https%3A%2F%2Fdevel
>> >> >> >>oper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
>> >> >> 2Fspan&data=02%7C0
>> >> >> >>1%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
>> >> >> 7bf0%7Cfa7b1b5a7b344
>> >> >> >>38794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
>> >> >> xrtF9H7%2BjFzqGDax
>> >> >> >>nj0%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0 <
>> >> >> >> >
>> >> >> >>https://na01.safelinks.protection.outlook.com/?url=
>> >> >> https%3A%2F%2Fdevelope
>> >> >> >>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
>> >> >> 2Fspan&data=02%7C01%7
>> >> >> >>Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
>> >> >> 7bf0%7Cfa7b1b5a7b344387
>> >> >> >>94aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
>> >> >> xrtF9H7%2BjFzqGDaxnj0
>> >> >> >>%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0>
>> >> >> >> >
>> >> >> >> > > On Mar 15, 2018, at 11:25 PM, Alex Harui
>> >> >><ah...@adobe.com.INVALID>
>> >> >> >> > wrote:
>> >> >> >> > >
>> >> >> >> > > Label in Flex and Royale is not intended to have any
>>children
>> >> >>(other
>> >> >> >> than
>> >> >> >> > > bold, italic and other text markup).  Span represents that.
>> >>Div
>> >> >> >>does
>> >> >> >> > not.
>> >> >> >> > > You are suggesting changing to div JUST IN CASE someone
>>needs
>> >>to
>> >> >> >>set a
>> >> >> >> > > width and/or truncate.  Just-in-case code is not PAYG.
>> >> >> >> > >
>> >> >> >> > > My 2 cents,
>> >> >> >> > > -Alex
>> >> >> >> > >
>> >> >> >> > > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
>> >> >> >> > carlos.rovira@gmail.com> on behalf of Carlos Rovira"
>> >> >> >> > > <carlos.rovira@gmail.com <ma...@gmail.com>
>>on
>> >> >>behalf
>> >> >> >>of
>> >> >> >> > carlosrovira@apache.org <ma...@apache.org>>
>> wrote:
>> >> >> >> > >
>> >> >> >> > >> And why not change IBeadView in Label for a view that
>>uses a
>> >>div
>> >> >> >>when
>> >> >> >> > >> needed? ;)
>> >> >> >> > >> in the other cases, maintains the span
>> >> >> >> > >>
>> >> >> >> > >> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
>> >> >> >> > >>
>> >> >> >> > >>> I’m still not understanding you. What about Label says
>>it’s
>> >>a
>> >> >>span
>> >> >> >> > >>> instead
>> >> >> >> > >>> of a div? Why is making it a div not PAYG? Span simply
>> >>limits
>> >> >> >>Label
>> >> >> >> > >>> unnecessarily. I think span is not the appropriate
>>element
>> >>for
>> >> >> >>Label.
>> >> >> >> > >>>
>> >> >> >> > >>>> A Label without width should grow to the size of its
>>text.
>> >> >>Isn't
>> >> >> >> that
>> >> >> >> > >>> how
>> >> >> >> > >>>> it worked in Flex?
>> >> >> >> > >>>
>> >> >> >> > >>> Sure, and a div does that too. In Flex, a label could
>>have a
>> >> >>width
>> >> >> >> too
>> >> >> >> > >>> if
>> >> >> >> > >>> specified. Spans cannot.
>> >> >> >> > >>>
>> >> >> >> > >>> Harbs
>> >> >> >> > >>>
>> >> >> >> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui
>> >> >> >><ah...@adobe.com.INVALID>
>> >> >> >> > >>> wrote:
>> >> >> >> > >>>>
>> >> >> >> > >>>> Have the truncation bead swap the span for div.  Again,
>> >>some
>> >> >> >> component
>> >> >> >> > >>> has
>> >> >> >> > >>>> to put a span in the DOM.  Label has been just fine for
>> >>that
>> >> >>so
>> >> >> >>far.
>> >> >> >> > >>>>
>> >> >> >> > >>>> A Label without width should grow to the size of its
>>text.
>> >> >>Isn't
>> >> >> >> that
>> >> >> >> > >>> how
>> >> >> >> > >>>> it worked in Flex?
>> >> >> >> > >>>>
>> >> >> >> > >>>> Maybe Label should be refactored to not have
>>width/height
>> >> >> >>properties
>> >> >> >> > >>> but
>> >> >> >> > >>>> IMO we have bigger fish to fry.
>> >> >> >> > >>>>
>> >> >> >> > >>>> I'm sure Div is used to wrap text in some frameworks,
>>but
>> >> >>those
>> >> >> >> > >>> frameworks
>> >> >> >> > >>>> probably aren't PAYG.  In Alina's app, Label has a usage
>> >> >>score of
>> >> >> >> 69,
>> >> >> >> > >>> but
>> >> >> >> > >>>> Label.width has a score of only 5.  We will have her use
>> >> >> >> > >>>> LabelWithTruncation or add the truncation bead on the
>>few
>> >> >>labels
>> >> >> >> that
>> >> >> >> > >>> need
>> >> >> >> > >>>>
>> >> >> >> > >>>> My 2 cents,
>> >> >> >> > >>>> -Alex
>> >> >> >> > >>>>
>> >> >> >> > >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com>
>> >>wrote:
>> >> >> >> > >>>>
>> >> >> >> > >>>>> But we already have a truncation bead. The only reason
>>it
>> >> >> >>doesn’t
>> >> >> >> > >>> work
>> >> >> >> > >>> in
>> >> >> >> > >>>>> Label is because spans don’t have widths.
>> >> >> >> > >>>>>
>> >> >> >> > >>>>> Label is not something which should flow beyond its
>> >>bounds —
>> >> >> >>which
>> >> >> >> is
>> >> >> >> > >>>>> what span is useful for. I still don’t see why you
>>think
>> >>span
>> >> >> >>makes
>> >> >> >> > >>> more
>> >> >> >> > >>>>> sense.
>> >> >> >> > >>>>>
>> >> >> >> > >>>>> FWIW, div *is* used as a container for text in various
>> >> >> >>frameworks.
>> >> >> >> > >>>>>
>> >> >> >> > >>>>> My $0.02,
>> >> >> >> > >>>>> Harbs
>> >> >> >> > >>>>>
>> >> >> >> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui
>> >> >> >><aharui@adobe.com.INVALID
>> >> >> >> >
>> >> >> >> > >>>>>> wrote:
>> >> >> >> > >>>>>>
>> >> >> >> > >>>>>> AIUI, "inline" is the default display style for Span.
>> >> >>"block"
>> >> >> >>is
>> >> >> >> > >>> the
>> >> >> >> > >>>>>> default for Div.  HTML flows inline by default for
>>just
>> >> >>plain
>> >> >> >> text.
>> >> >> >> > >>>>>> Basic
>> >> >> >> > >>>>>> components try to give Flex-friendly names for
>> >>HTMLElements.
>> >> >> >>Some
>> >> >> >> > >>>>>> component in Basic needs to inject a span into the
>>DOM.
>> >>In
>> >> >>a
>> >> >> >>few
>> >> >> >> > >>>>>> seconds
>> >> >> >> > >>>>>> of looking at a Google web page, I did not see any
>>divs
>> >>with
>> >> >> >>text
>> >> >> >> as
>> >> >> >> > >>>>>> children.  I saw spans.  The Divs all contained other
>> >> >>elements.
>> >> >> >> > >>>>>>
>> >> >> >> > >>>>>> I don't create HTML web pages for a living, but if I
>> >>were to
>> >> >> >> place a
>> >> >> >> > >>>>>> label
>> >> >> >> > >>>>>> over a control like I often see in Flex, I would not
>>wrap
>> >> >>the
>> >> >> >> label
>> >> >> >> > >>> in
>> >> >> >> > >>> a
>> >> >> >> > >>>>>> Div.  The control would be div, so I would us a span
>>or
>> >>just
>> >> >> >>plain
>> >> >> >> > >>> text.
>> >> >> >> > >>>>>> If I looked at the final DOM and saw Divs around every
>> >> >>chunk of
>> >> >> >> > >>> text, I
>> >> >> >> > >>>>>> would think there is something heavy about the
>>framework.
>> >> >> >> > >>>>>>
>> >> >> >> > >>>>>> Again, the goal is to encapsulate common patterns.
>>Label
>> >> >> >>combined
>> >> >> >> > >>> with
>> >> >> >> > >>>>>> some control is trying to replicate common patterns
>>for
>> >> >> >>labeling
>> >> >> >> > >>>>>> controls.
>> >> >> >> > >>>>>> You are trying to solve the common pattern of
>>truncating
>> >> >>text.
>> >> >> >> That
>> >> >> >> > >>>>>> will
>> >> >> >> > >>>>>> require a Div. But truncation, or even width/height is
>> >>not
>> >> >> >> something
>> >> >> >> > >>>>>> that
>> >> >> >> > >>>>>> should be built into Label for PAYG reasons.  IMO, you
>> >> >>should
>> >> >> >> > >>> create a
>> >> >> >> > >>>>>> different component with a different name.
>> >> >>TruncatingLabel, or
>> >> >> >> > >>>>>> LabelWIthTruncation.
>> >> >> >> > >>>>>>
>> >> >> >> > >>>>>> My 2 cents,
>> >> >> >> > >>>>>> -Alex
>> >> >> >> > >>>>>>
>> >> >> >> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com>
>> >> wrote:
>> >> >> >> > >>>>>>
>> >> >> >> > >>>>>>> Why is span lighter than div?
>> >> >> >> > >>>>>>>
>> >> >> >> > >>>>>>> Inline and nowrap is not specific to span. AFAICT,
>> >>there’s
>> >> >> >> nothing
>> >> >> >> > >>>>>>> specific to snap which fits Label better than div.
>> >> >> >> > >>>>>>>
>> >> >> >> > >>>>>>> As far as components which “does” span: Besides Span
>>in
>> >> >>HTML,
>> >> >> >>we
>> >> >> >> > >>> have
>> >> >> >> > >>>>>>> HTMLText in Basic which encapsulates span.
>> >> >> >> > >>>>>>>
>> >> >> >> > >>>>>>> I can revert the change I made to Label, but I have
>>not
>> >> >>seen
>> >> >> >>any
>> >> >> >> > >>>>>>> downside
>> >> >> >> > >>>>>>> to using div for Label. It seems to me that there’s
>> >> >>nothing in
>> >> >> >> the
>> >> >> >> > >>>>>>> Label
>> >> >> >> > >>>>>>> promise which dictates using span.
>> >> >> >> > >>>>>>>
>> >> >> >> > >>>>>>> Harbs
>> >> >> >> > >>>>>>>
>> >> >> >> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui
>> >> >> >> <aharui@adobe.com.INVALID
>> >> >> >> > >
>> >> >> >> > >>>>>>>> wrote:
>> >> >> >> > >>>>>>>>
>> >> >> >> > >>>>>>>>
>> >> >> >> > >>>>>>>>
>> >> >> >> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com>
>> >> >>wrote:
>> >> >> >> > >>>>>>>>
>> >> >> >> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element
>>component
>> >>set
>> >> >> >>which
>> >> >> >> > >>> more
>> >> >> >> > >>>>>>>>> thinly wraps HTML elements.
>> >> >> >> > >>>>>>>>>
>> >> >> >> > >>>>>>>>> I can’t think of any reason why Label would be
>>better
>> >>as
>> >> >>a
>> >> >> >>span
>> >> >> >> > >>> than
>> >> >> >> > >>>>>>>>> a
>> >> >> >> > >>>>>>>>> div. It seems to me that simply using div instead
>>of
>> >>span
>> >> >> >>would
>> >> >> >> > >>> make
>> >> >> >> > >>>>>>>>> Label more versatile. Am I missing something?
>> >> >> >> > >>>>>>>>
>> >> >> >> > >>>>>>>> You may be missing that the only real goal of Royale
>> >>is to
>> >> >> >> > >>> encapsulate
>> >> >> >> > >>>>>>>> popular patterns.  Pretty sure I've seen span used
>>on
>> >>many
>> >> >> >>web
>> >> >> >> > >>> pages,
>> >> >> >> > >>>>>>>> so
>> >> >> >> > >>>>>>>> we need a component that does what it does,
>>including
>> >> >> >>assuming
>> >> >> >> > >>> inline
>> >> >> >> > >>>>>>>> instead of block display.  Similarly, what would you
>> >>think
>> >> >> >>of a
>> >> >> >> > >>>>>>>> framework
>> >> >> >> > >>>>>>>> that had a HelloWorld that used a div instead of a
>> >>span?
>> >> >>You
>> >> >> >> > >>> might
>> >> >> >> > >>>>>>>> think
>> >> >> >> > >>>>>>>> it is too heavy.
>> >> >> >> > >>>>>>>>
>> >> >> >> > >>>>>>>> Per PAYG, if span doesn’t' support certain features,
>> >>then
>> >> >>you
>> >> >> >> > >>> create
>> >> >> >> > >>> a
>> >> >> >> > >>>>>>>> LabelWithTruncation and have it use a Div if you
>>need
>> >>to.
>> >> >> >> > >>>>>>>>
>> >> >> >> > >>>>>>>> My 2 cents,
>> >> >> >> > >>>>>>>> -Alex
>> >> >> >> > >>>>>>>>>
>> >> >> >> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent
>> >> >> >><pent@adobe.com.INVALID
>> >> >> >> >
>> >> >> >> > >>>>>>>>>> wrote:
>> >> >> >> > >>>>>>>>>>
>> >> >> >> > >>>>>>>>>> Label was one of the very first components and the
>> >>idea
>> >> >>was
>> >> >> >> > >>>>>>>>>> minimalism.
>> >> >> >> > >>>>>>>>>> Button was <button> and TextInput was <input
>> >> >>type="text">
>> >> >> >>and
>> >> >> >> > >>> Label
>> >> >> >> > >>>>>>>>>> was
>> >> >> >> > >>>>>>>>>> <span>.
>> >> >> >> > >>>>>>>>>>
>> >> >> >> > >>>>>>>>>> I'm wondering if we should have NativeButton,
>> >> >>NativeLabel,
>> >> >> >> etc.
>> >> >> >> > >>>>>>>>>> which
>> >> >> >> > >>>>>>>>>> would be these minimal elements and have others
>>that
>> >>are
>> >> >> >><div>
>> >> >> >> > >>>>>>>>>> wrapping.
>> >> >> >> > >>>>>>>>>> For instance, ImageAndTextButton is a <button><img
>> >> >> >> > >>>>>>>>>> src="goo.jpg">Label
>> >> >> >> > >>>>>>>>>> Here</button> which works but the alignment is
>>weird
>> >>so
>> >> >> >>maybe
>> >> >> >> > >>>>>>>>>> ImageAndTextButton should be a
>><div><img>Text</div>
>> >> >>which
>> >> >> >>can
>> >> >> >> be
>> >> >> >> > >>>>>>>>>> aligned
>> >> >> >> > >>>>>>>>>> and styled better.
>> >> >> >> > >>>>>>>>>>
>> >> >> >> > >>>>>>>>>> Anyway, that's the reason: simplicity.
>> >> >> >> > >>>>>>>>>>
>> >> >> >> > >>>>>>>>>> ‹peter
>> >> >> >> > >>>>>>>>>>
>> >> >> >> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs"
>><ha...@gmail.com>
>> >> >> wrote:
>> >> >> >> > >>>>>>>>>>
>> >> >> >> > >>>>>>>>>>> Is there a reason that the element type of Basic
>> >>Label
>> >> >>is
>> >> >> >> span?
>> >> >> >> > >>>>>>>>>>>
>> >> >> >> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label
>>and
>> >>it
>> >> >> >>does
>> >> >> >> not
>> >> >> >> > >>>>>>>>>>> seem
>> >> >> >> > >>>>>>>>>>> to
>> >> >> >> > >>>>>>>>>>> work because spans donąt really have a working
>> >>width.
>> >> >> >> Switching
>> >> >> >> > >>> the
>> >> >> >> > >>>>>>>>>>> element type to div seems to make it work.
>> >> >> >> > >>>>>>>>>>>
>> >> >> >> > >>>>>>>>>>> Harbs
>> >> >> >> > >>>>>>>>>>
>> >> >> >> > >>>>>>>>>
>> >> >> >> > >>>>>>>>
>> >> >> >> > >>>>>>>
>> >> >> >> > >>>>>>
>> >> >> >> > >>>>>
>> >> >> >> > >>>>
>> >> >> >> > >>>
>> >> >> >> > >>>
>> >> >> >> > >>
>> >> >> >> > >>
>> >> >> >> > >> --
>> >> >> >> > >> Carlos Rovira
>> >> >> >> > >> https://na01.safelinks.protection.outlook.com/?url=
>> >> >> >> > http%3A%2F%2Fabout.me%2
>> >> >> >><https://na01.safelinks.protection.outlook.com/?url=
>> >> >> https%3A%2F%2Fna01.sa
>> >> >>
>> >> >>>>felinks&data=02%7C01%7Caharui%40adobe.com%
>> >> 7C3664f690b3da4e4aefab08d58ac
>> >> >>>>c
>> >> >> 7
>> >> >> >>bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>> >> >> 7C636567533215453966&sdata
>> >> >> 
>>>>=exoH%2BPKzuyM%2BykE65GQeHk%2BjPAZSsUFjsKwx3BRvjsk%3D&reserved=0.
>> >> >> >> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
>> >> >> >> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com
>> >> >>
>> >> >>>><https://na01.safelinks.protection.outlook.com/?url=
>> >> http%3A%2F%2F40adob
>> >> >>>>e
>> >> >> .
>> >> >>
>> >> >>>>com%2F&data=02%7C01%7Caharui%40adobe.com%
>> >> 7C3664f690b3da4e4aefab08d58acc
>> >> >> 7b
>> >> >> >>f0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>> >> >> 7C636567533215453966&sdata=
>> >> >> >>ewhtNMkSjHssIseUSvxq9etF%2FtrcA%2Buqk3sZlJkjHuc%3D&reserved=0
>> >> >> >> >%
>> >> >> >> > 7Cae539925833d453aaa2e08d5
>> >> >> >> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>> >> >> >> > 7C636567454874235113&s
>> >> >> >> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY
>> >> 1WVtz2xsNvc%3D&reserved=0
>> >> >> >> >
>> >> >> >> >
>> >> >> >>
>> >> >>
>> >> >>
>> >>
>> >>
>>
>>


Re: Label

Posted by Greg Dove <gr...@gmail.com>.
Alex, that may have been true for mx Label, but it is not the case for
Spark. In the end it does become relevant for 'migrating users' migrating
Flex 4/Spark apps.

I'm just pointing this out. I was confused/annoyed when I used it last year
expecting it to be similar to what I had been using not so long ago in
Flex. If I was confused, I am probably not unique (I might be!). Yes, I
made something else to do the job or found multilinelabel - I can't
remember now. But maybe there is no extra 'pay' to use div? Anyhow, I am
stopping further comments. Over to you guys.





On Fri, Mar 16, 2018 at 5:13 PM, Alex Harui <ah...@adobe.com.invalid>
wrote:

>
>
> On 3/15/18, 8:47 PM, "Greg Dove" <gr...@gmail.com> wrote:
>
> >  Label is a single-line sequence of text.
> >
> >I think that is the statement that might be in the process of being
> >indirectly debated.
> >Is it documented as such?
>
> Really?  We're going to nitpick over the completeness of our doc?  There
> is a MultilineLabel component for a reason.  I did not like adding more
> blades to the swiss-army knife in Spark Label.  That wasn't PAYG.  MX
> Label doc is here:
> https://help.adobe.com/en_US/FlashPlatform/reference/
> actionscript/3/mx/cont
> rols/Label.html
>
> It says:  "The Label control displays a single line of noneditable text."
>
> Still trying to help our migrating users...
> -Alex
> >
> >On Fri, Mar 16, 2018 at 4:37 PM, Alex Harui <ah...@adobe.com.invalid>
> >wrote:
> >
> >> Because, this isn't an issue of performance.  We give our users choices
> >> and a toolkit to replicate ANY HTML tree they want to.  We are proposing
> >> to replace what is to me the most obvious Flex-like component name for
> >> injecting a span into the DOM.  Label is a single-line sequence of text.
> >> So is Span.
> >>
> >> I'm not seeing a huge performance difference.  If you think it is
> >> significant enough that our users should be alerted to use SizeableLabel
> >> or whatever we call the Div-wrapping-text version, start blogging it
> >>after
> >> you validate your test case.  I noticed that the number of Spans the
> >>test
> >> appears to report are higher than the number of Divs, but that might be
> >>a
> >> false alarm.  You can be a hero in the web world if you are right and
> >> change the advice I see elsewhere on the net to use Span for inline
> >> elements and Div for other things.  Even the JSPerf page is using spans.
> >> Tell them to replace them.
> >>
> >> Meanwhile, I'm going back to try to migrate an app.  Sure wish we had
> >>more
> >> people helping on that.
> >>
> >> -Alex
> >>
> >>
> >> We can certainly give them advice that SizedLabel is faster than Label
> >>if
> >> that's important, but the different didn't seem that significant.
> >>
> >> On 3/15/18, 6:14 PM, "omuppi1@gmail.com on behalf of OmPrakash
> >>Muppirala"
> >> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
> >>
> >> >If creating a div is more performant than creating a span, why insist
> >>on
> >> >using a span?  How is that pay as you go?
> >> >
> >> >Thanks,
> >> >Om
> >> >
> >> >On Thu, Mar 15, 2018 at 5:19 PM, Alex Harui <ah...@adobe.com.invalid>
> >> >wrote:
> >> >
> >> >> A Flex Label, and any Flex component was a swiss-army knife of
> >>features
> >> >> and not PAYG.  I have not given up on PAYG.  I think it will pay off
> >> >>when
> >> >> we get to the last mile.  If we don't stick to PAYG, I think we will
> >> >>just
> >> >> repeat the history of Flex and produce a fat framework that can't run
> >> >> everywhere.  Yes, a Div would probably better mimic a Flex Label, but
> >> >>the
> >> >> Basic label is not a swiss-army knife.
> >> >>
> >> >> This article is old, but I think it says you can't put a Div in a
> >>Span:
> >> >>
> >> >>https://na01.safelinks.protection.outlook.com/?url=
> >> http%3A%2F%2Fdoctype.c
> >> >>om%2Fspan-contain-div-html5&data=02%7C01%7Caharui%40adobe.com
> >> %7C77b57b271
> >> >>ef7423114c208d58ae0d810%7Cfa7b1b5a7b34438794aed2c178de
> >> cee1%7C0%7C0%7C6365
> >> >>67620658308491&sdata=o9msOjZpbwywflSfgJDebUdMM3hgNP
> >> dN%2Btn%2BrcSZsV4%3D&r
> >> >>eserved=0
> >> >>
> >> >> I think you can if you change the span's display to "block" but I
> >>think
> >> >> that is essentially replacing the element.
> >> >>
> >> >> Everything, including width and truncation should be opt-in, PAYG.
> >> >>Make a
> >> >> LabelWithWidth or SizeableLabel component that is a div if you want.
> >> >>
> >> >> Again, the goal is to encapsulate common patterns.  I am not seeing a
> >> >>lot
> >> >> of Divs wrapping text nodes.  I see lots of spans wrapping text
> >>nodes.
> >> >> Basic Label is that pattern.  The Basic component set would be
> >> >>incomplete
> >> >> if there wasn't a component that could inject a Span into the DOM.
> >> >>Create
> >> >> another component that is a Div wrapping a text node, give it a
> >> >>different
> >> >> name, and let's move on.
> >> >>
> >> >> Alina used Label quite often without setting width.  No need for
> >>those
> >> >> instances to be a Div, AFAICT.
> >> >>
> >> >> Do we even need to discuss span vs div if the truncation bead will
> >>work
> >> >>by
> >> >> setting display:block?
> >> >>
> >> >> We have a huge opportunity here to get another app migrated and
> >>prove to
> >> >> the world that Royale is the right choice.  But we keep discussing
> >>stuff
> >> >> that IMO, isn't really moving the big pieces forward.  But, IMO, we
> >> >>should
> >> >> not compromise on PAYG philosophy and patterns.
> >> >>
> >> >> My 2 cents,
> >> >> -Alex
> >> >>
> >> >> On 3/15/18, 4:27 PM, "omuppi1@gmail.com on behalf of OmPrakash
> >> >>Muppirala"
> >> >> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
> >> >>
> >> >> >FWIW, it seems like creating divs is faster than creating spans.
> >> >> >https://na01.safelinks.protection.outlook.com/?url=
> >> >> https%3A%2F%2Fjsperf.co
> >> >> >m%2Fspan-vs-div-creation&data=02%7C01%7Caharui%40adobe.com
> >> >> %7C3664f690b3da4
> >> >> >e4aefab08d58acc7bf0%7Cfa7b1b5a7b34438794aed2c178de
> >> >> cee1%7C0%7C0%7C636567533
> >> >> >215453966&sdata=oPPp2e9aRbQ%2FngKbcFMHMCmXi%2BKa%2B%
> >> >> 2F0aA98XFFqxhFA%3D&res
> >> >> >erved=0
> >> >> >
> >> >> >Thanks,
> >> >> >Om
> >> >> >
> >> >> >On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <gr...@gmail.com>
> >> wrote:
> >> >> >
> >> >> >> Observing from the sidelines, fwiw I agree with Harbs here. Span
> >>to
> >> >>me
> >> >> >> makes more sense as part of the text value of a label and not as
> >>the
> >> >> >>basis
> >> >> >> for the representation of the Label itself - div seems closer to
> >> >>what I
> >> >> >>was
> >> >> >> used to with legacy Flex (which may no longer be the 'reference'
> >>for
> >> >> >> choosing an implementation).
> >> >> >> I don't think there is any semantic or other reason that makes
> >>span
> >> >>the
> >> >> >> logical default tag for Label, in fact I recall that being a
> >>problem
> >> >> >>many
> >> >> >> times with some work I was involved with last year using FlexJS.
> >> >> >> But maybe I am missing something in terms of understanding.
> >> >> >>
> >> >> >>
> >> >> >>
> >> >> >>
> >> >> >> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <ha...@gmail.com>
> >> >>wrote:
> >> >> >>
> >> >> >> > I’m suggesting to change it because span does not fit the use
> >>case
> >> >>of
> >> >> >> > Label. Width and truncate are just two applications which
> >>indicate
> >> >> >>that
> >> >> >> > span is not the correct element. I’m pretty sure I had other
> >>edge
> >> >> >>cases
> >> >> >> > which were likely effected by the fact that Label is a span,
> >> >>although
> >> >> >>I’m
> >> >> >> > not positive.
> >> >> >> >
> >> >> >> > I disagree with your distinction between span and div.
> >> >> >> >
> >> >> >> > Both span and div can have children. Spans can contain divs and
> >> >>divs
> >> >> >>can
> >> >> >> > contain spans. At its core, Span has nothing to do with text.
> >>It’s
> >> >> >>just
> >> >> >> > often used for text because text (within its container) is
> >>inline.
> >> >> >> >
> >> >> >> > MDN says[1] "<span> is very much like a <div> element, but <div>
> >> >>is a
> >> >> >> > block-level element whereas a <span> is an inline element.”
> >> >> >> >
> >> >> >> > Label is *not* necessarily an inline element. We have all kinds
> >>of
> >> >> >> layouts
> >> >> >> > for Label. Many (most?) of them are not inline.
> >> >> >> >
> >> >> >> > If you feel really strongly about this, I’ll revert even though
> >>I
> >> >> >> disagree.
> >> >> >> >
> >> >> >> > FWIW, the truncate bead does not need to change the element
> >>type.
> >> >>It
> >> >> >>can
> >> >> >> > explicitly set the display of the element to block.
> >> >> >> >
> >> >> >> > Harbs
> >> >> >> >
> >> >> >> >
> >> >> >>[1]https://na01.safelinks.protection.outlook.com/?url=
> >> >> https%3A%2F%2Fdevel
> >> >> >>oper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
> >> >> 2Fspan&data=02%7C0
> >> >> >>1%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> >> >> 7bf0%7Cfa7b1b5a7b344
> >> >> >>38794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
> >> >> xrtF9H7%2BjFzqGDax
> >> >> >>nj0%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0 <
> >> >> >> >
> >> >> >>https://na01.safelinks.protection.outlook.com/?url=
> >> >> https%3A%2F%2Fdevelope
> >> >> >>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
> >> >> 2Fspan&data=02%7C01%7
> >> >> >>Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> >> >> 7bf0%7Cfa7b1b5a7b344387
> >> >> >>94aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
> >> >> xrtF9H7%2BjFzqGDaxnj0
> >> >> >>%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0>
> >> >> >> >
> >> >> >> > > On Mar 15, 2018, at 11:25 PM, Alex Harui
> >> >><ah...@adobe.com.INVALID>
> >> >> >> > wrote:
> >> >> >> > >
> >> >> >> > > Label in Flex and Royale is not intended to have any children
> >> >>(other
> >> >> >> than
> >> >> >> > > bold, italic and other text markup).  Span represents that.
> >>Div
> >> >> >>does
> >> >> >> > not.
> >> >> >> > > You are suggesting changing to div JUST IN CASE someone needs
> >>to
> >> >> >>set a
> >> >> >> > > width and/or truncate.  Just-in-case code is not PAYG.
> >> >> >> > >
> >> >> >> > > My 2 cents,
> >> >> >> > > -Alex
> >> >> >> > >
> >> >> >> > > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
> >> >> >> > carlos.rovira@gmail.com> on behalf of Carlos Rovira"
> >> >> >> > > <carlos.rovira@gmail.com <ma...@gmail.com> on
> >> >>behalf
> >> >> >>of
> >> >> >> > carlosrovira@apache.org <ma...@apache.org>>
> wrote:
> >> >> >> > >
> >> >> >> > >> And why not change IBeadView in Label for a view that uses a
> >>div
> >> >> >>when
> >> >> >> > >> needed? ;)
> >> >> >> > >> in the other cases, maintains the span
> >> >> >> > >>
> >> >> >> > >> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
> >> >> >> > >>
> >> >> >> > >>> I’m still not understanding you. What about Label says it’s
> >>a
> >> >>span
> >> >> >> > >>> instead
> >> >> >> > >>> of a div? Why is making it a div not PAYG? Span simply
> >>limits
> >> >> >>Label
> >> >> >> > >>> unnecessarily. I think span is not the appropriate element
> >>for
> >> >> >>Label.
> >> >> >> > >>>
> >> >> >> > >>>> A Label without width should grow to the size of its text.
> >> >>Isn't
> >> >> >> that
> >> >> >> > >>> how
> >> >> >> > >>>> it worked in Flex?
> >> >> >> > >>>
> >> >> >> > >>> Sure, and a div does that too. In Flex, a label could have a
> >> >>width
> >> >> >> too
> >> >> >> > >>> if
> >> >> >> > >>> specified. Spans cannot.
> >> >> >> > >>>
> >> >> >> > >>> Harbs
> >> >> >> > >>>
> >> >> >> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui
> >> >> >><ah...@adobe.com.INVALID>
> >> >> >> > >>> wrote:
> >> >> >> > >>>>
> >> >> >> > >>>> Have the truncation bead swap the span for div.  Again,
> >>some
> >> >> >> component
> >> >> >> > >>> has
> >> >> >> > >>>> to put a span in the DOM.  Label has been just fine for
> >>that
> >> >>so
> >> >> >>far.
> >> >> >> > >>>>
> >> >> >> > >>>> A Label without width should grow to the size of its text.
> >> >>Isn't
> >> >> >> that
> >> >> >> > >>> how
> >> >> >> > >>>> it worked in Flex?
> >> >> >> > >>>>
> >> >> >> > >>>> Maybe Label should be refactored to not have width/height
> >> >> >>properties
> >> >> >> > >>> but
> >> >> >> > >>>> IMO we have bigger fish to fry.
> >> >> >> > >>>>
> >> >> >> > >>>> I'm sure Div is used to wrap text in some frameworks, but
> >> >>those
> >> >> >> > >>> frameworks
> >> >> >> > >>>> probably aren't PAYG.  In Alina's app, Label has a usage
> >> >>score of
> >> >> >> 69,
> >> >> >> > >>> but
> >> >> >> > >>>> Label.width has a score of only 5.  We will have her use
> >> >> >> > >>>> LabelWithTruncation or add the truncation bead on the few
> >> >>labels
> >> >> >> that
> >> >> >> > >>> need
> >> >> >> > >>>>
> >> >> >> > >>>> My 2 cents,
> >> >> >> > >>>> -Alex
> >> >> >> > >>>>
> >> >> >> > >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com>
> >>wrote:
> >> >> >> > >>>>
> >> >> >> > >>>>> But we already have a truncation bead. The only reason it
> >> >> >>doesn’t
> >> >> >> > >>> work
> >> >> >> > >>> in
> >> >> >> > >>>>> Label is because spans don’t have widths.
> >> >> >> > >>>>>
> >> >> >> > >>>>> Label is not something which should flow beyond its
> >>bounds —
> >> >> >>which
> >> >> >> is
> >> >> >> > >>>>> what span is useful for. I still don’t see why you think
> >>span
> >> >> >>makes
> >> >> >> > >>> more
> >> >> >> > >>>>> sense.
> >> >> >> > >>>>>
> >> >> >> > >>>>> FWIW, div *is* used as a container for text in various
> >> >> >>frameworks.
> >> >> >> > >>>>>
> >> >> >> > >>>>> My $0.02,
> >> >> >> > >>>>> Harbs
> >> >> >> > >>>>>
> >> >> >> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui
> >> >> >><aharui@adobe.com.INVALID
> >> >> >> >
> >> >> >> > >>>>>> wrote:
> >> >> >> > >>>>>>
> >> >> >> > >>>>>> AIUI, "inline" is the default display style for Span.
> >> >>"block"
> >> >> >>is
> >> >> >> > >>> the
> >> >> >> > >>>>>> default for Div.  HTML flows inline by default for just
> >> >>plain
> >> >> >> text.
> >> >> >> > >>>>>> Basic
> >> >> >> > >>>>>> components try to give Flex-friendly names for
> >>HTMLElements.
> >> >> >>Some
> >> >> >> > >>>>>> component in Basic needs to inject a span into the DOM.
> >>In
> >> >>a
> >> >> >>few
> >> >> >> > >>>>>> seconds
> >> >> >> > >>>>>> of looking at a Google web page, I did not see any divs
> >>with
> >> >> >>text
> >> >> >> as
> >> >> >> > >>>>>> children.  I saw spans.  The Divs all contained other
> >> >>elements.
> >> >> >> > >>>>>>
> >> >> >> > >>>>>> I don't create HTML web pages for a living, but if I
> >>were to
> >> >> >> place a
> >> >> >> > >>>>>> label
> >> >> >> > >>>>>> over a control like I often see in Flex, I would not wrap
> >> >>the
> >> >> >> label
> >> >> >> > >>> in
> >> >> >> > >>> a
> >> >> >> > >>>>>> Div.  The control would be div, so I would us a span or
> >>just
> >> >> >>plain
> >> >> >> > >>> text.
> >> >> >> > >>>>>> If I looked at the final DOM and saw Divs around every
> >> >>chunk of
> >> >> >> > >>> text, I
> >> >> >> > >>>>>> would think there is something heavy about the framework.
> >> >> >> > >>>>>>
> >> >> >> > >>>>>> Again, the goal is to encapsulate common patterns.  Label
> >> >> >>combined
> >> >> >> > >>> with
> >> >> >> > >>>>>> some control is trying to replicate common patterns for
> >> >> >>labeling
> >> >> >> > >>>>>> controls.
> >> >> >> > >>>>>> You are trying to solve the common pattern of truncating
> >> >>text.
> >> >> >> That
> >> >> >> > >>>>>> will
> >> >> >> > >>>>>> require a Div. But truncation, or even width/height is
> >>not
> >> >> >> something
> >> >> >> > >>>>>> that
> >> >> >> > >>>>>> should be built into Label for PAYG reasons.  IMO, you
> >> >>should
> >> >> >> > >>> create a
> >> >> >> > >>>>>> different component with a different name.
> >> >>TruncatingLabel, or
> >> >> >> > >>>>>> LabelWIthTruncation.
> >> >> >> > >>>>>>
> >> >> >> > >>>>>> My 2 cents,
> >> >> >> > >>>>>> -Alex
> >> >> >> > >>>>>>
> >> >> >> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com>
> >> wrote:
> >> >> >> > >>>>>>
> >> >> >> > >>>>>>> Why is span lighter than div?
> >> >> >> > >>>>>>>
> >> >> >> > >>>>>>> Inline and nowrap is not specific to span. AFAICT,
> >>there’s
> >> >> >> nothing
> >> >> >> > >>>>>>> specific to snap which fits Label better than div.
> >> >> >> > >>>>>>>
> >> >> >> > >>>>>>> As far as components which “does” span: Besides Span in
> >> >>HTML,
> >> >> >>we
> >> >> >> > >>> have
> >> >> >> > >>>>>>> HTMLText in Basic which encapsulates span.
> >> >> >> > >>>>>>>
> >> >> >> > >>>>>>> I can revert the change I made to Label, but I have not
> >> >>seen
> >> >> >>any
> >> >> >> > >>>>>>> downside
> >> >> >> > >>>>>>> to using div for Label. It seems to me that there’s
> >> >>nothing in
> >> >> >> the
> >> >> >> > >>>>>>> Label
> >> >> >> > >>>>>>> promise which dictates using span.
> >> >> >> > >>>>>>>
> >> >> >> > >>>>>>> Harbs
> >> >> >> > >>>>>>>
> >> >> >> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui
> >> >> >> <aharui@adobe.com.INVALID
> >> >> >> > >
> >> >> >> > >>>>>>>> wrote:
> >> >> >> > >>>>>>>>
> >> >> >> > >>>>>>>>
> >> >> >> > >>>>>>>>
> >> >> >> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com>
> >> >>wrote:
> >> >> >> > >>>>>>>>
> >> >> >> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element component
> >>set
> >> >> >>which
> >> >> >> > >>> more
> >> >> >> > >>>>>>>>> thinly wraps HTML elements.
> >> >> >> > >>>>>>>>>
> >> >> >> > >>>>>>>>> I can’t think of any reason why Label would be better
> >>as
> >> >>a
> >> >> >>span
> >> >> >> > >>> than
> >> >> >> > >>>>>>>>> a
> >> >> >> > >>>>>>>>> div. It seems to me that simply using div instead of
> >>span
> >> >> >>would
> >> >> >> > >>> make
> >> >> >> > >>>>>>>>> Label more versatile. Am I missing something?
> >> >> >> > >>>>>>>>
> >> >> >> > >>>>>>>> You may be missing that the only real goal of Royale
> >>is to
> >> >> >> > >>> encapsulate
> >> >> >> > >>>>>>>> popular patterns.  Pretty sure I've seen span used on
> >>many
> >> >> >>web
> >> >> >> > >>> pages,
> >> >> >> > >>>>>>>> so
> >> >> >> > >>>>>>>> we need a component that does what it does, including
> >> >> >>assuming
> >> >> >> > >>> inline
> >> >> >> > >>>>>>>> instead of block display.  Similarly, what would you
> >>think
> >> >> >>of a
> >> >> >> > >>>>>>>> framework
> >> >> >> > >>>>>>>> that had a HelloWorld that used a div instead of a
> >>span?
> >> >>You
> >> >> >> > >>> might
> >> >> >> > >>>>>>>> think
> >> >> >> > >>>>>>>> it is too heavy.
> >> >> >> > >>>>>>>>
> >> >> >> > >>>>>>>> Per PAYG, if span doesn’t' support certain features,
> >>then
> >> >>you
> >> >> >> > >>> create
> >> >> >> > >>> a
> >> >> >> > >>>>>>>> LabelWithTruncation and have it use a Div if you need
> >>to.
> >> >> >> > >>>>>>>>
> >> >> >> > >>>>>>>> My 2 cents,
> >> >> >> > >>>>>>>> -Alex
> >> >> >> > >>>>>>>>>
> >> >> >> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent
> >> >> >><pent@adobe.com.INVALID
> >> >> >> >
> >> >> >> > >>>>>>>>>> wrote:
> >> >> >> > >>>>>>>>>>
> >> >> >> > >>>>>>>>>> Label was one of the very first components and the
> >>idea
> >> >>was
> >> >> >> > >>>>>>>>>> minimalism.
> >> >> >> > >>>>>>>>>> Button was <button> and TextInput was <input
> >> >>type="text">
> >> >> >>and
> >> >> >> > >>> Label
> >> >> >> > >>>>>>>>>> was
> >> >> >> > >>>>>>>>>> <span>.
> >> >> >> > >>>>>>>>>>
> >> >> >> > >>>>>>>>>> I'm wondering if we should have NativeButton,
> >> >>NativeLabel,
> >> >> >> etc.
> >> >> >> > >>>>>>>>>> which
> >> >> >> > >>>>>>>>>> would be these minimal elements and have others that
> >>are
> >> >> >><div>
> >> >> >> > >>>>>>>>>> wrapping.
> >> >> >> > >>>>>>>>>> For instance, ImageAndTextButton is a <button><img
> >> >> >> > >>>>>>>>>> src="goo.jpg">Label
> >> >> >> > >>>>>>>>>> Here</button> which works but the alignment is weird
> >>so
> >> >> >>maybe
> >> >> >> > >>>>>>>>>> ImageAndTextButton should be a <div><img>Text</div>
> >> >>which
> >> >> >>can
> >> >> >> be
> >> >> >> > >>>>>>>>>> aligned
> >> >> >> > >>>>>>>>>> and styled better.
> >> >> >> > >>>>>>>>>>
> >> >> >> > >>>>>>>>>> Anyway, that's the reason: simplicity.
> >> >> >> > >>>>>>>>>>
> >> >> >> > >>>>>>>>>> ‹peter
> >> >> >> > >>>>>>>>>>
> >> >> >> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com>
> >> >> wrote:
> >> >> >> > >>>>>>>>>>
> >> >> >> > >>>>>>>>>>> Is there a reason that the element type of Basic
> >>Label
> >> >>is
> >> >> >> span?
> >> >> >> > >>>>>>>>>>>
> >> >> >> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and
> >>it
> >> >> >>does
> >> >> >> not
> >> >> >> > >>>>>>>>>>> seem
> >> >> >> > >>>>>>>>>>> to
> >> >> >> > >>>>>>>>>>> work because spans donąt really have a working
> >>width.
> >> >> >> Switching
> >> >> >> > >>> the
> >> >> >> > >>>>>>>>>>> element type to div seems to make it work.
> >> >> >> > >>>>>>>>>>>
> >> >> >> > >>>>>>>>>>> Harbs
> >> >> >> > >>>>>>>>>>
> >> >> >> > >>>>>>>>>
> >> >> >> > >>>>>>>>
> >> >> >> > >>>>>>>
> >> >> >> > >>>>>>
> >> >> >> > >>>>>
> >> >> >> > >>>>
> >> >> >> > >>>
> >> >> >> > >>>
> >> >> >> > >>
> >> >> >> > >>
> >> >> >> > >> --
> >> >> >> > >> Carlos Rovira
> >> >> >> > >> https://na01.safelinks.protection.outlook.com/?url=
> >> >> >> > http%3A%2F%2Fabout.me%2
> >> >> >><https://na01.safelinks.protection.outlook.com/?url=
> >> >> https%3A%2F%2Fna01.sa
> >> >>
> >> >>>>felinks&data=02%7C01%7Caharui%40adobe.com%
> >> 7C3664f690b3da4e4aefab08d58ac
> >> >>>>c
> >> >> 7
> >> >> >>bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> >> >> 7C636567533215453966&sdata
> >> >> >>=exoH%2BPKzuyM%2BykE65GQeHk%2BjPAZSsUFjsKwx3BRvjsk%3D&reserved=0.
> >> >> >> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
> >> >> >> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com
> >> >>
> >> >>>><https://na01.safelinks.protection.outlook.com/?url=
> >> http%3A%2F%2F40adob
> >> >>>>e
> >> >> .
> >> >>
> >> >>>>com%2F&data=02%7C01%7Caharui%40adobe.com%
> >> 7C3664f690b3da4e4aefab08d58acc
> >> >> 7b
> >> >> >>f0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> >> >> 7C636567533215453966&sdata=
> >> >> >>ewhtNMkSjHssIseUSvxq9etF%2FtrcA%2Buqk3sZlJkjHuc%3D&reserved=0
> >> >> >> >%
> >> >> >> > 7Cae539925833d453aaa2e08d5
> >> >> >> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> >> >> >> > 7C636567454874235113&s
> >> >> >> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY
> >> 1WVtz2xsNvc%3D&reserved=0
> >> >> >> >
> >> >> >> >
> >> >> >>
> >> >>
> >> >>
> >>
> >>
>
>

Re: Label

Posted by Alex Harui <ah...@adobe.com.INVALID>.

On 3/15/18, 8:47 PM, "Greg Dove" <gr...@gmail.com> wrote:

>  Label is a single-line sequence of text.
>
>I think that is the statement that might be in the process of being
>indirectly debated.
>Is it documented as such?

Really?  We're going to nitpick over the completeness of our doc?  There
is a MultilineLabel component for a reason.  I did not like adding more
blades to the swiss-army knife in Spark Label.  That wasn't PAYG.  MX
Label doc is here:
https://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/cont
rols/Label.html

It says:  "The Label control displays a single line of noneditable text."

Still trying to help our migrating users...
-Alex
>
>On Fri, Mar 16, 2018 at 4:37 PM, Alex Harui <ah...@adobe.com.invalid>
>wrote:
>
>> Because, this isn't an issue of performance.  We give our users choices
>> and a toolkit to replicate ANY HTML tree they want to.  We are proposing
>> to replace what is to me the most obvious Flex-like component name for
>> injecting a span into the DOM.  Label is a single-line sequence of text.
>> So is Span.
>>
>> I'm not seeing a huge performance difference.  If you think it is
>> significant enough that our users should be alerted to use SizeableLabel
>> or whatever we call the Div-wrapping-text version, start blogging it
>>after
>> you validate your test case.  I noticed that the number of Spans the
>>test
>> appears to report are higher than the number of Divs, but that might be
>>a
>> false alarm.  You can be a hero in the web world if you are right and
>> change the advice I see elsewhere on the net to use Span for inline
>> elements and Div for other things.  Even the JSPerf page is using spans.
>> Tell them to replace them.
>>
>> Meanwhile, I'm going back to try to migrate an app.  Sure wish we had
>>more
>> people helping on that.
>>
>> -Alex
>>
>>
>> We can certainly give them advice that SizedLabel is faster than Label
>>if
>> that's important, but the different didn't seem that significant.
>>
>> On 3/15/18, 6:14 PM, "omuppi1@gmail.com on behalf of OmPrakash
>>Muppirala"
>> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
>>
>> >If creating a div is more performant than creating a span, why insist
>>on
>> >using a span?  How is that pay as you go?
>> >
>> >Thanks,
>> >Om
>> >
>> >On Thu, Mar 15, 2018 at 5:19 PM, Alex Harui <ah...@adobe.com.invalid>
>> >wrote:
>> >
>> >> A Flex Label, and any Flex component was a swiss-army knife of
>>features
>> >> and not PAYG.  I have not given up on PAYG.  I think it will pay off
>> >>when
>> >> we get to the last mile.  If we don't stick to PAYG, I think we will
>> >>just
>> >> repeat the history of Flex and produce a fat framework that can't run
>> >> everywhere.  Yes, a Div would probably better mimic a Flex Label, but
>> >>the
>> >> Basic label is not a swiss-army knife.
>> >>
>> >> This article is old, but I think it says you can't put a Div in a
>>Span:
>> >>
>> >>https://na01.safelinks.protection.outlook.com/?url=
>> http%3A%2F%2Fdoctype.c
>> >>om%2Fspan-contain-div-html5&data=02%7C01%7Caharui%40adobe.com
>> %7C77b57b271
>> >>ef7423114c208d58ae0d810%7Cfa7b1b5a7b34438794aed2c178de
>> cee1%7C0%7C0%7C6365
>> >>67620658308491&sdata=o9msOjZpbwywflSfgJDebUdMM3hgNP
>> dN%2Btn%2BrcSZsV4%3D&r
>> >>eserved=0
>> >>
>> >> I think you can if you change the span's display to "block" but I
>>think
>> >> that is essentially replacing the element.
>> >>
>> >> Everything, including width and truncation should be opt-in, PAYG.
>> >>Make a
>> >> LabelWithWidth or SizeableLabel component that is a div if you want.
>> >>
>> >> Again, the goal is to encapsulate common patterns.  I am not seeing a
>> >>lot
>> >> of Divs wrapping text nodes.  I see lots of spans wrapping text
>>nodes.
>> >> Basic Label is that pattern.  The Basic component set would be
>> >>incomplete
>> >> if there wasn't a component that could inject a Span into the DOM.
>> >>Create
>> >> another component that is a Div wrapping a text node, give it a
>> >>different
>> >> name, and let's move on.
>> >>
>> >> Alina used Label quite often without setting width.  No need for
>>those
>> >> instances to be a Div, AFAICT.
>> >>
>> >> Do we even need to discuss span vs div if the truncation bead will
>>work
>> >>by
>> >> setting display:block?
>> >>
>> >> We have a huge opportunity here to get another app migrated and
>>prove to
>> >> the world that Royale is the right choice.  But we keep discussing
>>stuff
>> >> that IMO, isn't really moving the big pieces forward.  But, IMO, we
>> >>should
>> >> not compromise on PAYG philosophy and patterns.
>> >>
>> >> My 2 cents,
>> >> -Alex
>> >>
>> >> On 3/15/18, 4:27 PM, "omuppi1@gmail.com on behalf of OmPrakash
>> >>Muppirala"
>> >> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
>> >>
>> >> >FWIW, it seems like creating divs is faster than creating spans.
>> >> >https://na01.safelinks.protection.outlook.com/?url=
>> >> https%3A%2F%2Fjsperf.co
>> >> >m%2Fspan-vs-div-creation&data=02%7C01%7Caharui%40adobe.com
>> >> %7C3664f690b3da4
>> >> >e4aefab08d58acc7bf0%7Cfa7b1b5a7b34438794aed2c178de
>> >> cee1%7C0%7C0%7C636567533
>> >> >215453966&sdata=oPPp2e9aRbQ%2FngKbcFMHMCmXi%2BKa%2B%
>> >> 2F0aA98XFFqxhFA%3D&res
>> >> >erved=0
>> >> >
>> >> >Thanks,
>> >> >Om
>> >> >
>> >> >On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <gr...@gmail.com>
>> wrote:
>> >> >
>> >> >> Observing from the sidelines, fwiw I agree with Harbs here. Span
>>to
>> >>me
>> >> >> makes more sense as part of the text value of a label and not as
>>the
>> >> >>basis
>> >> >> for the representation of the Label itself - div seems closer to
>> >>what I
>> >> >>was
>> >> >> used to with legacy Flex (which may no longer be the 'reference'
>>for
>> >> >> choosing an implementation).
>> >> >> I don't think there is any semantic or other reason that makes
>>span
>> >>the
>> >> >> logical default tag for Label, in fact I recall that being a
>>problem
>> >> >>many
>> >> >> times with some work I was involved with last year using FlexJS.
>> >> >> But maybe I am missing something in terms of understanding.
>> >> >>
>> >> >>
>> >> >>
>> >> >>
>> >> >> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <ha...@gmail.com>
>> >>wrote:
>> >> >>
>> >> >> > I’m suggesting to change it because span does not fit the use
>>case
>> >>of
>> >> >> > Label. Width and truncate are just two applications which
>>indicate
>> >> >>that
>> >> >> > span is not the correct element. I’m pretty sure I had other
>>edge
>> >> >>cases
>> >> >> > which were likely effected by the fact that Label is a span,
>> >>although
>> >> >>I’m
>> >> >> > not positive.
>> >> >> >
>> >> >> > I disagree with your distinction between span and div.
>> >> >> >
>> >> >> > Both span and div can have children. Spans can contain divs and
>> >>divs
>> >> >>can
>> >> >> > contain spans. At its core, Span has nothing to do with text.
>>It’s
>> >> >>just
>> >> >> > often used for text because text (within its container) is
>>inline.
>> >> >> >
>> >> >> > MDN says[1] "<span> is very much like a <div> element, but <div>
>> >>is a
>> >> >> > block-level element whereas a <span> is an inline element.”
>> >> >> >
>> >> >> > Label is *not* necessarily an inline element. We have all kinds
>>of
>> >> >> layouts
>> >> >> > for Label. Many (most?) of them are not inline.
>> >> >> >
>> >> >> > If you feel really strongly about this, I’ll revert even though
>>I
>> >> >> disagree.
>> >> >> >
>> >> >> > FWIW, the truncate bead does not need to change the element
>>type.
>> >>It
>> >> >>can
>> >> >> > explicitly set the display of the element to block.
>> >> >> >
>> >> >> > Harbs
>> >> >> >
>> >> >> >
>> >> >>[1]https://na01.safelinks.protection.outlook.com/?url=
>> >> https%3A%2F%2Fdevel
>> >> >>oper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
>> >> 2Fspan&data=02%7C0
>> >> >>1%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
>> >> 7bf0%7Cfa7b1b5a7b344
>> >> >>38794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
>> >> xrtF9H7%2BjFzqGDax
>> >> >>nj0%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0 <
>> >> >> >
>> >> >>https://na01.safelinks.protection.outlook.com/?url=
>> >> https%3A%2F%2Fdevelope
>> >> >>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
>> >> 2Fspan&data=02%7C01%7
>> >> >>Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
>> >> 7bf0%7Cfa7b1b5a7b344387
>> >> >>94aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
>> >> xrtF9H7%2BjFzqGDaxnj0
>> >> >>%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0>
>> >> >> >
>> >> >> > > On Mar 15, 2018, at 11:25 PM, Alex Harui
>> >><ah...@adobe.com.INVALID>
>> >> >> > wrote:
>> >> >> > >
>> >> >> > > Label in Flex and Royale is not intended to have any children
>> >>(other
>> >> >> than
>> >> >> > > bold, italic and other text markup).  Span represents that.
>>Div
>> >> >>does
>> >> >> > not.
>> >> >> > > You are suggesting changing to div JUST IN CASE someone needs
>>to
>> >> >>set a
>> >> >> > > width and/or truncate.  Just-in-case code is not PAYG.
>> >> >> > >
>> >> >> > > My 2 cents,
>> >> >> > > -Alex
>> >> >> > >
>> >> >> > > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
>> >> >> > carlos.rovira@gmail.com> on behalf of Carlos Rovira"
>> >> >> > > <carlos.rovira@gmail.com <ma...@gmail.com> on
>> >>behalf
>> >> >>of
>> >> >> > carlosrovira@apache.org <ma...@apache.org>> wrote:
>> >> >> > >
>> >> >> > >> And why not change IBeadView in Label for a view that uses a
>>div
>> >> >>when
>> >> >> > >> needed? ;)
>> >> >> > >> in the other cases, maintains the span
>> >> >> > >>
>> >> >> > >> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
>> >> >> > >>
>> >> >> > >>> I’m still not understanding you. What about Label says it’s
>>a
>> >>span
>> >> >> > >>> instead
>> >> >> > >>> of a div? Why is making it a div not PAYG? Span simply
>>limits
>> >> >>Label
>> >> >> > >>> unnecessarily. I think span is not the appropriate element
>>for
>> >> >>Label.
>> >> >> > >>>
>> >> >> > >>>> A Label without width should grow to the size of its text.
>> >>Isn't
>> >> >> that
>> >> >> > >>> how
>> >> >> > >>>> it worked in Flex?
>> >> >> > >>>
>> >> >> > >>> Sure, and a div does that too. In Flex, a label could have a
>> >>width
>> >> >> too
>> >> >> > >>> if
>> >> >> > >>> specified. Spans cannot.
>> >> >> > >>>
>> >> >> > >>> Harbs
>> >> >> > >>>
>> >> >> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui
>> >> >><ah...@adobe.com.INVALID>
>> >> >> > >>> wrote:
>> >> >> > >>>>
>> >> >> > >>>> Have the truncation bead swap the span for div.  Again,
>>some
>> >> >> component
>> >> >> > >>> has
>> >> >> > >>>> to put a span in the DOM.  Label has been just fine for
>>that
>> >>so
>> >> >>far.
>> >> >> > >>>>
>> >> >> > >>>> A Label without width should grow to the size of its text.
>> >>Isn't
>> >> >> that
>> >> >> > >>> how
>> >> >> > >>>> it worked in Flex?
>> >> >> > >>>>
>> >> >> > >>>> Maybe Label should be refactored to not have width/height
>> >> >>properties
>> >> >> > >>> but
>> >> >> > >>>> IMO we have bigger fish to fry.
>> >> >> > >>>>
>> >> >> > >>>> I'm sure Div is used to wrap text in some frameworks, but
>> >>those
>> >> >> > >>> frameworks
>> >> >> > >>>> probably aren't PAYG.  In Alina's app, Label has a usage
>> >>score of
>> >> >> 69,
>> >> >> > >>> but
>> >> >> > >>>> Label.width has a score of only 5.  We will have her use
>> >> >> > >>>> LabelWithTruncation or add the truncation bead on the few
>> >>labels
>> >> >> that
>> >> >> > >>> need
>> >> >> > >>>>
>> >> >> > >>>> My 2 cents,
>> >> >> > >>>> -Alex
>> >> >> > >>>>
>> >> >> > >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com>
>>wrote:
>> >> >> > >>>>
>> >> >> > >>>>> But we already have a truncation bead. The only reason it
>> >> >>doesn’t
>> >> >> > >>> work
>> >> >> > >>> in
>> >> >> > >>>>> Label is because spans don’t have widths.
>> >> >> > >>>>>
>> >> >> > >>>>> Label is not something which should flow beyond its
>>bounds —
>> >> >>which
>> >> >> is
>> >> >> > >>>>> what span is useful for. I still don’t see why you think
>>span
>> >> >>makes
>> >> >> > >>> more
>> >> >> > >>>>> sense.
>> >> >> > >>>>>
>> >> >> > >>>>> FWIW, div *is* used as a container for text in various
>> >> >>frameworks.
>> >> >> > >>>>>
>> >> >> > >>>>> My $0.02,
>> >> >> > >>>>> Harbs
>> >> >> > >>>>>
>> >> >> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui
>> >> >><aharui@adobe.com.INVALID
>> >> >> >
>> >> >> > >>>>>> wrote:
>> >> >> > >>>>>>
>> >> >> > >>>>>> AIUI, "inline" is the default display style for Span.
>> >>"block"
>> >> >>is
>> >> >> > >>> the
>> >> >> > >>>>>> default for Div.  HTML flows inline by default for just
>> >>plain
>> >> >> text.
>> >> >> > >>>>>> Basic
>> >> >> > >>>>>> components try to give Flex-friendly names for
>>HTMLElements.
>> >> >>Some
>> >> >> > >>>>>> component in Basic needs to inject a span into the DOM.
>>In
>> >>a
>> >> >>few
>> >> >> > >>>>>> seconds
>> >> >> > >>>>>> of looking at a Google web page, I did not see any divs
>>with
>> >> >>text
>> >> >> as
>> >> >> > >>>>>> children.  I saw spans.  The Divs all contained other
>> >>elements.
>> >> >> > >>>>>>
>> >> >> > >>>>>> I don't create HTML web pages for a living, but if I
>>were to
>> >> >> place a
>> >> >> > >>>>>> label
>> >> >> > >>>>>> over a control like I often see in Flex, I would not wrap
>> >>the
>> >> >> label
>> >> >> > >>> in
>> >> >> > >>> a
>> >> >> > >>>>>> Div.  The control would be div, so I would us a span or
>>just
>> >> >>plain
>> >> >> > >>> text.
>> >> >> > >>>>>> If I looked at the final DOM and saw Divs around every
>> >>chunk of
>> >> >> > >>> text, I
>> >> >> > >>>>>> would think there is something heavy about the framework.
>> >> >> > >>>>>>
>> >> >> > >>>>>> Again, the goal is to encapsulate common patterns.  Label
>> >> >>combined
>> >> >> > >>> with
>> >> >> > >>>>>> some control is trying to replicate common patterns for
>> >> >>labeling
>> >> >> > >>>>>> controls.
>> >> >> > >>>>>> You are trying to solve the common pattern of truncating
>> >>text.
>> >> >> That
>> >> >> > >>>>>> will
>> >> >> > >>>>>> require a Div. But truncation, or even width/height is
>>not
>> >> >> something
>> >> >> > >>>>>> that
>> >> >> > >>>>>> should be built into Label for PAYG reasons.  IMO, you
>> >>should
>> >> >> > >>> create a
>> >> >> > >>>>>> different component with a different name.
>> >>TruncatingLabel, or
>> >> >> > >>>>>> LabelWIthTruncation.
>> >> >> > >>>>>>
>> >> >> > >>>>>> My 2 cents,
>> >> >> > >>>>>> -Alex
>> >> >> > >>>>>>
>> >> >> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com>
>> wrote:
>> >> >> > >>>>>>
>> >> >> > >>>>>>> Why is span lighter than div?
>> >> >> > >>>>>>>
>> >> >> > >>>>>>> Inline and nowrap is not specific to span. AFAICT,
>>there’s
>> >> >> nothing
>> >> >> > >>>>>>> specific to snap which fits Label better than div.
>> >> >> > >>>>>>>
>> >> >> > >>>>>>> As far as components which “does” span: Besides Span in
>> >>HTML,
>> >> >>we
>> >> >> > >>> have
>> >> >> > >>>>>>> HTMLText in Basic which encapsulates span.
>> >> >> > >>>>>>>
>> >> >> > >>>>>>> I can revert the change I made to Label, but I have not
>> >>seen
>> >> >>any
>> >> >> > >>>>>>> downside
>> >> >> > >>>>>>> to using div for Label. It seems to me that there’s
>> >>nothing in
>> >> >> the
>> >> >> > >>>>>>> Label
>> >> >> > >>>>>>> promise which dictates using span.
>> >> >> > >>>>>>>
>> >> >> > >>>>>>> Harbs
>> >> >> > >>>>>>>
>> >> >> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui
>> >> >> <aharui@adobe.com.INVALID
>> >> >> > >
>> >> >> > >>>>>>>> wrote:
>> >> >> > >>>>>>>>
>> >> >> > >>>>>>>>
>> >> >> > >>>>>>>>
>> >> >> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com>
>> >>wrote:
>> >> >> > >>>>>>>>
>> >> >> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element component
>>set
>> >> >>which
>> >> >> > >>> more
>> >> >> > >>>>>>>>> thinly wraps HTML elements.
>> >> >> > >>>>>>>>>
>> >> >> > >>>>>>>>> I can’t think of any reason why Label would be better
>>as
>> >>a
>> >> >>span
>> >> >> > >>> than
>> >> >> > >>>>>>>>> a
>> >> >> > >>>>>>>>> div. It seems to me that simply using div instead of
>>span
>> >> >>would
>> >> >> > >>> make
>> >> >> > >>>>>>>>> Label more versatile. Am I missing something?
>> >> >> > >>>>>>>>
>> >> >> > >>>>>>>> You may be missing that the only real goal of Royale
>>is to
>> >> >> > >>> encapsulate
>> >> >> > >>>>>>>> popular patterns.  Pretty sure I've seen span used on
>>many
>> >> >>web
>> >> >> > >>> pages,
>> >> >> > >>>>>>>> so
>> >> >> > >>>>>>>> we need a component that does what it does, including
>> >> >>assuming
>> >> >> > >>> inline
>> >> >> > >>>>>>>> instead of block display.  Similarly, what would you
>>think
>> >> >>of a
>> >> >> > >>>>>>>> framework
>> >> >> > >>>>>>>> that had a HelloWorld that used a div instead of a
>>span?
>> >>You
>> >> >> > >>> might
>> >> >> > >>>>>>>> think
>> >> >> > >>>>>>>> it is too heavy.
>> >> >> > >>>>>>>>
>> >> >> > >>>>>>>> Per PAYG, if span doesn’t' support certain features,
>>then
>> >>you
>> >> >> > >>> create
>> >> >> > >>> a
>> >> >> > >>>>>>>> LabelWithTruncation and have it use a Div if you need
>>to.
>> >> >> > >>>>>>>>
>> >> >> > >>>>>>>> My 2 cents,
>> >> >> > >>>>>>>> -Alex
>> >> >> > >>>>>>>>>
>> >> >> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent
>> >> >><pent@adobe.com.INVALID
>> >> >> >
>> >> >> > >>>>>>>>>> wrote:
>> >> >> > >>>>>>>>>>
>> >> >> > >>>>>>>>>> Label was one of the very first components and the
>>idea
>> >>was
>> >> >> > >>>>>>>>>> minimalism.
>> >> >> > >>>>>>>>>> Button was <button> and TextInput was <input
>> >>type="text">
>> >> >>and
>> >> >> > >>> Label
>> >> >> > >>>>>>>>>> was
>> >> >> > >>>>>>>>>> <span>.
>> >> >> > >>>>>>>>>>
>> >> >> > >>>>>>>>>> I'm wondering if we should have NativeButton,
>> >>NativeLabel,
>> >> >> etc.
>> >> >> > >>>>>>>>>> which
>> >> >> > >>>>>>>>>> would be these minimal elements and have others that
>>are
>> >> >><div>
>> >> >> > >>>>>>>>>> wrapping.
>> >> >> > >>>>>>>>>> For instance, ImageAndTextButton is a <button><img
>> >> >> > >>>>>>>>>> src="goo.jpg">Label
>> >> >> > >>>>>>>>>> Here</button> which works but the alignment is weird
>>so
>> >> >>maybe
>> >> >> > >>>>>>>>>> ImageAndTextButton should be a <div><img>Text</div>
>> >>which
>> >> >>can
>> >> >> be
>> >> >> > >>>>>>>>>> aligned
>> >> >> > >>>>>>>>>> and styled better.
>> >> >> > >>>>>>>>>>
>> >> >> > >>>>>>>>>> Anyway, that's the reason: simplicity.
>> >> >> > >>>>>>>>>>
>> >> >> > >>>>>>>>>> ‹peter
>> >> >> > >>>>>>>>>>
>> >> >> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com>
>> >> wrote:
>> >> >> > >>>>>>>>>>
>> >> >> > >>>>>>>>>>> Is there a reason that the element type of Basic
>>Label
>> >>is
>> >> >> span?
>> >> >> > >>>>>>>>>>>
>> >> >> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and
>>it
>> >> >>does
>> >> >> not
>> >> >> > >>>>>>>>>>> seem
>> >> >> > >>>>>>>>>>> to
>> >> >> > >>>>>>>>>>> work because spans donąt really have a working
>>width.
>> >> >> Switching
>> >> >> > >>> the
>> >> >> > >>>>>>>>>>> element type to div seems to make it work.
>> >> >> > >>>>>>>>>>>
>> >> >> > >>>>>>>>>>> Harbs
>> >> >> > >>>>>>>>>>
>> >> >> > >>>>>>>>>
>> >> >> > >>>>>>>>
>> >> >> > >>>>>>>
>> >> >> > >>>>>>
>> >> >> > >>>>>
>> >> >> > >>>>
>> >> >> > >>>
>> >> >> > >>>
>> >> >> > >>
>> >> >> > >>
>> >> >> > >> --
>> >> >> > >> Carlos Rovira
>> >> >> > >> https://na01.safelinks.protection.outlook.com/?url=
>> >> >> > http%3A%2F%2Fabout.me%2
>> >> >><https://na01.safelinks.protection.outlook.com/?url=
>> >> https%3A%2F%2Fna01.sa
>> >>
>> >>>>felinks&data=02%7C01%7Caharui%40adobe.com%
>> 7C3664f690b3da4e4aefab08d58ac
>> >>>>c
>> >> 7
>> >> >>bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>> >> 7C636567533215453966&sdata
>> >> >>=exoH%2BPKzuyM%2BykE65GQeHk%2BjPAZSsUFjsKwx3BRvjsk%3D&reserved=0.
>> >> >> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
>> >> >> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com
>> >>
>> >>>><https://na01.safelinks.protection.outlook.com/?url=
>> http%3A%2F%2F40adob
>> >>>>e
>> >> .
>> >>
>> >>>>com%2F&data=02%7C01%7Caharui%40adobe.com%
>> 7C3664f690b3da4e4aefab08d58acc
>> >> 7b
>> >> >>f0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>> >> 7C636567533215453966&sdata=
>> >> >>ewhtNMkSjHssIseUSvxq9etF%2FtrcA%2Buqk3sZlJkjHuc%3D&reserved=0
>> >> >> >%
>> >> >> > 7Cae539925833d453aaa2e08d5
>> >> >> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>> >> >> > 7C636567454874235113&s
>> >> >> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY
>> 1WVtz2xsNvc%3D&reserved=0
>> >> >> >
>> >> >> >
>> >> >>
>> >>
>> >>
>>
>>


Re: Label

Posted by Greg Dove <gr...@gmail.com>.
  Label is a single-line sequence of text.

I think that is the statement that might be in the process of being
indirectly debated.
Is it documented as such?



On Fri, Mar 16, 2018 at 4:37 PM, Alex Harui <ah...@adobe.com.invalid>
wrote:

> Because, this isn't an issue of performance.  We give our users choices
> and a toolkit to replicate ANY HTML tree they want to.  We are proposing
> to replace what is to me the most obvious Flex-like component name for
> injecting a span into the DOM.  Label is a single-line sequence of text.
> So is Span.
>
> I'm not seeing a huge performance difference.  If you think it is
> significant enough that our users should be alerted to use SizeableLabel
> or whatever we call the Div-wrapping-text version, start blogging it after
> you validate your test case.  I noticed that the number of Spans the test
> appears to report are higher than the number of Divs, but that might be a
> false alarm.  You can be a hero in the web world if you are right and
> change the advice I see elsewhere on the net to use Span for inline
> elements and Div for other things.  Even the JSPerf page is using spans.
> Tell them to replace them.
>
> Meanwhile, I'm going back to try to migrate an app.  Sure wish we had more
> people helping on that.
>
> -Alex
>
>
> We can certainly give them advice that SizedLabel is faster than Label if
> that's important, but the different didn't seem that significant.
>
> On 3/15/18, 6:14 PM, "omuppi1@gmail.com on behalf of OmPrakash Muppirala"
> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
>
> >If creating a div is more performant than creating a span, why insist on
> >using a span?  How is that pay as you go?
> >
> >Thanks,
> >Om
> >
> >On Thu, Mar 15, 2018 at 5:19 PM, Alex Harui <ah...@adobe.com.invalid>
> >wrote:
> >
> >> A Flex Label, and any Flex component was a swiss-army knife of features
> >> and not PAYG.  I have not given up on PAYG.  I think it will pay off
> >>when
> >> we get to the last mile.  If we don't stick to PAYG, I think we will
> >>just
> >> repeat the history of Flex and produce a fat framework that can't run
> >> everywhere.  Yes, a Div would probably better mimic a Flex Label, but
> >>the
> >> Basic label is not a swiss-army knife.
> >>
> >> This article is old, but I think it says you can't put a Div in a Span:
> >>
> >>https://na01.safelinks.protection.outlook.com/?url=
> http%3A%2F%2Fdoctype.c
> >>om%2Fspan-contain-div-html5&data=02%7C01%7Caharui%40adobe.com
> %7C77b57b271
> >>ef7423114c208d58ae0d810%7Cfa7b1b5a7b34438794aed2c178de
> cee1%7C0%7C0%7C6365
> >>67620658308491&sdata=o9msOjZpbwywflSfgJDebUdMM3hgNP
> dN%2Btn%2BrcSZsV4%3D&r
> >>eserved=0
> >>
> >> I think you can if you change the span's display to "block" but I think
> >> that is essentially replacing the element.
> >>
> >> Everything, including width and truncation should be opt-in, PAYG.
> >>Make a
> >> LabelWithWidth or SizeableLabel component that is a div if you want.
> >>
> >> Again, the goal is to encapsulate common patterns.  I am not seeing a
> >>lot
> >> of Divs wrapping text nodes.  I see lots of spans wrapping text nodes.
> >> Basic Label is that pattern.  The Basic component set would be
> >>incomplete
> >> if there wasn't a component that could inject a Span into the DOM.
> >>Create
> >> another component that is a Div wrapping a text node, give it a
> >>different
> >> name, and let's move on.
> >>
> >> Alina used Label quite often without setting width.  No need for those
> >> instances to be a Div, AFAICT.
> >>
> >> Do we even need to discuss span vs div if the truncation bead will work
> >>by
> >> setting display:block?
> >>
> >> We have a huge opportunity here to get another app migrated and prove to
> >> the world that Royale is the right choice.  But we keep discussing stuff
> >> that IMO, isn't really moving the big pieces forward.  But, IMO, we
> >>should
> >> not compromise on PAYG philosophy and patterns.
> >>
> >> My 2 cents,
> >> -Alex
> >>
> >> On 3/15/18, 4:27 PM, "omuppi1@gmail.com on behalf of OmPrakash
> >>Muppirala"
> >> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
> >>
> >> >FWIW, it seems like creating divs is faster than creating spans.
> >> >https://na01.safelinks.protection.outlook.com/?url=
> >> https%3A%2F%2Fjsperf.co
> >> >m%2Fspan-vs-div-creation&data=02%7C01%7Caharui%40adobe.com
> >> %7C3664f690b3da4
> >> >e4aefab08d58acc7bf0%7Cfa7b1b5a7b34438794aed2c178de
> >> cee1%7C0%7C0%7C636567533
> >> >215453966&sdata=oPPp2e9aRbQ%2FngKbcFMHMCmXi%2BKa%2B%
> >> 2F0aA98XFFqxhFA%3D&res
> >> >erved=0
> >> >
> >> >Thanks,
> >> >Om
> >> >
> >> >On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <gr...@gmail.com>
> wrote:
> >> >
> >> >> Observing from the sidelines, fwiw I agree with Harbs here. Span to
> >>me
> >> >> makes more sense as part of the text value of a label and not as the
> >> >>basis
> >> >> for the representation of the Label itself - div seems closer to
> >>what I
> >> >>was
> >> >> used to with legacy Flex (which may no longer be the 'reference' for
> >> >> choosing an implementation).
> >> >> I don't think there is any semantic or other reason that makes span
> >>the
> >> >> logical default tag for Label, in fact I recall that being a problem
> >> >>many
> >> >> times with some work I was involved with last year using FlexJS.
> >> >> But maybe I am missing something in terms of understanding.
> >> >>
> >> >>
> >> >>
> >> >>
> >> >> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <ha...@gmail.com>
> >>wrote:
> >> >>
> >> >> > I’m suggesting to change it because span does not fit the use case
> >>of
> >> >> > Label. Width and truncate are just two applications which indicate
> >> >>that
> >> >> > span is not the correct element. I’m pretty sure I had other edge
> >> >>cases
> >> >> > which were likely effected by the fact that Label is a span,
> >>although
> >> >>I’m
> >> >> > not positive.
> >> >> >
> >> >> > I disagree with your distinction between span and div.
> >> >> >
> >> >> > Both span and div can have children. Spans can contain divs and
> >>divs
> >> >>can
> >> >> > contain spans. At its core, Span has nothing to do with text. It’s
> >> >>just
> >> >> > often used for text because text (within its container) is inline.
> >> >> >
> >> >> > MDN says[1] "<span> is very much like a <div> element, but <div>
> >>is a
> >> >> > block-level element whereas a <span> is an inline element.”
> >> >> >
> >> >> > Label is *not* necessarily an inline element. We have all kinds of
> >> >> layouts
> >> >> > for Label. Many (most?) of them are not inline.
> >> >> >
> >> >> > If you feel really strongly about this, I’ll revert even though I
> >> >> disagree.
> >> >> >
> >> >> > FWIW, the truncate bead does not need to change the element type.
> >>It
> >> >>can
> >> >> > explicitly set the display of the element to block.
> >> >> >
> >> >> > Harbs
> >> >> >
> >> >> >
> >> >>[1]https://na01.safelinks.protection.outlook.com/?url=
> >> https%3A%2F%2Fdevel
> >> >>oper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
> >> 2Fspan&data=02%7C0
> >> >>1%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> >> 7bf0%7Cfa7b1b5a7b344
> >> >>38794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
> >> xrtF9H7%2BjFzqGDax
> >> >>nj0%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0 <
> >> >> >
> >> >>https://na01.safelinks.protection.outlook.com/?url=
> >> https%3A%2F%2Fdevelope
> >> >>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
> >> 2Fspan&data=02%7C01%7
> >> >>Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> >> 7bf0%7Cfa7b1b5a7b344387
> >> >>94aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
> >> xrtF9H7%2BjFzqGDaxnj0
> >> >>%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0>
> >> >> >
> >> >> > > On Mar 15, 2018, at 11:25 PM, Alex Harui
> >><ah...@adobe.com.INVALID>
> >> >> > wrote:
> >> >> > >
> >> >> > > Label in Flex and Royale is not intended to have any children
> >>(other
> >> >> than
> >> >> > > bold, italic and other text markup).  Span represents that.  Div
> >> >>does
> >> >> > not.
> >> >> > > You are suggesting changing to div JUST IN CASE someone needs to
> >> >>set a
> >> >> > > width and/or truncate.  Just-in-case code is not PAYG.
> >> >> > >
> >> >> > > My 2 cents,
> >> >> > > -Alex
> >> >> > >
> >> >> > > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
> >> >> > carlos.rovira@gmail.com> on behalf of Carlos Rovira"
> >> >> > > <carlos.rovira@gmail.com <ma...@gmail.com> on
> >>behalf
> >> >>of
> >> >> > carlosrovira@apache.org <ma...@apache.org>> wrote:
> >> >> > >
> >> >> > >> And why not change IBeadView in Label for a view that uses a div
> >> >>when
> >> >> > >> needed? ;)
> >> >> > >> in the other cases, maintains the span
> >> >> > >>
> >> >> > >> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
> >> >> > >>
> >> >> > >>> I’m still not understanding you. What about Label says it’s a
> >>span
> >> >> > >>> instead
> >> >> > >>> of a div? Why is making it a div not PAYG? Span simply limits
> >> >>Label
> >> >> > >>> unnecessarily. I think span is not the appropriate element for
> >> >>Label.
> >> >> > >>>
> >> >> > >>>> A Label without width should grow to the size of its text.
> >>Isn't
> >> >> that
> >> >> > >>> how
> >> >> > >>>> it worked in Flex?
> >> >> > >>>
> >> >> > >>> Sure, and a div does that too. In Flex, a label could have a
> >>width
> >> >> too
> >> >> > >>> if
> >> >> > >>> specified. Spans cannot.
> >> >> > >>>
> >> >> > >>> Harbs
> >> >> > >>>
> >> >> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui
> >> >><ah...@adobe.com.INVALID>
> >> >> > >>> wrote:
> >> >> > >>>>
> >> >> > >>>> Have the truncation bead swap the span for div.  Again, some
> >> >> component
> >> >> > >>> has
> >> >> > >>>> to put a span in the DOM.  Label has been just fine for that
> >>so
> >> >>far.
> >> >> > >>>>
> >> >> > >>>> A Label without width should grow to the size of its text.
> >>Isn't
> >> >> that
> >> >> > >>> how
> >> >> > >>>> it worked in Flex?
> >> >> > >>>>
> >> >> > >>>> Maybe Label should be refactored to not have width/height
> >> >>properties
> >> >> > >>> but
> >> >> > >>>> IMO we have bigger fish to fry.
> >> >> > >>>>
> >> >> > >>>> I'm sure Div is used to wrap text in some frameworks, but
> >>those
> >> >> > >>> frameworks
> >> >> > >>>> probably aren't PAYG.  In Alina's app, Label has a usage
> >>score of
> >> >> 69,
> >> >> > >>> but
> >> >> > >>>> Label.width has a score of only 5.  We will have her use
> >> >> > >>>> LabelWithTruncation or add the truncation bead on the few
> >>labels
> >> >> that
> >> >> > >>> need
> >> >> > >>>>
> >> >> > >>>> My 2 cents,
> >> >> > >>>> -Alex
> >> >> > >>>>
> >> >> > >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:
> >> >> > >>>>
> >> >> > >>>>> But we already have a truncation bead. The only reason it
> >> >>doesn’t
> >> >> > >>> work
> >> >> > >>> in
> >> >> > >>>>> Label is because spans don’t have widths.
> >> >> > >>>>>
> >> >> > >>>>> Label is not something which should flow beyond its bounds —
> >> >>which
> >> >> is
> >> >> > >>>>> what span is useful for. I still don’t see why you think span
> >> >>makes
> >> >> > >>> more
> >> >> > >>>>> sense.
> >> >> > >>>>>
> >> >> > >>>>> FWIW, div *is* used as a container for text in various
> >> >>frameworks.
> >> >> > >>>>>
> >> >> > >>>>> My $0.02,
> >> >> > >>>>> Harbs
> >> >> > >>>>>
> >> >> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui
> >> >><aharui@adobe.com.INVALID
> >> >> >
> >> >> > >>>>>> wrote:
> >> >> > >>>>>>
> >> >> > >>>>>> AIUI, "inline" is the default display style for Span.
> >>"block"
> >> >>is
> >> >> > >>> the
> >> >> > >>>>>> default for Div.  HTML flows inline by default for just
> >>plain
> >> >> text.
> >> >> > >>>>>> Basic
> >> >> > >>>>>> components try to give Flex-friendly names for HTMLElements.
> >> >>Some
> >> >> > >>>>>> component in Basic needs to inject a span into the DOM.  In
> >>a
> >> >>few
> >> >> > >>>>>> seconds
> >> >> > >>>>>> of looking at a Google web page, I did not see any divs with
> >> >>text
> >> >> as
> >> >> > >>>>>> children.  I saw spans.  The Divs all contained other
> >>elements.
> >> >> > >>>>>>
> >> >> > >>>>>> I don't create HTML web pages for a living, but if I were to
> >> >> place a
> >> >> > >>>>>> label
> >> >> > >>>>>> over a control like I often see in Flex, I would not wrap
> >>the
> >> >> label
> >> >> > >>> in
> >> >> > >>> a
> >> >> > >>>>>> Div.  The control would be div, so I would us a span or just
> >> >>plain
> >> >> > >>> text.
> >> >> > >>>>>> If I looked at the final DOM and saw Divs around every
> >>chunk of
> >> >> > >>> text, I
> >> >> > >>>>>> would think there is something heavy about the framework.
> >> >> > >>>>>>
> >> >> > >>>>>> Again, the goal is to encapsulate common patterns.  Label
> >> >>combined
> >> >> > >>> with
> >> >> > >>>>>> some control is trying to replicate common patterns for
> >> >>labeling
> >> >> > >>>>>> controls.
> >> >> > >>>>>> You are trying to solve the common pattern of truncating
> >>text.
> >> >> That
> >> >> > >>>>>> will
> >> >> > >>>>>> require a Div. But truncation, or even width/height is not
> >> >> something
> >> >> > >>>>>> that
> >> >> > >>>>>> should be built into Label for PAYG reasons.  IMO, you
> >>should
> >> >> > >>> create a
> >> >> > >>>>>> different component with a different name.
> >>TruncatingLabel, or
> >> >> > >>>>>> LabelWIthTruncation.
> >> >> > >>>>>>
> >> >> > >>>>>> My 2 cents,
> >> >> > >>>>>> -Alex
> >> >> > >>>>>>
> >> >> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com>
> wrote:
> >> >> > >>>>>>
> >> >> > >>>>>>> Why is span lighter than div?
> >> >> > >>>>>>>
> >> >> > >>>>>>> Inline and nowrap is not specific to span. AFAICT, there’s
> >> >> nothing
> >> >> > >>>>>>> specific to snap which fits Label better than div.
> >> >> > >>>>>>>
> >> >> > >>>>>>> As far as components which “does” span: Besides Span in
> >>HTML,
> >> >>we
> >> >> > >>> have
> >> >> > >>>>>>> HTMLText in Basic which encapsulates span.
> >> >> > >>>>>>>
> >> >> > >>>>>>> I can revert the change I made to Label, but I have not
> >>seen
> >> >>any
> >> >> > >>>>>>> downside
> >> >> > >>>>>>> to using div for Label. It seems to me that there’s
> >>nothing in
> >> >> the
> >> >> > >>>>>>> Label
> >> >> > >>>>>>> promise which dictates using span.
> >> >> > >>>>>>>
> >> >> > >>>>>>> Harbs
> >> >> > >>>>>>>
> >> >> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui
> >> >> <aharui@adobe.com.INVALID
> >> >> > >
> >> >> > >>>>>>>> wrote:
> >> >> > >>>>>>>>
> >> >> > >>>>>>>>
> >> >> > >>>>>>>>
> >> >> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com>
> >>wrote:
> >> >> > >>>>>>>>
> >> >> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element component set
> >> >>which
> >> >> > >>> more
> >> >> > >>>>>>>>> thinly wraps HTML elements.
> >> >> > >>>>>>>>>
> >> >> > >>>>>>>>> I can’t think of any reason why Label would be better as
> >>a
> >> >>span
> >> >> > >>> than
> >> >> > >>>>>>>>> a
> >> >> > >>>>>>>>> div. It seems to me that simply using div instead of span
> >> >>would
> >> >> > >>> make
> >> >> > >>>>>>>>> Label more versatile. Am I missing something?
> >> >> > >>>>>>>>
> >> >> > >>>>>>>> You may be missing that the only real goal of Royale is to
> >> >> > >>> encapsulate
> >> >> > >>>>>>>> popular patterns.  Pretty sure I've seen span used on many
> >> >>web
> >> >> > >>> pages,
> >> >> > >>>>>>>> so
> >> >> > >>>>>>>> we need a component that does what it does, including
> >> >>assuming
> >> >> > >>> inline
> >> >> > >>>>>>>> instead of block display.  Similarly, what would you think
> >> >>of a
> >> >> > >>>>>>>> framework
> >> >> > >>>>>>>> that had a HelloWorld that used a div instead of a span?
> >>You
> >> >> > >>> might
> >> >> > >>>>>>>> think
> >> >> > >>>>>>>> it is too heavy.
> >> >> > >>>>>>>>
> >> >> > >>>>>>>> Per PAYG, if span doesn’t' support certain features, then
> >>you
> >> >> > >>> create
> >> >> > >>> a
> >> >> > >>>>>>>> LabelWithTruncation and have it use a Div if you need to.
> >> >> > >>>>>>>>
> >> >> > >>>>>>>> My 2 cents,
> >> >> > >>>>>>>> -Alex
> >> >> > >>>>>>>>>
> >> >> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent
> >> >><pent@adobe.com.INVALID
> >> >> >
> >> >> > >>>>>>>>>> wrote:
> >> >> > >>>>>>>>>>
> >> >> > >>>>>>>>>> Label was one of the very first components and the idea
> >>was
> >> >> > >>>>>>>>>> minimalism.
> >> >> > >>>>>>>>>> Button was <button> and TextInput was <input
> >>type="text">
> >> >>and
> >> >> > >>> Label
> >> >> > >>>>>>>>>> was
> >> >> > >>>>>>>>>> <span>.
> >> >> > >>>>>>>>>>
> >> >> > >>>>>>>>>> I'm wondering if we should have NativeButton,
> >>NativeLabel,
> >> >> etc.
> >> >> > >>>>>>>>>> which
> >> >> > >>>>>>>>>> would be these minimal elements and have others that are
> >> >><div>
> >> >> > >>>>>>>>>> wrapping.
> >> >> > >>>>>>>>>> For instance, ImageAndTextButton is a <button><img
> >> >> > >>>>>>>>>> src="goo.jpg">Label
> >> >> > >>>>>>>>>> Here</button> which works but the alignment is weird so
> >> >>maybe
> >> >> > >>>>>>>>>> ImageAndTextButton should be a <div><img>Text</div>
> >>which
> >> >>can
> >> >> be
> >> >> > >>>>>>>>>> aligned
> >> >> > >>>>>>>>>> and styled better.
> >> >> > >>>>>>>>>>
> >> >> > >>>>>>>>>> Anyway, that's the reason: simplicity.
> >> >> > >>>>>>>>>>
> >> >> > >>>>>>>>>> ‹peter
> >> >> > >>>>>>>>>>
> >> >> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com>
> >> wrote:
> >> >> > >>>>>>>>>>
> >> >> > >>>>>>>>>>> Is there a reason that the element type of Basic Label
> >>is
> >> >> span?
> >> >> > >>>>>>>>>>>
> >> >> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it
> >> >>does
> >> >> not
> >> >> > >>>>>>>>>>> seem
> >> >> > >>>>>>>>>>> to
> >> >> > >>>>>>>>>>> work because spans donąt really have a working width.
> >> >> Switching
> >> >> > >>> the
> >> >> > >>>>>>>>>>> element type to div seems to make it work.
> >> >> > >>>>>>>>>>>
> >> >> > >>>>>>>>>>> Harbs
> >> >> > >>>>>>>>>>
> >> >> > >>>>>>>>>
> >> >> > >>>>>>>>
> >> >> > >>>>>>>
> >> >> > >>>>>>
> >> >> > >>>>>
> >> >> > >>>>
> >> >> > >>>
> >> >> > >>>
> >> >> > >>
> >> >> > >>
> >> >> > >> --
> >> >> > >> Carlos Rovira
> >> >> > >> https://na01.safelinks.protection.outlook.com/?url=
> >> >> > http%3A%2F%2Fabout.me%2
> >> >><https://na01.safelinks.protection.outlook.com/?url=
> >> https%3A%2F%2Fna01.sa
> >>
> >>>>felinks&data=02%7C01%7Caharui%40adobe.com%
> 7C3664f690b3da4e4aefab08d58ac
> >>>>c
> >> 7
> >> >>bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> >> 7C636567533215453966&sdata
> >> >>=exoH%2BPKzuyM%2BykE65GQeHk%2BjPAZSsUFjsKwx3BRvjsk%3D&reserved=0.
> >> >> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
> >> >> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com
> >>
> >>>><https://na01.safelinks.protection.outlook.com/?url=
> http%3A%2F%2F40adob
> >>>>e
> >> .
> >>
> >>>>com%2F&data=02%7C01%7Caharui%40adobe.com%
> 7C3664f690b3da4e4aefab08d58acc
> >> 7b
> >> >>f0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> >> 7C636567533215453966&sdata=
> >> >>ewhtNMkSjHssIseUSvxq9etF%2FtrcA%2Buqk3sZlJkjHuc%3D&reserved=0
> >> >> >%
> >> >> > 7Cae539925833d453aaa2e08d5
> >> >> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> >> >> > 7C636567454874235113&s
> >> >> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY
> 1WVtz2xsNvc%3D&reserved=0
> >> >> >
> >> >> >
> >> >>
> >>
> >>
>
>

Re: Label

Posted by Alex Harui <ah...@adobe.com.INVALID>.
Because, this isn't an issue of performance.  We give our users choices
and a toolkit to replicate ANY HTML tree they want to.  We are proposing
to replace what is to me the most obvious Flex-like component name for
injecting a span into the DOM.  Label is a single-line sequence of text.
So is Span.

I'm not seeing a huge performance difference.  If you think it is
significant enough that our users should be alerted to use SizeableLabel
or whatever we call the Div-wrapping-text version, start blogging it after
you validate your test case.  I noticed that the number of Spans the test
appears to report are higher than the number of Divs, but that might be a
false alarm.  You can be a hero in the web world if you are right and
change the advice I see elsewhere on the net to use Span for inline
elements and Div for other things.  Even the JSPerf page is using spans.
Tell them to replace them.

Meanwhile, I'm going back to try to migrate an app.  Sure wish we had more
people helping on that.

-Alex


We can certainly give them advice that SizedLabel is faster than Label if
that's important, but the different didn't seem that significant.

On 3/15/18, 6:14 PM, "omuppi1@gmail.com on behalf of OmPrakash Muppirala"
<omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:

>If creating a div is more performant than creating a span, why insist on
>using a span?  How is that pay as you go?
>
>Thanks,
>Om
>
>On Thu, Mar 15, 2018 at 5:19 PM, Alex Harui <ah...@adobe.com.invalid>
>wrote:
>
>> A Flex Label, and any Flex component was a swiss-army knife of features
>> and not PAYG.  I have not given up on PAYG.  I think it will pay off
>>when
>> we get to the last mile.  If we don't stick to PAYG, I think we will
>>just
>> repeat the history of Flex and produce a fat framework that can't run
>> everywhere.  Yes, a Div would probably better mimic a Flex Label, but
>>the
>> Basic label is not a swiss-army knife.
>>
>> This article is old, but I think it says you can't put a Div in a Span:
>> 
>>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fdoctype.c
>>om%2Fspan-contain-div-html5&data=02%7C01%7Caharui%40adobe.com%7C77b57b271
>>ef7423114c208d58ae0d810%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C6365
>>67620658308491&sdata=o9msOjZpbwywflSfgJDebUdMM3hgNPdN%2Btn%2BrcSZsV4%3D&r
>>eserved=0
>>
>> I think you can if you change the span's display to "block" but I think
>> that is essentially replacing the element.
>>
>> Everything, including width and truncation should be opt-in, PAYG.
>>Make a
>> LabelWithWidth or SizeableLabel component that is a div if you want.
>>
>> Again, the goal is to encapsulate common patterns.  I am not seeing a
>>lot
>> of Divs wrapping text nodes.  I see lots of spans wrapping text nodes.
>> Basic Label is that pattern.  The Basic component set would be
>>incomplete
>> if there wasn't a component that could inject a Span into the DOM.
>>Create
>> another component that is a Div wrapping a text node, give it a
>>different
>> name, and let's move on.
>>
>> Alina used Label quite often without setting width.  No need for those
>> instances to be a Div, AFAICT.
>>
>> Do we even need to discuss span vs div if the truncation bead will work
>>by
>> setting display:block?
>>
>> We have a huge opportunity here to get another app migrated and prove to
>> the world that Royale is the right choice.  But we keep discussing stuff
>> that IMO, isn't really moving the big pieces forward.  But, IMO, we
>>should
>> not compromise on PAYG philosophy and patterns.
>>
>> My 2 cents,
>> -Alex
>>
>> On 3/15/18, 4:27 PM, "omuppi1@gmail.com on behalf of OmPrakash
>>Muppirala"
>> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
>>
>> >FWIW, it seems like creating divs is faster than creating spans.
>> >https://na01.safelinks.protection.outlook.com/?url=
>> https%3A%2F%2Fjsperf.co
>> >m%2Fspan-vs-div-creation&data=02%7C01%7Caharui%40adobe.com
>> %7C3664f690b3da4
>> >e4aefab08d58acc7bf0%7Cfa7b1b5a7b34438794aed2c178de
>> cee1%7C0%7C0%7C636567533
>> >215453966&sdata=oPPp2e9aRbQ%2FngKbcFMHMCmXi%2BKa%2B%
>> 2F0aA98XFFqxhFA%3D&res
>> >erved=0
>> >
>> >Thanks,
>> >Om
>> >
>> >On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <gr...@gmail.com> wrote:
>> >
>> >> Observing from the sidelines, fwiw I agree with Harbs here. Span to
>>me
>> >> makes more sense as part of the text value of a label and not as the
>> >>basis
>> >> for the representation of the Label itself - div seems closer to
>>what I
>> >>was
>> >> used to with legacy Flex (which may no longer be the 'reference' for
>> >> choosing an implementation).
>> >> I don't think there is any semantic or other reason that makes span
>>the
>> >> logical default tag for Label, in fact I recall that being a problem
>> >>many
>> >> times with some work I was involved with last year using FlexJS.
>> >> But maybe I am missing something in terms of understanding.
>> >>
>> >>
>> >>
>> >>
>> >> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <ha...@gmail.com>
>>wrote:
>> >>
>> >> > I’m suggesting to change it because span does not fit the use case
>>of
>> >> > Label. Width and truncate are just two applications which indicate
>> >>that
>> >> > span is not the correct element. I’m pretty sure I had other edge
>> >>cases
>> >> > which were likely effected by the fact that Label is a span,
>>although
>> >>I’m
>> >> > not positive.
>> >> >
>> >> > I disagree with your distinction between span and div.
>> >> >
>> >> > Both span and div can have children. Spans can contain divs and
>>divs
>> >>can
>> >> > contain spans. At its core, Span has nothing to do with text. It’s
>> >>just
>> >> > often used for text because text (within its container) is inline.
>> >> >
>> >> > MDN says[1] "<span> is very much like a <div> element, but <div>
>>is a
>> >> > block-level element whereas a <span> is an inline element.”
>> >> >
>> >> > Label is *not* necessarily an inline element. We have all kinds of
>> >> layouts
>> >> > for Label. Many (most?) of them are not inline.
>> >> >
>> >> > If you feel really strongly about this, I’ll revert even though I
>> >> disagree.
>> >> >
>> >> > FWIW, the truncate bead does not need to change the element type.
>>It
>> >>can
>> >> > explicitly set the display of the element to block.
>> >> >
>> >> > Harbs
>> >> >
>> >> >
>> >>[1]https://na01.safelinks.protection.outlook.com/?url=
>> https%3A%2F%2Fdevel
>> >>oper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
>> 2Fspan&data=02%7C0
>> >>1%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
>> 7bf0%7Cfa7b1b5a7b344
>> >>38794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
>> xrtF9H7%2BjFzqGDax
>> >>nj0%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0 <
>> >> >
>> >>https://na01.safelinks.protection.outlook.com/?url=
>> https%3A%2F%2Fdevelope
>> >>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
>> 2Fspan&data=02%7C01%7
>> >>Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
>> 7bf0%7Cfa7b1b5a7b344387
>> >>94aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
>> xrtF9H7%2BjFzqGDaxnj0
>> >>%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0>
>> >> >
>> >> > > On Mar 15, 2018, at 11:25 PM, Alex Harui
>><ah...@adobe.com.INVALID>
>> >> > wrote:
>> >> > >
>> >> > > Label in Flex and Royale is not intended to have any children
>>(other
>> >> than
>> >> > > bold, italic and other text markup).  Span represents that.  Div
>> >>does
>> >> > not.
>> >> > > You are suggesting changing to div JUST IN CASE someone needs to
>> >>set a
>> >> > > width and/or truncate.  Just-in-case code is not PAYG.
>> >> > >
>> >> > > My 2 cents,
>> >> > > -Alex
>> >> > >
>> >> > > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
>> >> > carlos.rovira@gmail.com> on behalf of Carlos Rovira"
>> >> > > <carlos.rovira@gmail.com <ma...@gmail.com> on
>>behalf
>> >>of
>> >> > carlosrovira@apache.org <ma...@apache.org>> wrote:
>> >> > >
>> >> > >> And why not change IBeadView in Label for a view that uses a div
>> >>when
>> >> > >> needed? ;)
>> >> > >> in the other cases, maintains the span
>> >> > >>
>> >> > >> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
>> >> > >>
>> >> > >>> I’m still not understanding you. What about Label says it’s a
>>span
>> >> > >>> instead
>> >> > >>> of a div? Why is making it a div not PAYG? Span simply limits
>> >>Label
>> >> > >>> unnecessarily. I think span is not the appropriate element for
>> >>Label.
>> >> > >>>
>> >> > >>>> A Label without width should grow to the size of its text.
>>Isn't
>> >> that
>> >> > >>> how
>> >> > >>>> it worked in Flex?
>> >> > >>>
>> >> > >>> Sure, and a div does that too. In Flex, a label could have a
>>width
>> >> too
>> >> > >>> if
>> >> > >>> specified. Spans cannot.
>> >> > >>>
>> >> > >>> Harbs
>> >> > >>>
>> >> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui
>> >><ah...@adobe.com.INVALID>
>> >> > >>> wrote:
>> >> > >>>>
>> >> > >>>> Have the truncation bead swap the span for div.  Again, some
>> >> component
>> >> > >>> has
>> >> > >>>> to put a span in the DOM.  Label has been just fine for that
>>so
>> >>far.
>> >> > >>>>
>> >> > >>>> A Label without width should grow to the size of its text.
>>Isn't
>> >> that
>> >> > >>> how
>> >> > >>>> it worked in Flex?
>> >> > >>>>
>> >> > >>>> Maybe Label should be refactored to not have width/height
>> >>properties
>> >> > >>> but
>> >> > >>>> IMO we have bigger fish to fry.
>> >> > >>>>
>> >> > >>>> I'm sure Div is used to wrap text in some frameworks, but
>>those
>> >> > >>> frameworks
>> >> > >>>> probably aren't PAYG.  In Alina's app, Label has a usage
>>score of
>> >> 69,
>> >> > >>> but
>> >> > >>>> Label.width has a score of only 5.  We will have her use
>> >> > >>>> LabelWithTruncation or add the truncation bead on the few
>>labels
>> >> that
>> >> > >>> need
>> >> > >>>>
>> >> > >>>> My 2 cents,
>> >> > >>>> -Alex
>> >> > >>>>
>> >> > >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:
>> >> > >>>>
>> >> > >>>>> But we already have a truncation bead. The only reason it
>> >>doesn’t
>> >> > >>> work
>> >> > >>> in
>> >> > >>>>> Label is because spans don’t have widths.
>> >> > >>>>>
>> >> > >>>>> Label is not something which should flow beyond its bounds —
>> >>which
>> >> is
>> >> > >>>>> what span is useful for. I still don’t see why you think span
>> >>makes
>> >> > >>> more
>> >> > >>>>> sense.
>> >> > >>>>>
>> >> > >>>>> FWIW, div *is* used as a container for text in various
>> >>frameworks.
>> >> > >>>>>
>> >> > >>>>> My $0.02,
>> >> > >>>>> Harbs
>> >> > >>>>>
>> >> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui
>> >><aharui@adobe.com.INVALID
>> >> >
>> >> > >>>>>> wrote:
>> >> > >>>>>>
>> >> > >>>>>> AIUI, "inline" is the default display style for Span.
>>"block"
>> >>is
>> >> > >>> the
>> >> > >>>>>> default for Div.  HTML flows inline by default for just
>>plain
>> >> text.
>> >> > >>>>>> Basic
>> >> > >>>>>> components try to give Flex-friendly names for HTMLElements.
>> >>Some
>> >> > >>>>>> component in Basic needs to inject a span into the DOM.  In
>>a
>> >>few
>> >> > >>>>>> seconds
>> >> > >>>>>> of looking at a Google web page, I did not see any divs with
>> >>text
>> >> as
>> >> > >>>>>> children.  I saw spans.  The Divs all contained other
>>elements.
>> >> > >>>>>>
>> >> > >>>>>> I don't create HTML web pages for a living, but if I were to
>> >> place a
>> >> > >>>>>> label
>> >> > >>>>>> over a control like I often see in Flex, I would not wrap
>>the
>> >> label
>> >> > >>> in
>> >> > >>> a
>> >> > >>>>>> Div.  The control would be div, so I would us a span or just
>> >>plain
>> >> > >>> text.
>> >> > >>>>>> If I looked at the final DOM and saw Divs around every
>>chunk of
>> >> > >>> text, I
>> >> > >>>>>> would think there is something heavy about the framework.
>> >> > >>>>>>
>> >> > >>>>>> Again, the goal is to encapsulate common patterns.  Label
>> >>combined
>> >> > >>> with
>> >> > >>>>>> some control is trying to replicate common patterns for
>> >>labeling
>> >> > >>>>>> controls.
>> >> > >>>>>> You are trying to solve the common pattern of truncating
>>text.
>> >> That
>> >> > >>>>>> will
>> >> > >>>>>> require a Div. But truncation, or even width/height is not
>> >> something
>> >> > >>>>>> that
>> >> > >>>>>> should be built into Label for PAYG reasons.  IMO, you
>>should
>> >> > >>> create a
>> >> > >>>>>> different component with a different name.
>>TruncatingLabel, or
>> >> > >>>>>> LabelWIthTruncation.
>> >> > >>>>>>
>> >> > >>>>>> My 2 cents,
>> >> > >>>>>> -Alex
>> >> > >>>>>>
>> >> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
>> >> > >>>>>>
>> >> > >>>>>>> Why is span lighter than div?
>> >> > >>>>>>>
>> >> > >>>>>>> Inline and nowrap is not specific to span. AFAICT, there’s
>> >> nothing
>> >> > >>>>>>> specific to snap which fits Label better than div.
>> >> > >>>>>>>
>> >> > >>>>>>> As far as components which “does” span: Besides Span in
>>HTML,
>> >>we
>> >> > >>> have
>> >> > >>>>>>> HTMLText in Basic which encapsulates span.
>> >> > >>>>>>>
>> >> > >>>>>>> I can revert the change I made to Label, but I have not
>>seen
>> >>any
>> >> > >>>>>>> downside
>> >> > >>>>>>> to using div for Label. It seems to me that there’s
>>nothing in
>> >> the
>> >> > >>>>>>> Label
>> >> > >>>>>>> promise which dictates using span.
>> >> > >>>>>>>
>> >> > >>>>>>> Harbs
>> >> > >>>>>>>
>> >> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui
>> >> <aharui@adobe.com.INVALID
>> >> > >
>> >> > >>>>>>>> wrote:
>> >> > >>>>>>>>
>> >> > >>>>>>>>
>> >> > >>>>>>>>
>> >> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com>
>>wrote:
>> >> > >>>>>>>>
>> >> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element component set
>> >>which
>> >> > >>> more
>> >> > >>>>>>>>> thinly wraps HTML elements.
>> >> > >>>>>>>>>
>> >> > >>>>>>>>> I can’t think of any reason why Label would be better as
>>a
>> >>span
>> >> > >>> than
>> >> > >>>>>>>>> a
>> >> > >>>>>>>>> div. It seems to me that simply using div instead of span
>> >>would
>> >> > >>> make
>> >> > >>>>>>>>> Label more versatile. Am I missing something?
>> >> > >>>>>>>>
>> >> > >>>>>>>> You may be missing that the only real goal of Royale is to
>> >> > >>> encapsulate
>> >> > >>>>>>>> popular patterns.  Pretty sure I've seen span used on many
>> >>web
>> >> > >>> pages,
>> >> > >>>>>>>> so
>> >> > >>>>>>>> we need a component that does what it does, including
>> >>assuming
>> >> > >>> inline
>> >> > >>>>>>>> instead of block display.  Similarly, what would you think
>> >>of a
>> >> > >>>>>>>> framework
>> >> > >>>>>>>> that had a HelloWorld that used a div instead of a span?
>>You
>> >> > >>> might
>> >> > >>>>>>>> think
>> >> > >>>>>>>> it is too heavy.
>> >> > >>>>>>>>
>> >> > >>>>>>>> Per PAYG, if span doesn’t' support certain features, then
>>you
>> >> > >>> create
>> >> > >>> a
>> >> > >>>>>>>> LabelWithTruncation and have it use a Div if you need to.
>> >> > >>>>>>>>
>> >> > >>>>>>>> My 2 cents,
>> >> > >>>>>>>> -Alex
>> >> > >>>>>>>>>
>> >> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent
>> >><pent@adobe.com.INVALID
>> >> >
>> >> > >>>>>>>>>> wrote:
>> >> > >>>>>>>>>>
>> >> > >>>>>>>>>> Label was one of the very first components and the idea
>>was
>> >> > >>>>>>>>>> minimalism.
>> >> > >>>>>>>>>> Button was <button> and TextInput was <input
>>type="text">
>> >>and
>> >> > >>> Label
>> >> > >>>>>>>>>> was
>> >> > >>>>>>>>>> <span>.
>> >> > >>>>>>>>>>
>> >> > >>>>>>>>>> I'm wondering if we should have NativeButton,
>>NativeLabel,
>> >> etc.
>> >> > >>>>>>>>>> which
>> >> > >>>>>>>>>> would be these minimal elements and have others that are
>> >><div>
>> >> > >>>>>>>>>> wrapping.
>> >> > >>>>>>>>>> For instance, ImageAndTextButton is a <button><img
>> >> > >>>>>>>>>> src="goo.jpg">Label
>> >> > >>>>>>>>>> Here</button> which works but the alignment is weird so
>> >>maybe
>> >> > >>>>>>>>>> ImageAndTextButton should be a <div><img>Text</div>
>>which
>> >>can
>> >> be
>> >> > >>>>>>>>>> aligned
>> >> > >>>>>>>>>> and styled better.
>> >> > >>>>>>>>>>
>> >> > >>>>>>>>>> Anyway, that's the reason: simplicity.
>> >> > >>>>>>>>>>
>> >> > >>>>>>>>>> ‹peter
>> >> > >>>>>>>>>>
>> >> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com>
>> wrote:
>> >> > >>>>>>>>>>
>> >> > >>>>>>>>>>> Is there a reason that the element type of Basic Label
>>is
>> >> span?
>> >> > >>>>>>>>>>>
>> >> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it
>> >>does
>> >> not
>> >> > >>>>>>>>>>> seem
>> >> > >>>>>>>>>>> to
>> >> > >>>>>>>>>>> work because spans donąt really have a working width.
>> >> Switching
>> >> > >>> the
>> >> > >>>>>>>>>>> element type to div seems to make it work.
>> >> > >>>>>>>>>>>
>> >> > >>>>>>>>>>> Harbs
>> >> > >>>>>>>>>>
>> >> > >>>>>>>>>
>> >> > >>>>>>>>
>> >> > >>>>>>>
>> >> > >>>>>>
>> >> > >>>>>
>> >> > >>>>
>> >> > >>>
>> >> > >>>
>> >> > >>
>> >> > >>
>> >> > >> --
>> >> > >> Carlos Rovira
>> >> > >> https://na01.safelinks.protection.outlook.com/?url=
>> >> > http%3A%2F%2Fabout.me%2
>> >><https://na01.safelinks.protection.outlook.com/?url=
>> https%3A%2F%2Fna01.sa
>> 
>>>>felinks&data=02%7C01%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58ac
>>>>c
>> 7
>> >>bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>> 7C636567533215453966&sdata
>> >>=exoH%2BPKzuyM%2BykE65GQeHk%2BjPAZSsUFjsKwx3BRvjsk%3D&reserved=0.
>> >> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
>> >> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com
>> 
>>>><https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2F40adob
>>>>e
>> .
>> 
>>>>com%2F&data=02%7C01%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
>> 7b
>> >>f0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>> 7C636567533215453966&sdata=
>> >>ewhtNMkSjHssIseUSvxq9etF%2FtrcA%2Buqk3sZlJkjHuc%3D&reserved=0
>> >> >%
>> >> > 7Cae539925833d453aaa2e08d5
>> >> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>> >> > 7C636567454874235113&s
>> >> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY1WVtz2xsNvc%3D&reserved=0
>> >> >
>> >> >
>> >>
>>
>>


Re: Label

Posted by OmPrakash Muppirala <bi...@gmail.com>.
If creating a div is more performant than creating a span, why insist on
using a span?  How is that pay as you go?

Thanks,
Om

On Thu, Mar 15, 2018 at 5:19 PM, Alex Harui <ah...@adobe.com.invalid>
wrote:

> A Flex Label, and any Flex component was a swiss-army knife of features
> and not PAYG.  I have not given up on PAYG.  I think it will pay off when
> we get to the last mile.  If we don't stick to PAYG, I think we will just
> repeat the history of Flex and produce a fat framework that can't run
> everywhere.  Yes, a Div would probably better mimic a Flex Label, but the
> Basic label is not a swiss-army knife.
>
> This article is old, but I think it says you can't put a Div in a Span:
> http://doctype.com/span-contain-div-html5
>
> I think you can if you change the span's display to "block" but I think
> that is essentially replacing the element.
>
> Everything, including width and truncation should be opt-in, PAYG.  Make a
> LabelWithWidth or SizeableLabel component that is a div if you want.
>
> Again, the goal is to encapsulate common patterns.  I am not seeing a lot
> of Divs wrapping text nodes.  I see lots of spans wrapping text nodes.
> Basic Label is that pattern.  The Basic component set would be incomplete
> if there wasn't a component that could inject a Span into the DOM.  Create
> another component that is a Div wrapping a text node, give it a different
> name, and let's move on.
>
> Alina used Label quite often without setting width.  No need for those
> instances to be a Div, AFAICT.
>
> Do we even need to discuss span vs div if the truncation bead will work by
> setting display:block?
>
> We have a huge opportunity here to get another app migrated and prove to
> the world that Royale is the right choice.  But we keep discussing stuff
> that IMO, isn't really moving the big pieces forward.  But, IMO, we should
> not compromise on PAYG philosophy and patterns.
>
> My 2 cents,
> -Alex
>
> On 3/15/18, 4:27 PM, "omuppi1@gmail.com on behalf of OmPrakash Muppirala"
> <omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:
>
> >FWIW, it seems like creating divs is faster than creating spans.
> >https://na01.safelinks.protection.outlook.com/?url=
> https%3A%2F%2Fjsperf.co
> >m%2Fspan-vs-div-creation&data=02%7C01%7Caharui%40adobe.com
> %7C3664f690b3da4
> >e4aefab08d58acc7bf0%7Cfa7b1b5a7b34438794aed2c178de
> cee1%7C0%7C0%7C636567533
> >215453966&sdata=oPPp2e9aRbQ%2FngKbcFMHMCmXi%2BKa%2B%
> 2F0aA98XFFqxhFA%3D&res
> >erved=0
> >
> >Thanks,
> >Om
> >
> >On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <gr...@gmail.com> wrote:
> >
> >> Observing from the sidelines, fwiw I agree with Harbs here. Span to me
> >> makes more sense as part of the text value of a label and not as the
> >>basis
> >> for the representation of the Label itself - div seems closer to what I
> >>was
> >> used to with legacy Flex (which may no longer be the 'reference' for
> >> choosing an implementation).
> >> I don't think there is any semantic or other reason that makes span the
> >> logical default tag for Label, in fact I recall that being a problem
> >>many
> >> times with some work I was involved with last year using FlexJS.
> >> But maybe I am missing something in terms of understanding.
> >>
> >>
> >>
> >>
> >> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <ha...@gmail.com> wrote:
> >>
> >> > I’m suggesting to change it because span does not fit the use case of
> >> > Label. Width and truncate are just two applications which indicate
> >>that
> >> > span is not the correct element. I’m pretty sure I had other edge
> >>cases
> >> > which were likely effected by the fact that Label is a span, although
> >>I’m
> >> > not positive.
> >> >
> >> > I disagree with your distinction between span and div.
> >> >
> >> > Both span and div can have children. Spans can contain divs and divs
> >>can
> >> > contain spans. At its core, Span has nothing to do with text. It’s
> >>just
> >> > often used for text because text (within its container) is inline.
> >> >
> >> > MDN says[1] "<span> is very much like a <div> element, but <div> is a
> >> > block-level element whereas a <span> is an inline element.”
> >> >
> >> > Label is *not* necessarily an inline element. We have all kinds of
> >> layouts
> >> > for Label. Many (most?) of them are not inline.
> >> >
> >> > If you feel really strongly about this, I’ll revert even though I
> >> disagree.
> >> >
> >> > FWIW, the truncate bead does not need to change the element type. It
> >>can
> >> > explicitly set the display of the element to block.
> >> >
> >> > Harbs
> >> >
> >> >
> >>[1]https://na01.safelinks.protection.outlook.com/?url=
> https%3A%2F%2Fdevel
> >>oper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
> 2Fspan&data=02%7C0
> >>1%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> 7bf0%7Cfa7b1b5a7b344
> >>38794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
> xrtF9H7%2BjFzqGDax
> >>nj0%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0 <
> >> >
> >>https://na01.safelinks.protection.outlook.com/?url=
> https%3A%2F%2Fdevelope
> >>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%
> 2Fspan&data=02%7C01%7
> >>Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> 7bf0%7Cfa7b1b5a7b344387
> >>94aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
> xrtF9H7%2BjFzqGDaxnj0
> >>%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0>
> >> >
> >> > > On Mar 15, 2018, at 11:25 PM, Alex Harui <ah...@adobe.com.INVALID>
> >> > wrote:
> >> > >
> >> > > Label in Flex and Royale is not intended to have any children (other
> >> than
> >> > > bold, italic and other text markup).  Span represents that.  Div
> >>does
> >> > not.
> >> > > You are suggesting changing to div JUST IN CASE someone needs to
> >>set a
> >> > > width and/or truncate.  Just-in-case code is not PAYG.
> >> > >
> >> > > My 2 cents,
> >> > > -Alex
> >> > >
> >> > > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
> >> > carlos.rovira@gmail.com> on behalf of Carlos Rovira"
> >> > > <carlos.rovira@gmail.com <ma...@gmail.com> on behalf
> >>of
> >> > carlosrovira@apache.org <ma...@apache.org>> wrote:
> >> > >
> >> > >> And why not change IBeadView in Label for a view that uses a div
> >>when
> >> > >> needed? ;)
> >> > >> in the other cases, maintains the span
> >> > >>
> >> > >> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
> >> > >>
> >> > >>> I’m still not understanding you. What about Label says it’s a span
> >> > >>> instead
> >> > >>> of a div? Why is making it a div not PAYG? Span simply limits
> >>Label
> >> > >>> unnecessarily. I think span is not the appropriate element for
> >>Label.
> >> > >>>
> >> > >>>> A Label without width should grow to the size of its text.  Isn't
> >> that
> >> > >>> how
> >> > >>>> it worked in Flex?
> >> > >>>
> >> > >>> Sure, and a div does that too. In Flex, a label could have a width
> >> too
> >> > >>> if
> >> > >>> specified. Spans cannot.
> >> > >>>
> >> > >>> Harbs
> >> > >>>
> >> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui
> >><ah...@adobe.com.INVALID>
> >> > >>> wrote:
> >> > >>>>
> >> > >>>> Have the truncation bead swap the span for div.  Again, some
> >> component
> >> > >>> has
> >> > >>>> to put a span in the DOM.  Label has been just fine for that so
> >>far.
> >> > >>>>
> >> > >>>> A Label without width should grow to the size of its text.  Isn't
> >> that
> >> > >>> how
> >> > >>>> it worked in Flex?
> >> > >>>>
> >> > >>>> Maybe Label should be refactored to not have width/height
> >>properties
> >> > >>> but
> >> > >>>> IMO we have bigger fish to fry.
> >> > >>>>
> >> > >>>> I'm sure Div is used to wrap text in some frameworks, but those
> >> > >>> frameworks
> >> > >>>> probably aren't PAYG.  In Alina's app, Label has a usage score of
> >> 69,
> >> > >>> but
> >> > >>>> Label.width has a score of only 5.  We will have her use
> >> > >>>> LabelWithTruncation or add the truncation bead on the few labels
> >> that
> >> > >>> need
> >> > >>>>
> >> > >>>> My 2 cents,
> >> > >>>> -Alex
> >> > >>>>
> >> > >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:
> >> > >>>>
> >> > >>>>> But we already have a truncation bead. The only reason it
> >>doesn’t
> >> > >>> work
> >> > >>> in
> >> > >>>>> Label is because spans don’t have widths.
> >> > >>>>>
> >> > >>>>> Label is not something which should flow beyond its bounds —
> >>which
> >> is
> >> > >>>>> what span is useful for. I still don’t see why you think span
> >>makes
> >> > >>> more
> >> > >>>>> sense.
> >> > >>>>>
> >> > >>>>> FWIW, div *is* used as a container for text in various
> >>frameworks.
> >> > >>>>>
> >> > >>>>> My $0.02,
> >> > >>>>> Harbs
> >> > >>>>>
> >> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui
> >><aharui@adobe.com.INVALID
> >> >
> >> > >>>>>> wrote:
> >> > >>>>>>
> >> > >>>>>> AIUI, "inline" is the default display style for Span.  "block"
> >>is
> >> > >>> the
> >> > >>>>>> default for Div.  HTML flows inline by default for just plain
> >> text.
> >> > >>>>>> Basic
> >> > >>>>>> components try to give Flex-friendly names for HTMLElements.
> >>Some
> >> > >>>>>> component in Basic needs to inject a span into the DOM.  In a
> >>few
> >> > >>>>>> seconds
> >> > >>>>>> of looking at a Google web page, I did not see any divs with
> >>text
> >> as
> >> > >>>>>> children.  I saw spans.  The Divs all contained other elements.
> >> > >>>>>>
> >> > >>>>>> I don't create HTML web pages for a living, but if I were to
> >> place a
> >> > >>>>>> label
> >> > >>>>>> over a control like I often see in Flex, I would not wrap the
> >> label
> >> > >>> in
> >> > >>> a
> >> > >>>>>> Div.  The control would be div, so I would us a span or just
> >>plain
> >> > >>> text.
> >> > >>>>>> If I looked at the final DOM and saw Divs around every chunk of
> >> > >>> text, I
> >> > >>>>>> would think there is something heavy about the framework.
> >> > >>>>>>
> >> > >>>>>> Again, the goal is to encapsulate common patterns.  Label
> >>combined
> >> > >>> with
> >> > >>>>>> some control is trying to replicate common patterns for
> >>labeling
> >> > >>>>>> controls.
> >> > >>>>>> You are trying to solve the common pattern of truncating text.
> >> That
> >> > >>>>>> will
> >> > >>>>>> require a Div. But truncation, or even width/height is not
> >> something
> >> > >>>>>> that
> >> > >>>>>> should be built into Label for PAYG reasons.  IMO, you should
> >> > >>> create a
> >> > >>>>>> different component with a different name.  TruncatingLabel, or
> >> > >>>>>> LabelWIthTruncation.
> >> > >>>>>>
> >> > >>>>>> My 2 cents,
> >> > >>>>>> -Alex
> >> > >>>>>>
> >> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
> >> > >>>>>>
> >> > >>>>>>> Why is span lighter than div?
> >> > >>>>>>>
> >> > >>>>>>> Inline and nowrap is not specific to span. AFAICT, there’s
> >> nothing
> >> > >>>>>>> specific to snap which fits Label better than div.
> >> > >>>>>>>
> >> > >>>>>>> As far as components which “does” span: Besides Span in HTML,
> >>we
> >> > >>> have
> >> > >>>>>>> HTMLText in Basic which encapsulates span.
> >> > >>>>>>>
> >> > >>>>>>> I can revert the change I made to Label, but I have not seen
> >>any
> >> > >>>>>>> downside
> >> > >>>>>>> to using div for Label. It seems to me that there’s nothing in
> >> the
> >> > >>>>>>> Label
> >> > >>>>>>> promise which dictates using span.
> >> > >>>>>>>
> >> > >>>>>>> Harbs
> >> > >>>>>>>
> >> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui
> >> <aharui@adobe.com.INVALID
> >> > >
> >> > >>>>>>>> wrote:
> >> > >>>>>>>>
> >> > >>>>>>>>
> >> > >>>>>>>>
> >> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
> >> > >>>>>>>>
> >> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element component set
> >>which
> >> > >>> more
> >> > >>>>>>>>> thinly wraps HTML elements.
> >> > >>>>>>>>>
> >> > >>>>>>>>> I can’t think of any reason why Label would be better as a
> >>span
> >> > >>> than
> >> > >>>>>>>>> a
> >> > >>>>>>>>> div. It seems to me that simply using div instead of span
> >>would
> >> > >>> make
> >> > >>>>>>>>> Label more versatile. Am I missing something?
> >> > >>>>>>>>
> >> > >>>>>>>> You may be missing that the only real goal of Royale is to
> >> > >>> encapsulate
> >> > >>>>>>>> popular patterns.  Pretty sure I've seen span used on many
> >>web
> >> > >>> pages,
> >> > >>>>>>>> so
> >> > >>>>>>>> we need a component that does what it does, including
> >>assuming
> >> > >>> inline
> >> > >>>>>>>> instead of block display.  Similarly, what would you think
> >>of a
> >> > >>>>>>>> framework
> >> > >>>>>>>> that had a HelloWorld that used a div instead of a span?  You
> >> > >>> might
> >> > >>>>>>>> think
> >> > >>>>>>>> it is too heavy.
> >> > >>>>>>>>
> >> > >>>>>>>> Per PAYG, if span doesn’t' support certain features, then you
> >> > >>> create
> >> > >>> a
> >> > >>>>>>>> LabelWithTruncation and have it use a Div if you need to.
> >> > >>>>>>>>
> >> > >>>>>>>> My 2 cents,
> >> > >>>>>>>> -Alex
> >> > >>>>>>>>>
> >> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent
> >><pent@adobe.com.INVALID
> >> >
> >> > >>>>>>>>>> wrote:
> >> > >>>>>>>>>>
> >> > >>>>>>>>>> Label was one of the very first components and the idea was
> >> > >>>>>>>>>> minimalism.
> >> > >>>>>>>>>> Button was <button> and TextInput was <input type="text">
> >>and
> >> > >>> Label
> >> > >>>>>>>>>> was
> >> > >>>>>>>>>> <span>.
> >> > >>>>>>>>>>
> >> > >>>>>>>>>> I'm wondering if we should have NativeButton, NativeLabel,
> >> etc.
> >> > >>>>>>>>>> which
> >> > >>>>>>>>>> would be these minimal elements and have others that are
> >><div>
> >> > >>>>>>>>>> wrapping.
> >> > >>>>>>>>>> For instance, ImageAndTextButton is a <button><img
> >> > >>>>>>>>>> src="goo.jpg">Label
> >> > >>>>>>>>>> Here</button> which works but the alignment is weird so
> >>maybe
> >> > >>>>>>>>>> ImageAndTextButton should be a <div><img>Text</div> which
> >>can
> >> be
> >> > >>>>>>>>>> aligned
> >> > >>>>>>>>>> and styled better.
> >> > >>>>>>>>>>
> >> > >>>>>>>>>> Anyway, that's the reason: simplicity.
> >> > >>>>>>>>>>
> >> > >>>>>>>>>> ‹peter
> >> > >>>>>>>>>>
> >> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com>
> wrote:
> >> > >>>>>>>>>>
> >> > >>>>>>>>>>> Is there a reason that the element type of Basic Label is
> >> span?
> >> > >>>>>>>>>>>
> >> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it
> >>does
> >> not
> >> > >>>>>>>>>>> seem
> >> > >>>>>>>>>>> to
> >> > >>>>>>>>>>> work because spans donąt really have a working width.
> >> Switching
> >> > >>> the
> >> > >>>>>>>>>>> element type to div seems to make it work.
> >> > >>>>>>>>>>>
> >> > >>>>>>>>>>> Harbs
> >> > >>>>>>>>>>
> >> > >>>>>>>>>
> >> > >>>>>>>>
> >> > >>>>>>>
> >> > >>>>>>
> >> > >>>>>
> >> > >>>>
> >> > >>>
> >> > >>>
> >> > >>
> >> > >>
> >> > >> --
> >> > >> Carlos Rovira
> >> > >> https://na01.safelinks.protection.outlook.com/?url=
> >> > http%3A%2F%2Fabout.me%2
> >><https://na01.safelinks.protection.outlook.com/?url=
> https%3A%2F%2Fna01.sa
> >>felinks&data=02%7C01%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> 7
> >>bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> 7C636567533215453966&sdata
> >>=exoH%2BPKzuyM%2BykE65GQeHk%2BjPAZSsUFjsKwx3BRvjsk%3D&reserved=0.
> >> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
> >> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com
> >><https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2F40adobe
> .
> >>com%2F&data=02%7C01%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc
> 7b
> >>f0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> 7C636567533215453966&sdata=
> >>ewhtNMkSjHssIseUSvxq9etF%2FtrcA%2Buqk3sZlJkjHuc%3D&reserved=0
> >> >%
> >> > 7Cae539925833d453aaa2e08d5
> >> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> >> > 7C636567454874235113&s
> >> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY1WVtz2xsNvc%3D&reserved=0
> >> >
> >> >
> >>
>
>

Re: Label

Posted by Alex Harui <ah...@adobe.com.INVALID>.
A Flex Label, and any Flex component was a swiss-army knife of features
and not PAYG.  I have not given up on PAYG.  I think it will pay off when
we get to the last mile.  If we don't stick to PAYG, I think we will just
repeat the history of Flex and produce a fat framework that can't run
everywhere.  Yes, a Div would probably better mimic a Flex Label, but the
Basic label is not a swiss-army knife.

This article is old, but I think it says you can't put a Div in a Span:
http://doctype.com/span-contain-div-html5

I think you can if you change the span's display to "block" but I think
that is essentially replacing the element.

Everything, including width and truncation should be opt-in, PAYG.  Make a
LabelWithWidth or SizeableLabel component that is a div if you want.

Again, the goal is to encapsulate common patterns.  I am not seeing a lot
of Divs wrapping text nodes.  I see lots of spans wrapping text nodes.
Basic Label is that pattern.  The Basic component set would be incomplete
if there wasn't a component that could inject a Span into the DOM.  Create
another component that is a Div wrapping a text node, give it a different
name, and let's move on.

Alina used Label quite often without setting width.  No need for those
instances to be a Div, AFAICT.

Do we even need to discuss span vs div if the truncation bead will work by
setting display:block?

We have a huge opportunity here to get another app migrated and prove to
the world that Royale is the right choice.  But we keep discussing stuff
that IMO, isn't really moving the big pieces forward.  But, IMO, we should
not compromise on PAYG philosophy and patterns.

My 2 cents,
-Alex

On 3/15/18, 4:27 PM, "omuppi1@gmail.com on behalf of OmPrakash Muppirala"
<omuppi1@gmail.com on behalf of bigosmallm@gmail.com> wrote:

>FWIW, it seems like creating divs is faster than creating spans.
>https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fjsperf.co
>m%2Fspan-vs-div-creation&data=02%7C01%7Caharui%40adobe.com%7C3664f690b3da4
>e4aefab08d58acc7bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636567533
>215453966&sdata=oPPp2e9aRbQ%2FngKbcFMHMCmXi%2BKa%2B%2F0aA98XFFqxhFA%3D&res
>erved=0
>
>Thanks,
>Om
>
>On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <gr...@gmail.com> wrote:
>
>> Observing from the sidelines, fwiw I agree with Harbs here. Span to me
>> makes more sense as part of the text value of a label and not as the
>>basis
>> for the representation of the Label itself - div seems closer to what I
>>was
>> used to with legacy Flex (which may no longer be the 'reference' for
>> choosing an implementation).
>> I don't think there is any semantic or other reason that makes span the
>> logical default tag for Label, in fact I recall that being a problem
>>many
>> times with some work I was involved with last year using FlexJS.
>> But maybe I am missing something in terms of understanding.
>>
>>
>>
>>
>> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <ha...@gmail.com> wrote:
>>
>> > I’m suggesting to change it because span does not fit the use case of
>> > Label. Width and truncate are just two applications which indicate
>>that
>> > span is not the correct element. I’m pretty sure I had other edge
>>cases
>> > which were likely effected by the fact that Label is a span, although
>>I’m
>> > not positive.
>> >
>> > I disagree with your distinction between span and div.
>> >
>> > Both span and div can have children. Spans can contain divs and divs
>>can
>> > contain spans. At its core, Span has nothing to do with text. It’s
>>just
>> > often used for text because text (within its container) is inline.
>> >
>> > MDN says[1] "<span> is very much like a <div> element, but <div> is a
>> > block-level element whereas a <span> is an inline element.”
>> >
>> > Label is *not* necessarily an inline element. We have all kinds of
>> layouts
>> > for Label. Many (most?) of them are not inline.
>> >
>> > If you feel really strongly about this, I’ll revert even though I
>> disagree.
>> >
>> > FWIW, the truncate bead does not need to change the element type. It
>>can
>> > explicitly set the display of the element to block.
>> >
>> > Harbs
>> >
>> > 
>>[1]https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdevel
>>oper.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%2Fspan&data=02%7C0
>>1%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc7bf0%7Cfa7b1b5a7b344
>>38794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=xrtF9H7%2BjFzqGDax
>>nj0%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0 <
>> > 
>>https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fdevelope
>>r.mozilla.org%2Fen-US%2Fdocs%2FWeb%2FHTML%2FElement%2Fspan&data=02%7C01%7
>>Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc7bf0%7Cfa7b1b5a7b344387
>>94aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=xrtF9H7%2BjFzqGDaxnj0
>>%2BuY3hsHu6BaUb4Yp15ucwhyc%3D&reserved=0>
>> >
>> > > On Mar 15, 2018, at 11:25 PM, Alex Harui <ah...@adobe.com.INVALID>
>> > wrote:
>> > >
>> > > Label in Flex and Royale is not intended to have any children (other
>> than
>> > > bold, italic and other text markup).  Span represents that.  Div
>>does
>> > not.
>> > > You are suggesting changing to div JUST IN CASE someone needs to
>>set a
>> > > width and/or truncate.  Just-in-case code is not PAYG.
>> > >
>> > > My 2 cents,
>> > > -Alex
>> > >
>> > > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
>> > carlos.rovira@gmail.com> on behalf of Carlos Rovira"
>> > > <carlos.rovira@gmail.com <ma...@gmail.com> on behalf
>>of
>> > carlosrovira@apache.org <ma...@apache.org>> wrote:
>> > >
>> > >> And why not change IBeadView in Label for a view that uses a div
>>when
>> > >> needed? ;)
>> > >> in the other cases, maintains the span
>> > >>
>> > >> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
>> > >>
>> > >>> I’m still not understanding you. What about Label says it’s a span
>> > >>> instead
>> > >>> of a div? Why is making it a div not PAYG? Span simply limits
>>Label
>> > >>> unnecessarily. I think span is not the appropriate element for
>>Label.
>> > >>>
>> > >>>> A Label without width should grow to the size of its text.  Isn't
>> that
>> > >>> how
>> > >>>> it worked in Flex?
>> > >>>
>> > >>> Sure, and a div does that too. In Flex, a label could have a width
>> too
>> > >>> if
>> > >>> specified. Spans cannot.
>> > >>>
>> > >>> Harbs
>> > >>>
>> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui
>><ah...@adobe.com.INVALID>
>> > >>> wrote:
>> > >>>>
>> > >>>> Have the truncation bead swap the span for div.  Again, some
>> component
>> > >>> has
>> > >>>> to put a span in the DOM.  Label has been just fine for that so
>>far.
>> > >>>>
>> > >>>> A Label without width should grow to the size of its text.  Isn't
>> that
>> > >>> how
>> > >>>> it worked in Flex?
>> > >>>>
>> > >>>> Maybe Label should be refactored to not have width/height
>>properties
>> > >>> but
>> > >>>> IMO we have bigger fish to fry.
>> > >>>>
>> > >>>> I'm sure Div is used to wrap text in some frameworks, but those
>> > >>> frameworks
>> > >>>> probably aren't PAYG.  In Alina's app, Label has a usage score of
>> 69,
>> > >>> but
>> > >>>> Label.width has a score of only 5.  We will have her use
>> > >>>> LabelWithTruncation or add the truncation bead on the few labels
>> that
>> > >>> need
>> > >>>>
>> > >>>> My 2 cents,
>> > >>>> -Alex
>> > >>>>
>> > >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:
>> > >>>>
>> > >>>>> But we already have a truncation bead. The only reason it
>>doesn’t
>> > >>> work
>> > >>> in
>> > >>>>> Label is because spans don’t have widths.
>> > >>>>>
>> > >>>>> Label is not something which should flow beyond its bounds —
>>which
>> is
>> > >>>>> what span is useful for. I still don’t see why you think span
>>makes
>> > >>> more
>> > >>>>> sense.
>> > >>>>>
>> > >>>>> FWIW, div *is* used as a container for text in various
>>frameworks.
>> > >>>>>
>> > >>>>> My $0.02,
>> > >>>>> Harbs
>> > >>>>>
>> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui
>><aharui@adobe.com.INVALID
>> >
>> > >>>>>> wrote:
>> > >>>>>>
>> > >>>>>> AIUI, "inline" is the default display style for Span.  "block"
>>is
>> > >>> the
>> > >>>>>> default for Div.  HTML flows inline by default for just plain
>> text.
>> > >>>>>> Basic
>> > >>>>>> components try to give Flex-friendly names for HTMLElements.
>>Some
>> > >>>>>> component in Basic needs to inject a span into the DOM.  In a
>>few
>> > >>>>>> seconds
>> > >>>>>> of looking at a Google web page, I did not see any divs with
>>text
>> as
>> > >>>>>> children.  I saw spans.  The Divs all contained other elements.
>> > >>>>>>
>> > >>>>>> I don't create HTML web pages for a living, but if I were to
>> place a
>> > >>>>>> label
>> > >>>>>> over a control like I often see in Flex, I would not wrap the
>> label
>> > >>> in
>> > >>> a
>> > >>>>>> Div.  The control would be div, so I would us a span or just
>>plain
>> > >>> text.
>> > >>>>>> If I looked at the final DOM and saw Divs around every chunk of
>> > >>> text, I
>> > >>>>>> would think there is something heavy about the framework.
>> > >>>>>>
>> > >>>>>> Again, the goal is to encapsulate common patterns.  Label
>>combined
>> > >>> with
>> > >>>>>> some control is trying to replicate common patterns for
>>labeling
>> > >>>>>> controls.
>> > >>>>>> You are trying to solve the common pattern of truncating text.
>> That
>> > >>>>>> will
>> > >>>>>> require a Div. But truncation, or even width/height is not
>> something
>> > >>>>>> that
>> > >>>>>> should be built into Label for PAYG reasons.  IMO, you should
>> > >>> create a
>> > >>>>>> different component with a different name.  TruncatingLabel, or
>> > >>>>>> LabelWIthTruncation.
>> > >>>>>>
>> > >>>>>> My 2 cents,
>> > >>>>>> -Alex
>> > >>>>>>
>> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
>> > >>>>>>
>> > >>>>>>> Why is span lighter than div?
>> > >>>>>>>
>> > >>>>>>> Inline and nowrap is not specific to span. AFAICT, there’s
>> nothing
>> > >>>>>>> specific to snap which fits Label better than div.
>> > >>>>>>>
>> > >>>>>>> As far as components which “does” span: Besides Span in HTML,
>>we
>> > >>> have
>> > >>>>>>> HTMLText in Basic which encapsulates span.
>> > >>>>>>>
>> > >>>>>>> I can revert the change I made to Label, but I have not seen
>>any
>> > >>>>>>> downside
>> > >>>>>>> to using div for Label. It seems to me that there’s nothing in
>> the
>> > >>>>>>> Label
>> > >>>>>>> promise which dictates using span.
>> > >>>>>>>
>> > >>>>>>> Harbs
>> > >>>>>>>
>> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui
>> <aharui@adobe.com.INVALID
>> > >
>> > >>>>>>>> wrote:
>> > >>>>>>>>
>> > >>>>>>>>
>> > >>>>>>>>
>> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
>> > >>>>>>>>
>> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element component set
>>which
>> > >>> more
>> > >>>>>>>>> thinly wraps HTML elements.
>> > >>>>>>>>>
>> > >>>>>>>>> I can’t think of any reason why Label would be better as a
>>span
>> > >>> than
>> > >>>>>>>>> a
>> > >>>>>>>>> div. It seems to me that simply using div instead of span
>>would
>> > >>> make
>> > >>>>>>>>> Label more versatile. Am I missing something?
>> > >>>>>>>>
>> > >>>>>>>> You may be missing that the only real goal of Royale is to
>> > >>> encapsulate
>> > >>>>>>>> popular patterns.  Pretty sure I've seen span used on many
>>web
>> > >>> pages,
>> > >>>>>>>> so
>> > >>>>>>>> we need a component that does what it does, including
>>assuming
>> > >>> inline
>> > >>>>>>>> instead of block display.  Similarly, what would you think
>>of a
>> > >>>>>>>> framework
>> > >>>>>>>> that had a HelloWorld that used a div instead of a span?  You
>> > >>> might
>> > >>>>>>>> think
>> > >>>>>>>> it is too heavy.
>> > >>>>>>>>
>> > >>>>>>>> Per PAYG, if span doesn’t' support certain features, then you
>> > >>> create
>> > >>> a
>> > >>>>>>>> LabelWithTruncation and have it use a Div if you need to.
>> > >>>>>>>>
>> > >>>>>>>> My 2 cents,
>> > >>>>>>>> -Alex
>> > >>>>>>>>>
>> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent
>><pent@adobe.com.INVALID
>> >
>> > >>>>>>>>>> wrote:
>> > >>>>>>>>>>
>> > >>>>>>>>>> Label was one of the very first components and the idea was
>> > >>>>>>>>>> minimalism.
>> > >>>>>>>>>> Button was <button> and TextInput was <input type="text">
>>and
>> > >>> Label
>> > >>>>>>>>>> was
>> > >>>>>>>>>> <span>.
>> > >>>>>>>>>>
>> > >>>>>>>>>> I'm wondering if we should have NativeButton, NativeLabel,
>> etc.
>> > >>>>>>>>>> which
>> > >>>>>>>>>> would be these minimal elements and have others that are
>><div>
>> > >>>>>>>>>> wrapping.
>> > >>>>>>>>>> For instance, ImageAndTextButton is a <button><img
>> > >>>>>>>>>> src="goo.jpg">Label
>> > >>>>>>>>>> Here</button> which works but the alignment is weird so
>>maybe
>> > >>>>>>>>>> ImageAndTextButton should be a <div><img>Text</div> which
>>can
>> be
>> > >>>>>>>>>> aligned
>> > >>>>>>>>>> and styled better.
>> > >>>>>>>>>>
>> > >>>>>>>>>> Anyway, that's the reason: simplicity.
>> > >>>>>>>>>>
>> > >>>>>>>>>> ‹peter
>> > >>>>>>>>>>
>> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>> > >>>>>>>>>>
>> > >>>>>>>>>>> Is there a reason that the element type of Basic Label is
>> span?
>> > >>>>>>>>>>>
>> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it
>>does
>> not
>> > >>>>>>>>>>> seem
>> > >>>>>>>>>>> to
>> > >>>>>>>>>>> work because spans donąt really have a working width.
>> Switching
>> > >>> the
>> > >>>>>>>>>>> element type to div seems to make it work.
>> > >>>>>>>>>>>
>> > >>>>>>>>>>> Harbs
>> > >>>>>>>>>>
>> > >>>>>>>>>
>> > >>>>>>>>
>> > >>>>>>>
>> > >>>>>>
>> > >>>>>
>> > >>>>
>> > >>>
>> > >>>
>> > >>
>> > >>
>> > >> --
>> > >> Carlos Rovira
>> > >> https://na01.safelinks.protection.outlook.com/?url=
>> > http%3A%2F%2Fabout.me%2
>><https://na01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fna01.sa
>>felinks&data=02%7C01%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc7
>>bf0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata
>>=exoH%2BPKzuyM%2BykE65GQeHk%2BjPAZSsUFjsKwx3BRvjsk%3D&reserved=0.
>> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
>> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com
>><https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2F40adobe.
>>com%2F&data=02%7C01%7Caharui%40adobe.com%7C3664f690b3da4e4aefab08d58acc7b
>>f0%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636567533215453966&sdata=
>>ewhtNMkSjHssIseUSvxq9etF%2FtrcA%2Buqk3sZlJkjHuc%3D&reserved=0
>> >%
>> > 7Cae539925833d453aaa2e08d5
>> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
>> > 7C636567454874235113&s
>> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY1WVtz2xsNvc%3D&reserved=0
>> >
>> >
>>


Re: Label

Posted by OmPrakash Muppirala <bi...@gmail.com>.
FWIW, it seems like creating divs is faster than creating spans.
https://jsperf.com/span-vs-div-creation

Thanks,
Om

On Thu, Mar 15, 2018 at 3:38 PM, Greg Dove <gr...@gmail.com> wrote:

> Observing from the sidelines, fwiw I agree with Harbs here. Span to me
> makes more sense as part of the text value of a label and not as the basis
> for the representation of the Label itself - div seems closer to what I was
> used to with legacy Flex (which may no longer be the 'reference' for
> choosing an implementation).
> I don't think there is any semantic or other reason that makes span the
> logical default tag for Label, in fact I recall that being a problem many
> times with some work I was involved with last year using FlexJS.
> But maybe I am missing something in terms of understanding.
>
>
>
>
> On Fri, Mar 16, 2018 at 11:08 AM, Harbs <ha...@gmail.com> wrote:
>
> > I’m suggesting to change it because span does not fit the use case of
> > Label. Width and truncate are just two applications which indicate that
> > span is not the correct element. I’m pretty sure I had other edge cases
> > which were likely effected by the fact that Label is a span, although I’m
> > not positive.
> >
> > I disagree with your distinction between span and div.
> >
> > Both span and div can have children. Spans can contain divs and divs can
> > contain spans. At its core, Span has nothing to do with text. It’s just
> > often used for text because text (within its container) is inline.
> >
> > MDN says[1] "<span> is very much like a <div> element, but <div> is a
> > block-level element whereas a <span> is an inline element.”
> >
> > Label is *not* necessarily an inline element. We have all kinds of
> layouts
> > for Label. Many (most?) of them are not inline.
> >
> > If you feel really strongly about this, I’ll revert even though I
> disagree.
> >
> > FWIW, the truncate bead does not need to change the element type. It can
> > explicitly set the display of the element to block.
> >
> > Harbs
> >
> > [1]https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span <
> > https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span>
> >
> > > On Mar 15, 2018, at 11:25 PM, Alex Harui <ah...@adobe.com.INVALID>
> > wrote:
> > >
> > > Label in Flex and Royale is not intended to have any children (other
> than
> > > bold, italic and other text markup).  Span represents that.  Div does
> > not.
> > > You are suggesting changing to div JUST IN CASE someone needs to set a
> > > width and/or truncate.  Just-in-case code is not PAYG.
> > >
> > > My 2 cents,
> > > -Alex
> > >
> > > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
> > carlos.rovira@gmail.com> on behalf of Carlos Rovira"
> > > <carlos.rovira@gmail.com <ma...@gmail.com> on behalf of
> > carlosrovira@apache.org <ma...@apache.org>> wrote:
> > >
> > >> And why not change IBeadView in Label for a view that uses a div when
> > >> needed? ;)
> > >> in the other cases, maintains the span
> > >>
> > >> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
> > >>
> > >>> I’m still not understanding you. What about Label says it’s a span
> > >>> instead
> > >>> of a div? Why is making it a div not PAYG? Span simply limits Label
> > >>> unnecessarily. I think span is not the appropriate element for Label.
> > >>>
> > >>>> A Label without width should grow to the size of its text.  Isn't
> that
> > >>> how
> > >>>> it worked in Flex?
> > >>>
> > >>> Sure, and a div does that too. In Flex, a label could have a width
> too
> > >>> if
> > >>> specified. Spans cannot.
> > >>>
> > >>> Harbs
> > >>>
> > >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui <ah...@adobe.com.INVALID>
> > >>> wrote:
> > >>>>
> > >>>> Have the truncation bead swap the span for div.  Again, some
> component
> > >>> has
> > >>>> to put a span in the DOM.  Label has been just fine for that so far.
> > >>>>
> > >>>> A Label without width should grow to the size of its text.  Isn't
> that
> > >>> how
> > >>>> it worked in Flex?
> > >>>>
> > >>>> Maybe Label should be refactored to not have width/height properties
> > >>> but
> > >>>> IMO we have bigger fish to fry.
> > >>>>
> > >>>> I'm sure Div is used to wrap text in some frameworks, but those
> > >>> frameworks
> > >>>> probably aren't PAYG.  In Alina's app, Label has a usage score of
> 69,
> > >>> but
> > >>>> Label.width has a score of only 5.  We will have her use
> > >>>> LabelWithTruncation or add the truncation bead on the few labels
> that
> > >>> need
> > >>>>
> > >>>> My 2 cents,
> > >>>> -Alex
> > >>>>
> > >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:
> > >>>>
> > >>>>> But we already have a truncation bead. The only reason it doesn’t
> > >>> work
> > >>> in
> > >>>>> Label is because spans don’t have widths.
> > >>>>>
> > >>>>> Label is not something which should flow beyond its bounds — which
> is
> > >>>>> what span is useful for. I still don’t see why you think span makes
> > >>> more
> > >>>>> sense.
> > >>>>>
> > >>>>> FWIW, div *is* used as a container for text in various frameworks.
> > >>>>>
> > >>>>> My $0.02,
> > >>>>> Harbs
> > >>>>>
> > >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui <aharui@adobe.com.INVALID
> >
> > >>>>>> wrote:
> > >>>>>>
> > >>>>>> AIUI, "inline" is the default display style for Span.  "block" is
> > >>> the
> > >>>>>> default for Div.  HTML flows inline by default for just plain
> text.
> > >>>>>> Basic
> > >>>>>> components try to give Flex-friendly names for HTMLElements.  Some
> > >>>>>> component in Basic needs to inject a span into the DOM.  In a few
> > >>>>>> seconds
> > >>>>>> of looking at a Google web page, I did not see any divs with text
> as
> > >>>>>> children.  I saw spans.  The Divs all contained other elements.
> > >>>>>>
> > >>>>>> I don't create HTML web pages for a living, but if I were to
> place a
> > >>>>>> label
> > >>>>>> over a control like I often see in Flex, I would not wrap the
> label
> > >>> in
> > >>> a
> > >>>>>> Div.  The control would be div, so I would us a span or just plain
> > >>> text.
> > >>>>>> If I looked at the final DOM and saw Divs around every chunk of
> > >>> text, I
> > >>>>>> would think there is something heavy about the framework.
> > >>>>>>
> > >>>>>> Again, the goal is to encapsulate common patterns.  Label combined
> > >>> with
> > >>>>>> some control is trying to replicate common patterns for labeling
> > >>>>>> controls.
> > >>>>>> You are trying to solve the common pattern of truncating text.
> That
> > >>>>>> will
> > >>>>>> require a Div. But truncation, or even width/height is not
> something
> > >>>>>> that
> > >>>>>> should be built into Label for PAYG reasons.  IMO, you should
> > >>> create a
> > >>>>>> different component with a different name.  TruncatingLabel, or
> > >>>>>> LabelWIthTruncation.
> > >>>>>>
> > >>>>>> My 2 cents,
> > >>>>>> -Alex
> > >>>>>>
> > >>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
> > >>>>>>
> > >>>>>>> Why is span lighter than div?
> > >>>>>>>
> > >>>>>>> Inline and nowrap is not specific to span. AFAICT, there’s
> nothing
> > >>>>>>> specific to snap which fits Label better than div.
> > >>>>>>>
> > >>>>>>> As far as components which “does” span: Besides Span in HTML, we
> > >>> have
> > >>>>>>> HTMLText in Basic which encapsulates span.
> > >>>>>>>
> > >>>>>>> I can revert the change I made to Label, but I have not seen any
> > >>>>>>> downside
> > >>>>>>> to using div for Label. It seems to me that there’s nothing in
> the
> > >>>>>>> Label
> > >>>>>>> promise which dictates using span.
> > >>>>>>>
> > >>>>>>> Harbs
> > >>>>>>>
> > >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui
> <aharui@adobe.com.INVALID
> > >
> > >>>>>>>> wrote:
> > >>>>>>>>
> > >>>>>>>>
> > >>>>>>>>
> > >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
> > >>>>>>>>
> > >>>>>>>>> Gotcha. FWIW, we now have the HTML element component set which
> > >>> more
> > >>>>>>>>> thinly wraps HTML elements.
> > >>>>>>>>>
> > >>>>>>>>> I can’t think of any reason why Label would be better as a span
> > >>> than
> > >>>>>>>>> a
> > >>>>>>>>> div. It seems to me that simply using div instead of span would
> > >>> make
> > >>>>>>>>> Label more versatile. Am I missing something?
> > >>>>>>>>
> > >>>>>>>> You may be missing that the only real goal of Royale is to
> > >>> encapsulate
> > >>>>>>>> popular patterns.  Pretty sure I've seen span used on many web
> > >>> pages,
> > >>>>>>>> so
> > >>>>>>>> we need a component that does what it does, including assuming
> > >>> inline
> > >>>>>>>> instead of block display.  Similarly, what would you think of a
> > >>>>>>>> framework
> > >>>>>>>> that had a HelloWorld that used a div instead of a span?  You
> > >>> might
> > >>>>>>>> think
> > >>>>>>>> it is too heavy.
> > >>>>>>>>
> > >>>>>>>> Per PAYG, if span doesn’t' support certain features, then you
> > >>> create
> > >>> a
> > >>>>>>>> LabelWithTruncation and have it use a Div if you need to.
> > >>>>>>>>
> > >>>>>>>> My 2 cents,
> > >>>>>>>> -Alex
> > >>>>>>>>>
> > >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pent@adobe.com.INVALID
> >
> > >>>>>>>>>> wrote:
> > >>>>>>>>>>
> > >>>>>>>>>> Label was one of the very first components and the idea was
> > >>>>>>>>>> minimalism.
> > >>>>>>>>>> Button was <button> and TextInput was <input type="text"> and
> > >>> Label
> > >>>>>>>>>> was
> > >>>>>>>>>> <span>.
> > >>>>>>>>>>
> > >>>>>>>>>> I'm wondering if we should have NativeButton, NativeLabel,
> etc.
> > >>>>>>>>>> which
> > >>>>>>>>>> would be these minimal elements and have others that are <div>
> > >>>>>>>>>> wrapping.
> > >>>>>>>>>> For instance, ImageAndTextButton is a <button><img
> > >>>>>>>>>> src="goo.jpg">Label
> > >>>>>>>>>> Here</button> which works but the alignment is weird so maybe
> > >>>>>>>>>> ImageAndTextButton should be a <div><img>Text</div> which can
> be
> > >>>>>>>>>> aligned
> > >>>>>>>>>> and styled better.
> > >>>>>>>>>>
> > >>>>>>>>>> Anyway, that's the reason: simplicity.
> > >>>>>>>>>>
> > >>>>>>>>>> ‹peter
> > >>>>>>>>>>
> > >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
> > >>>>>>>>>>
> > >>>>>>>>>>> Is there a reason that the element type of Basic Label is
> span?
> > >>>>>>>>>>>
> > >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it does
> not
> > >>>>>>>>>>> seem
> > >>>>>>>>>>> to
> > >>>>>>>>>>> work because spans donąt really have a working width.
> Switching
> > >>> the
> > >>>>>>>>>>> element type to div seems to make it work.
> > >>>>>>>>>>>
> > >>>>>>>>>>> Harbs
> > >>>>>>>>>>
> > >>>>>>>>>
> > >>>>>>>>
> > >>>>>>>
> > >>>>>>
> > >>>>>
> > >>>>
> > >>>
> > >>>
> > >>
> > >>
> > >> --
> > >> Carlos Rovira
> > >> https://na01.safelinks.protection.outlook.com/?url=
> > http%3A%2F%2Fabout.me%2 <https://na01.safelinks.
> > protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
> > >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com <http://40adobe.com/
> >%
> > 7Cae539925833d453aaa2e08d5
> > >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> > 7C636567454874235113&s
> > >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY1WVtz2xsNvc%3D&reserved=0
> >
> >
>

Re: Label

Posted by Greg Dove <gr...@gmail.com>.
Observing from the sidelines, fwiw I agree with Harbs here. Span to me
makes more sense as part of the text value of a label and not as the basis
for the representation of the Label itself - div seems closer to what I was
used to with legacy Flex (which may no longer be the 'reference' for
choosing an implementation).
I don't think there is any semantic or other reason that makes span the
logical default tag for Label, in fact I recall that being a problem many
times with some work I was involved with last year using FlexJS.
But maybe I am missing something in terms of understanding.




On Fri, Mar 16, 2018 at 11:08 AM, Harbs <ha...@gmail.com> wrote:

> I’m suggesting to change it because span does not fit the use case of
> Label. Width and truncate are just two applications which indicate that
> span is not the correct element. I’m pretty sure I had other edge cases
> which were likely effected by the fact that Label is a span, although I’m
> not positive.
>
> I disagree with your distinction between span and div.
>
> Both span and div can have children. Spans can contain divs and divs can
> contain spans. At its core, Span has nothing to do with text. It’s just
> often used for text because text (within its container) is inline.
>
> MDN says[1] "<span> is very much like a <div> element, but <div> is a
> block-level element whereas a <span> is an inline element.”
>
> Label is *not* necessarily an inline element. We have all kinds of layouts
> for Label. Many (most?) of them are not inline.
>
> If you feel really strongly about this, I’ll revert even though I disagree.
>
> FWIW, the truncate bead does not need to change the element type. It can
> explicitly set the display of the element to block.
>
> Harbs
>
> [1]https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span <
> https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span>
>
> > On Mar 15, 2018, at 11:25 PM, Alex Harui <ah...@adobe.com.INVALID>
> wrote:
> >
> > Label in Flex and Royale is not intended to have any children (other than
> > bold, italic and other text markup).  Span represents that.  Div does
> not.
> > You are suggesting changing to div JUST IN CASE someone needs to set a
> > width and/or truncate.  Just-in-case code is not PAYG.
> >
> > My 2 cents,
> > -Alex
> >
> > On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <mailto:
> carlos.rovira@gmail.com> on behalf of Carlos Rovira"
> > <carlos.rovira@gmail.com <ma...@gmail.com> on behalf of
> carlosrovira@apache.org <ma...@apache.org>> wrote:
> >
> >> And why not change IBeadView in Label for a view that uses a div when
> >> needed? ;)
> >> in the other cases, maintains the span
> >>
> >> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
> >>
> >>> I’m still not understanding you. What about Label says it’s a span
> >>> instead
> >>> of a div? Why is making it a div not PAYG? Span simply limits Label
> >>> unnecessarily. I think span is not the appropriate element for Label.
> >>>
> >>>> A Label without width should grow to the size of its text.  Isn't that
> >>> how
> >>>> it worked in Flex?
> >>>
> >>> Sure, and a div does that too. In Flex, a label could have a width too
> >>> if
> >>> specified. Spans cannot.
> >>>
> >>> Harbs
> >>>
> >>>> On Mar 15, 2018, at 9:56 PM, Alex Harui <ah...@adobe.com.INVALID>
> >>> wrote:
> >>>>
> >>>> Have the truncation bead swap the span for div.  Again, some component
> >>> has
> >>>> to put a span in the DOM.  Label has been just fine for that so far.
> >>>>
> >>>> A Label without width should grow to the size of its text.  Isn't that
> >>> how
> >>>> it worked in Flex?
> >>>>
> >>>> Maybe Label should be refactored to not have width/height properties
> >>> but
> >>>> IMO we have bigger fish to fry.
> >>>>
> >>>> I'm sure Div is used to wrap text in some frameworks, but those
> >>> frameworks
> >>>> probably aren't PAYG.  In Alina's app, Label has a usage score of 69,
> >>> but
> >>>> Label.width has a score of only 5.  We will have her use
> >>>> LabelWithTruncation or add the truncation bead on the few labels that
> >>> need
> >>>>
> >>>> My 2 cents,
> >>>> -Alex
> >>>>
> >>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:
> >>>>
> >>>>> But we already have a truncation bead. The only reason it doesn’t
> >>> work
> >>> in
> >>>>> Label is because spans don’t have widths.
> >>>>>
> >>>>> Label is not something which should flow beyond its bounds — which is
> >>>>> what span is useful for. I still don’t see why you think span makes
> >>> more
> >>>>> sense.
> >>>>>
> >>>>> FWIW, div *is* used as a container for text in various frameworks.
> >>>>>
> >>>>> My $0.02,
> >>>>> Harbs
> >>>>>
> >>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui <ah...@adobe.com.INVALID>
> >>>>>> wrote:
> >>>>>>
> >>>>>> AIUI, "inline" is the default display style for Span.  "block" is
> >>> the
> >>>>>> default for Div.  HTML flows inline by default for just plain text.
> >>>>>> Basic
> >>>>>> components try to give Flex-friendly names for HTMLElements.  Some
> >>>>>> component in Basic needs to inject a span into the DOM.  In a few
> >>>>>> seconds
> >>>>>> of looking at a Google web page, I did not see any divs with text as
> >>>>>> children.  I saw spans.  The Divs all contained other elements.
> >>>>>>
> >>>>>> I don't create HTML web pages for a living, but if I were to place a
> >>>>>> label
> >>>>>> over a control like I often see in Flex, I would not wrap the label
> >>> in
> >>> a
> >>>>>> Div.  The control would be div, so I would us a span or just plain
> >>> text.
> >>>>>> If I looked at the final DOM and saw Divs around every chunk of
> >>> text, I
> >>>>>> would think there is something heavy about the framework.
> >>>>>>
> >>>>>> Again, the goal is to encapsulate common patterns.  Label combined
> >>> with
> >>>>>> some control is trying to replicate common patterns for labeling
> >>>>>> controls.
> >>>>>> You are trying to solve the common pattern of truncating text.  That
> >>>>>> will
> >>>>>> require a Div. But truncation, or even width/height is not something
> >>>>>> that
> >>>>>> should be built into Label for PAYG reasons.  IMO, you should
> >>> create a
> >>>>>> different component with a different name.  TruncatingLabel, or
> >>>>>> LabelWIthTruncation.
> >>>>>>
> >>>>>> My 2 cents,
> >>>>>> -Alex
> >>>>>>
> >>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
> >>>>>>
> >>>>>>> Why is span lighter than div?
> >>>>>>>
> >>>>>>> Inline and nowrap is not specific to span. AFAICT, there’s nothing
> >>>>>>> specific to snap which fits Label better than div.
> >>>>>>>
> >>>>>>> As far as components which “does” span: Besides Span in HTML, we
> >>> have
> >>>>>>> HTMLText in Basic which encapsulates span.
> >>>>>>>
> >>>>>>> I can revert the change I made to Label, but I have not seen any
> >>>>>>> downside
> >>>>>>> to using div for Label. It seems to me that there’s nothing in the
> >>>>>>> Label
> >>>>>>> promise which dictates using span.
> >>>>>>>
> >>>>>>> Harbs
> >>>>>>>
> >>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui <aharui@adobe.com.INVALID
> >
> >>>>>>>> wrote:
> >>>>>>>>
> >>>>>>>>
> >>>>>>>>
> >>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
> >>>>>>>>
> >>>>>>>>> Gotcha. FWIW, we now have the HTML element component set which
> >>> more
> >>>>>>>>> thinly wraps HTML elements.
> >>>>>>>>>
> >>>>>>>>> I can’t think of any reason why Label would be better as a span
> >>> than
> >>>>>>>>> a
> >>>>>>>>> div. It seems to me that simply using div instead of span would
> >>> make
> >>>>>>>>> Label more versatile. Am I missing something?
> >>>>>>>>
> >>>>>>>> You may be missing that the only real goal of Royale is to
> >>> encapsulate
> >>>>>>>> popular patterns.  Pretty sure I've seen span used on many web
> >>> pages,
> >>>>>>>> so
> >>>>>>>> we need a component that does what it does, including assuming
> >>> inline
> >>>>>>>> instead of block display.  Similarly, what would you think of a
> >>>>>>>> framework
> >>>>>>>> that had a HelloWorld that used a div instead of a span?  You
> >>> might
> >>>>>>>> think
> >>>>>>>> it is too heavy.
> >>>>>>>>
> >>>>>>>> Per PAYG, if span doesn’t' support certain features, then you
> >>> create
> >>> a
> >>>>>>>> LabelWithTruncation and have it use a Div if you need to.
> >>>>>>>>
> >>>>>>>> My 2 cents,
> >>>>>>>> -Alex
> >>>>>>>>>
> >>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID>
> >>>>>>>>>> wrote:
> >>>>>>>>>>
> >>>>>>>>>> Label was one of the very first components and the idea was
> >>>>>>>>>> minimalism.
> >>>>>>>>>> Button was <button> and TextInput was <input type="text"> and
> >>> Label
> >>>>>>>>>> was
> >>>>>>>>>> <span>.
> >>>>>>>>>>
> >>>>>>>>>> I'm wondering if we should have NativeButton, NativeLabel, etc.
> >>>>>>>>>> which
> >>>>>>>>>> would be these minimal elements and have others that are <div>
> >>>>>>>>>> wrapping.
> >>>>>>>>>> For instance, ImageAndTextButton is a <button><img
> >>>>>>>>>> src="goo.jpg">Label
> >>>>>>>>>> Here</button> which works but the alignment is weird so maybe
> >>>>>>>>>> ImageAndTextButton should be a <div><img>Text</div> which can be
> >>>>>>>>>> aligned
> >>>>>>>>>> and styled better.
> >>>>>>>>>>
> >>>>>>>>>> Anyway, that's the reason: simplicity.
> >>>>>>>>>>
> >>>>>>>>>> ‹peter
> >>>>>>>>>>
> >>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
> >>>>>>>>>>
> >>>>>>>>>>> Is there a reason that the element type of Basic Label is span?
> >>>>>>>>>>>
> >>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not
> >>>>>>>>>>> seem
> >>>>>>>>>>> to
> >>>>>>>>>>> work because spans donąt really have a working width. Switching
> >>> the
> >>>>>>>>>>> element type to div seems to make it work.
> >>>>>>>>>>>
> >>>>>>>>>>> Harbs
> >>>>>>>>>>
> >>>>>>>>>
> >>>>>>>>
> >>>>>>>
> >>>>>>
> >>>>>
> >>>>
> >>>
> >>>
> >>
> >>
> >> --
> >> Carlos Rovira
> >> https://na01.safelinks.protection.outlook.com/?url=
> http%3A%2F%2Fabout.me%2 <https://na01.safelinks.
> protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
> >> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com <http://40adobe.com/>%
> 7Cae539925833d453aaa2e08d5
> >> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%
> 7C636567454874235113&s
> >> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY1WVtz2xsNvc%3D&reserved=0
>
>

Re: Label

Posted by Harbs <ha...@gmail.com>.
I’m suggesting to change it because span does not fit the use case of Label. Width and truncate are just two applications which indicate that span is not the correct element. I’m pretty sure I had other edge cases which were likely effected by the fact that Label is a span, although I’m not positive.

I disagree with your distinction between span and div.

Both span and div can have children. Spans can contain divs and divs can contain spans. At its core, Span has nothing to do with text. It’s just often used for text because text (within its container) is inline.

MDN says[1] "<span> is very much like a <div> element, but <div> is a block-level element whereas a <span> is an inline element.”

Label is *not* necessarily an inline element. We have all kinds of layouts for Label. Many (most?) of them are not inline.

If you feel really strongly about this, I’ll revert even though I disagree.

FWIW, the truncate bead does not need to change the element type. It can explicitly set the display of the element to block.

Harbs

[1]https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span <https://developer.mozilla.org/en-US/docs/Web/HTML/Element/span>

> On Mar 15, 2018, at 11:25 PM, Alex Harui <ah...@adobe.com.INVALID> wrote:
> 
> Label in Flex and Royale is not intended to have any children (other than
> bold, italic and other text markup).  Span represents that.  Div does not.
> You are suggesting changing to div JUST IN CASE someone needs to set a
> width and/or truncate.  Just-in-case code is not PAYG.
> 
> My 2 cents,
> -Alex
> 
> On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com <ma...@gmail.com> on behalf of Carlos Rovira"
> <carlos.rovira@gmail.com <ma...@gmail.com> on behalf of carlosrovira@apache.org <ma...@apache.org>> wrote:
> 
>> And why not change IBeadView in Label for a view that uses a div when
>> needed? ;)
>> in the other cases, maintains the span
>> 
>> 2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
>> 
>>> I’m still not understanding you. What about Label says it’s a span
>>> instead
>>> of a div? Why is making it a div not PAYG? Span simply limits Label
>>> unnecessarily. I think span is not the appropriate element for Label.
>>> 
>>>> A Label without width should grow to the size of its text.  Isn't that
>>> how
>>>> it worked in Flex?
>>> 
>>> Sure, and a div does that too. In Flex, a label could have a width too
>>> if
>>> specified. Spans cannot.
>>> 
>>> Harbs
>>> 
>>>> On Mar 15, 2018, at 9:56 PM, Alex Harui <ah...@adobe.com.INVALID>
>>> wrote:
>>>> 
>>>> Have the truncation bead swap the span for div.  Again, some component
>>> has
>>>> to put a span in the DOM.  Label has been just fine for that so far.
>>>> 
>>>> A Label without width should grow to the size of its text.  Isn't that
>>> how
>>>> it worked in Flex?
>>>> 
>>>> Maybe Label should be refactored to not have width/height properties
>>> but
>>>> IMO we have bigger fish to fry.
>>>> 
>>>> I'm sure Div is used to wrap text in some frameworks, but those
>>> frameworks
>>>> probably aren't PAYG.  In Alina's app, Label has a usage score of 69,
>>> but
>>>> Label.width has a score of only 5.  We will have her use
>>>> LabelWithTruncation or add the truncation bead on the few labels that
>>> need
>>>> 
>>>> My 2 cents,
>>>> -Alex
>>>> 
>>>> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:
>>>> 
>>>>> But we already have a truncation bead. The only reason it doesn’t
>>> work
>>> in
>>>>> Label is because spans don’t have widths.
>>>>> 
>>>>> Label is not something which should flow beyond its bounds — which is
>>>>> what span is useful for. I still don’t see why you think span makes
>>> more
>>>>> sense.
>>>>> 
>>>>> FWIW, div *is* used as a container for text in various frameworks.
>>>>> 
>>>>> My $0.02,
>>>>> Harbs
>>>>> 
>>>>>> On Mar 15, 2018, at 9:42 PM, Alex Harui <ah...@adobe.com.INVALID>
>>>>>> wrote:
>>>>>> 
>>>>>> AIUI, "inline" is the default display style for Span.  "block" is
>>> the
>>>>>> default for Div.  HTML flows inline by default for just plain text.
>>>>>> Basic
>>>>>> components try to give Flex-friendly names for HTMLElements.  Some
>>>>>> component in Basic needs to inject a span into the DOM.  In a few
>>>>>> seconds
>>>>>> of looking at a Google web page, I did not see any divs with text as
>>>>>> children.  I saw spans.  The Divs all contained other elements.
>>>>>> 
>>>>>> I don't create HTML web pages for a living, but if I were to place a
>>>>>> label
>>>>>> over a control like I often see in Flex, I would not wrap the label
>>> in
>>> a
>>>>>> Div.  The control would be div, so I would us a span or just plain
>>> text.
>>>>>> If I looked at the final DOM and saw Divs around every chunk of
>>> text, I
>>>>>> would think there is something heavy about the framework.
>>>>>> 
>>>>>> Again, the goal is to encapsulate common patterns.  Label combined
>>> with
>>>>>> some control is trying to replicate common patterns for labeling
>>>>>> controls.
>>>>>> You are trying to solve the common pattern of truncating text.  That
>>>>>> will
>>>>>> require a Div. But truncation, or even width/height is not something
>>>>>> that
>>>>>> should be built into Label for PAYG reasons.  IMO, you should
>>> create a
>>>>>> different component with a different name.  TruncatingLabel, or
>>>>>> LabelWIthTruncation.
>>>>>> 
>>>>>> My 2 cents,
>>>>>> -Alex
>>>>>> 
>>>>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
>>>>>> 
>>>>>>> Why is span lighter than div?
>>>>>>> 
>>>>>>> Inline and nowrap is not specific to span. AFAICT, there’s nothing
>>>>>>> specific to snap which fits Label better than div.
>>>>>>> 
>>>>>>> As far as components which “does” span: Besides Span in HTML, we
>>> have
>>>>>>> HTMLText in Basic which encapsulates span.
>>>>>>> 
>>>>>>> I can revert the change I made to Label, but I have not seen any
>>>>>>> downside
>>>>>>> to using div for Label. It seems to me that there’s nothing in the
>>>>>>> Label
>>>>>>> promise which dictates using span.
>>>>>>> 
>>>>>>> Harbs
>>>>>>> 
>>>>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui <ah...@adobe.com.INVALID>
>>>>>>>> wrote:
>>>>>>>> 
>>>>>>>> 
>>>>>>>> 
>>>>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
>>>>>>>> 
>>>>>>>>> Gotcha. FWIW, we now have the HTML element component set which
>>> more
>>>>>>>>> thinly wraps HTML elements.
>>>>>>>>> 
>>>>>>>>> I can’t think of any reason why Label would be better as a span
>>> than
>>>>>>>>> a
>>>>>>>>> div. It seems to me that simply using div instead of span would
>>> make
>>>>>>>>> Label more versatile. Am I missing something?
>>>>>>>> 
>>>>>>>> You may be missing that the only real goal of Royale is to
>>> encapsulate
>>>>>>>> popular patterns.  Pretty sure I've seen span used on many web
>>> pages,
>>>>>>>> so
>>>>>>>> we need a component that does what it does, including assuming
>>> inline
>>>>>>>> instead of block display.  Similarly, what would you think of a
>>>>>>>> framework
>>>>>>>> that had a HelloWorld that used a div instead of a span?  You
>>> might
>>>>>>>> think
>>>>>>>> it is too heavy.
>>>>>>>> 
>>>>>>>> Per PAYG, if span doesn’t' support certain features, then you
>>> create
>>> a
>>>>>>>> LabelWithTruncation and have it use a Div if you need to.
>>>>>>>> 
>>>>>>>> My 2 cents,
>>>>>>>> -Alex
>>>>>>>>> 
>>>>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID>
>>>>>>>>>> wrote:
>>>>>>>>>> 
>>>>>>>>>> Label was one of the very first components and the idea was
>>>>>>>>>> minimalism.
>>>>>>>>>> Button was <button> and TextInput was <input type="text"> and
>>> Label
>>>>>>>>>> was
>>>>>>>>>> <span>.
>>>>>>>>>> 
>>>>>>>>>> I'm wondering if we should have NativeButton, NativeLabel, etc.
>>>>>>>>>> which
>>>>>>>>>> would be these minimal elements and have others that are <div>
>>>>>>>>>> wrapping.
>>>>>>>>>> For instance, ImageAndTextButton is a <button><img
>>>>>>>>>> src="goo.jpg">Label
>>>>>>>>>> Here</button> which works but the alignment is weird so maybe
>>>>>>>>>> ImageAndTextButton should be a <div><img>Text</div> which can be
>>>>>>>>>> aligned
>>>>>>>>>> and styled better.
>>>>>>>>>> 
>>>>>>>>>> Anyway, that's the reason: simplicity.
>>>>>>>>>> 
>>>>>>>>>> ‹peter
>>>>>>>>>> 
>>>>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>>>>>>>>>> 
>>>>>>>>>>> Is there a reason that the element type of Basic Label is span?
>>>>>>>>>>> 
>>>>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not
>>>>>>>>>>> seem
>>>>>>>>>>> to
>>>>>>>>>>> work because spans donąt really have a working width. Switching
>>> the
>>>>>>>>>>> element type to div seems to make it work.
>>>>>>>>>>> 
>>>>>>>>>>> Harbs
>>>>>>>>>> 
>>>>>>>>> 
>>>>>>>> 
>>>>>>> 
>>>>>> 
>>>>> 
>>>> 
>>> 
>>> 
>> 
>> 
>> -- 
>> Carlos Rovira
>> https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fabout.me%2 <https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fabout.me%2>
>> Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com <http://40adobe.com/>%7Cae539925833d453aaa2e08d5
>> 8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636567454874235113&s
>> data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY1WVtz2xsNvc%3D&reserved=0


Re: Label

Posted by Alex Harui <ah...@adobe.com.INVALID>.
Label in Flex and Royale is not intended to have any children (other than
bold, italic and other text markup).  Span represents that.  Div does not.
 You are suggesting changing to div JUST IN CASE someone needs to set a
width and/or truncate.  Just-in-case code is not PAYG.

My 2 cents,
-Alex

On 3/15/18, 2:17 PM, "carlos.rovira@gmail.com on behalf of Carlos Rovira"
<carlos.rovira@gmail.com on behalf of carlosrovira@apache.org> wrote:

>And why not change IBeadView in Label for a view that uses a div when
>needed? ;)
>in the other cases, maintains the span
>
>2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:
>
>> I’m still not understanding you. What about Label says it’s a span
>>instead
>> of a div? Why is making it a div not PAYG? Span simply limits Label
>> unnecessarily. I think span is not the appropriate element for Label.
>>
>> > A Label without width should grow to the size of its text.  Isn't that
>> how
>> > it worked in Flex?
>>
>> Sure, and a div does that too. In Flex, a label could have a width too
>>if
>> specified. Spans cannot.
>>
>> Harbs
>>
>> > On Mar 15, 2018, at 9:56 PM, Alex Harui <ah...@adobe.com.INVALID>
>> wrote:
>> >
>> > Have the truncation bead swap the span for div.  Again, some component
>> has
>> > to put a span in the DOM.  Label has been just fine for that so far.
>> >
>> > A Label without width should grow to the size of its text.  Isn't that
>> how
>> > it worked in Flex?
>> >
>> > Maybe Label should be refactored to not have width/height properties
>>but
>> > IMO we have bigger fish to fry.
>> >
>> > I'm sure Div is used to wrap text in some frameworks, but those
>> frameworks
>> > probably aren't PAYG.  In Alina's app, Label has a usage score of 69,
>>but
>> > Label.width has a score of only 5.  We will have her use
>> > LabelWithTruncation or add the truncation bead on the few labels that
>> need
>> >
>> > My 2 cents,
>> > -Alex
>> >
>> > On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:
>> >
>> >> But we already have a truncation bead. The only reason it doesn’t
>>work
>> in
>> >> Label is because spans don’t have widths.
>> >>
>> >> Label is not something which should flow beyond its bounds — which is
>> >> what span is useful for. I still don’t see why you think span makes
>>more
>> >> sense.
>> >>
>> >> FWIW, div *is* used as a container for text in various frameworks.
>> >>
>> >> My $0.02,
>> >> Harbs
>> >>
>> >>> On Mar 15, 2018, at 9:42 PM, Alex Harui <ah...@adobe.com.INVALID>
>> >>> wrote:
>> >>>
>> >>> AIUI, "inline" is the default display style for Span.  "block" is
>>the
>> >>> default for Div.  HTML flows inline by default for just plain text.
>> >>> Basic
>> >>> components try to give Flex-friendly names for HTMLElements.  Some
>> >>> component in Basic needs to inject a span into the DOM.  In a few
>> >>> seconds
>> >>> of looking at a Google web page, I did not see any divs with text as
>> >>> children.  I saw spans.  The Divs all contained other elements.
>> >>>
>> >>> I don't create HTML web pages for a living, but if I were to place a
>> >>> label
>> >>> over a control like I often see in Flex, I would not wrap the label
>>in
>> a
>> >>> Div.  The control would be div, so I would us a span or just plain
>> text.
>> >>> If I looked at the final DOM and saw Divs around every chunk of
>>text, I
>> >>> would think there is something heavy about the framework.
>> >>>
>> >>> Again, the goal is to encapsulate common patterns.  Label combined
>>with
>> >>> some control is trying to replicate common patterns for labeling
>> >>> controls.
>> >>> You are trying to solve the common pattern of truncating text.  That
>> >>> will
>> >>> require a Div. But truncation, or even width/height is not something
>> >>> that
>> >>> should be built into Label for PAYG reasons.  IMO, you should
>>create a
>> >>> different component with a different name.  TruncatingLabel, or
>> >>> LabelWIthTruncation.
>> >>>
>> >>> My 2 cents,
>> >>> -Alex
>> >>>
>> >>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
>> >>>
>> >>>> Why is span lighter than div?
>> >>>>
>> >>>> Inline and nowrap is not specific to span. AFAICT, there’s nothing
>> >>>> specific to snap which fits Label better than div.
>> >>>>
>> >>>> As far as components which “does” span: Besides Span in HTML, we
>>have
>> >>>> HTMLText in Basic which encapsulates span.
>> >>>>
>> >>>> I can revert the change I made to Label, but I have not seen any
>> >>>> downside
>> >>>> to using div for Label. It seems to me that there’s nothing in the
>> >>>> Label
>> >>>> promise which dictates using span.
>> >>>>
>> >>>> Harbs
>> >>>>
>> >>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui <ah...@adobe.com.INVALID>
>> >>>>> wrote:
>> >>>>>
>> >>>>>
>> >>>>>
>> >>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
>> >>>>>
>> >>>>>> Gotcha. FWIW, we now have the HTML element component set which
>>more
>> >>>>>> thinly wraps HTML elements.
>> >>>>>>
>> >>>>>> I can’t think of any reason why Label would be better as a span
>>than
>> >>>>>> a
>> >>>>>> div. It seems to me that simply using div instead of span would
>>make
>> >>>>>> Label more versatile. Am I missing something?
>> >>>>>
>> >>>>> You may be missing that the only real goal of Royale is to
>> encapsulate
>> >>>>> popular patterns.  Pretty sure I've seen span used on many web
>>pages,
>> >>>>> so
>> >>>>> we need a component that does what it does, including assuming
>>inline
>> >>>>> instead of block display.  Similarly, what would you think of a
>> >>>>> framework
>> >>>>> that had a HelloWorld that used a div instead of a span?  You
>>might
>> >>>>> think
>> >>>>> it is too heavy.
>> >>>>>
>> >>>>> Per PAYG, if span doesn’t' support certain features, then you
>>create
>> a
>> >>>>> LabelWithTruncation and have it use a Div if you need to.
>> >>>>>
>> >>>>> My 2 cents,
>> >>>>> -Alex
>> >>>>>>
>> >>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID>
>> >>>>>>> wrote:
>> >>>>>>>
>> >>>>>>> Label was one of the very first components and the idea was
>> >>>>>>> minimalism.
>> >>>>>>> Button was <button> and TextInput was <input type="text"> and
>>Label
>> >>>>>>> was
>> >>>>>>> <span>.
>> >>>>>>>
>> >>>>>>> I'm wondering if we should have NativeButton, NativeLabel, etc.
>> >>>>>>> which
>> >>>>>>> would be these minimal elements and have others that are <div>
>> >>>>>>> wrapping.
>> >>>>>>> For instance, ImageAndTextButton is a <button><img
>> >>>>>>> src="goo.jpg">Label
>> >>>>>>> Here</button> which works but the alignment is weird so maybe
>> >>>>>>> ImageAndTextButton should be a <div><img>Text</div> which can be
>> >>>>>>> aligned
>> >>>>>>> and styled better.
>> >>>>>>>
>> >>>>>>> Anyway, that's the reason: simplicity.
>> >>>>>>>
>> >>>>>>> ‹peter
>> >>>>>>>
>> >>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>> >>>>>>>
>> >>>>>>>> Is there a reason that the element type of Basic Label is span?
>> >>>>>>>>
>> >>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not
>> >>>>>>>> seem
>> >>>>>>>> to
>> >>>>>>>> work because spans donąt really have a working width. Switching
>> the
>> >>>>>>>> element type to div seems to make it work.
>> >>>>>>>>
>> >>>>>>>> Harbs
>> >>>>>>>
>> >>>>>>
>> >>>>>
>> >>>>
>> >>>
>> >>
>> >
>>
>>
>
>
>-- 
>Carlos Rovira
>https://na01.safelinks.protection.outlook.com/?url=http%3A%2F%2Fabout.me%2
>Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com%7Cae539925833d453aaa2e08d5
>8aba29c4%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C636567454874235113&s
>data=Xvu%2BZ7186rOBNg5j0KrJsGPi5O4YnwiY1WVtz2xsNvc%3D&reserved=0


Re: Label

Posted by Carlos Rovira <ca...@apache.org>.
And why not change IBeadView in Label for a view that uses a div when
needed? ;)
in the other cases, maintains the span

2018-03-15 21:05 GMT+01:00 Harbs <ha...@gmail.com>:

> I’m still not understanding you. What about Label says it’s a span instead
> of a div? Why is making it a div not PAYG? Span simply limits Label
> unnecessarily. I think span is not the appropriate element for Label.
>
> > A Label without width should grow to the size of its text.  Isn't that
> how
> > it worked in Flex?
>
> Sure, and a div does that too. In Flex, a label could have a width too if
> specified. Spans cannot.
>
> Harbs
>
> > On Mar 15, 2018, at 9:56 PM, Alex Harui <ah...@adobe.com.INVALID>
> wrote:
> >
> > Have the truncation bead swap the span for div.  Again, some component
> has
> > to put a span in the DOM.  Label has been just fine for that so far.
> >
> > A Label without width should grow to the size of its text.  Isn't that
> how
> > it worked in Flex?
> >
> > Maybe Label should be refactored to not have width/height properties but
> > IMO we have bigger fish to fry.
> >
> > I'm sure Div is used to wrap text in some frameworks, but those
> frameworks
> > probably aren't PAYG.  In Alina's app, Label has a usage score of 69, but
> > Label.width has a score of only 5.  We will have her use
> > LabelWithTruncation or add the truncation bead on the few labels that
> need
> >
> > My 2 cents,
> > -Alex
> >
> > On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:
> >
> >> But we already have a truncation bead. The only reason it doesn’t work
> in
> >> Label is because spans don’t have widths.
> >>
> >> Label is not something which should flow beyond its bounds — which is
> >> what span is useful for. I still don’t see why you think span makes more
> >> sense.
> >>
> >> FWIW, div *is* used as a container for text in various frameworks.
> >>
> >> My $0.02,
> >> Harbs
> >>
> >>> On Mar 15, 2018, at 9:42 PM, Alex Harui <ah...@adobe.com.INVALID>
> >>> wrote:
> >>>
> >>> AIUI, "inline" is the default display style for Span.  "block" is the
> >>> default for Div.  HTML flows inline by default for just plain text.
> >>> Basic
> >>> components try to give Flex-friendly names for HTMLElements.  Some
> >>> component in Basic needs to inject a span into the DOM.  In a few
> >>> seconds
> >>> of looking at a Google web page, I did not see any divs with text as
> >>> children.  I saw spans.  The Divs all contained other elements.
> >>>
> >>> I don't create HTML web pages for a living, but if I were to place a
> >>> label
> >>> over a control like I often see in Flex, I would not wrap the label in
> a
> >>> Div.  The control would be div, so I would us a span or just plain
> text.
> >>> If I looked at the final DOM and saw Divs around every chunk of text, I
> >>> would think there is something heavy about the framework.
> >>>
> >>> Again, the goal is to encapsulate common patterns.  Label combined with
> >>> some control is trying to replicate common patterns for labeling
> >>> controls.
> >>> You are trying to solve the common pattern of truncating text.  That
> >>> will
> >>> require a Div. But truncation, or even width/height is not something
> >>> that
> >>> should be built into Label for PAYG reasons.  IMO, you should create a
> >>> different component with a different name.  TruncatingLabel, or
> >>> LabelWIthTruncation.
> >>>
> >>> My 2 cents,
> >>> -Alex
> >>>
> >>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
> >>>
> >>>> Why is span lighter than div?
> >>>>
> >>>> Inline and nowrap is not specific to span. AFAICT, there’s nothing
> >>>> specific to snap which fits Label better than div.
> >>>>
> >>>> As far as components which “does” span: Besides Span in HTML, we have
> >>>> HTMLText in Basic which encapsulates span.
> >>>>
> >>>> I can revert the change I made to Label, but I have not seen any
> >>>> downside
> >>>> to using div for Label. It seems to me that there’s nothing in the
> >>>> Label
> >>>> promise which dictates using span.
> >>>>
> >>>> Harbs
> >>>>
> >>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui <ah...@adobe.com.INVALID>
> >>>>> wrote:
> >>>>>
> >>>>>
> >>>>>
> >>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
> >>>>>
> >>>>>> Gotcha. FWIW, we now have the HTML element component set which more
> >>>>>> thinly wraps HTML elements.
> >>>>>>
> >>>>>> I can’t think of any reason why Label would be better as a span than
> >>>>>> a
> >>>>>> div. It seems to me that simply using div instead of span would make
> >>>>>> Label more versatile. Am I missing something?
> >>>>>
> >>>>> You may be missing that the only real goal of Royale is to
> encapsulate
> >>>>> popular patterns.  Pretty sure I've seen span used on many web pages,
> >>>>> so
> >>>>> we need a component that does what it does, including assuming inline
> >>>>> instead of block display.  Similarly, what would you think of a
> >>>>> framework
> >>>>> that had a HelloWorld that used a div instead of a span?  You might
> >>>>> think
> >>>>> it is too heavy.
> >>>>>
> >>>>> Per PAYG, if span doesn’t' support certain features, then you create
> a
> >>>>> LabelWithTruncation and have it use a Div if you need to.
> >>>>>
> >>>>> My 2 cents,
> >>>>> -Alex
> >>>>>>
> >>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID>
> >>>>>>> wrote:
> >>>>>>>
> >>>>>>> Label was one of the very first components and the idea was
> >>>>>>> minimalism.
> >>>>>>> Button was <button> and TextInput was <input type="text"> and Label
> >>>>>>> was
> >>>>>>> <span>.
> >>>>>>>
> >>>>>>> I'm wondering if we should have NativeButton, NativeLabel, etc.
> >>>>>>> which
> >>>>>>> would be these minimal elements and have others that are <div>
> >>>>>>> wrapping.
> >>>>>>> For instance, ImageAndTextButton is a <button><img
> >>>>>>> src="goo.jpg">Label
> >>>>>>> Here</button> which works but the alignment is weird so maybe
> >>>>>>> ImageAndTextButton should be a <div><img>Text</div> which can be
> >>>>>>> aligned
> >>>>>>> and styled better.
> >>>>>>>
> >>>>>>> Anyway, that's the reason: simplicity.
> >>>>>>>
> >>>>>>> ‹peter
> >>>>>>>
> >>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
> >>>>>>>
> >>>>>>>> Is there a reason that the element type of Basic Label is span?
> >>>>>>>>
> >>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not
> >>>>>>>> seem
> >>>>>>>> to
> >>>>>>>> work because spans donąt really have a working width. Switching
> the
> >>>>>>>> element type to div seems to make it work.
> >>>>>>>>
> >>>>>>>> Harbs
> >>>>>>>
> >>>>>>
> >>>>>
> >>>>
> >>>
> >>
> >
>
>


-- 
Carlos Rovira
http://about.me/carlosrovira

Re: Label

Posted by Harbs <ha...@gmail.com>.
I’m still not understanding you. What about Label says it’s a span instead of a div? Why is making it a div not PAYG? Span simply limits Label unnecessarily. I think span is not the appropriate element for Label.

> A Label without width should grow to the size of its text.  Isn't that how
> it worked in Flex?

Sure, and a div does that too. In Flex, a label could have a width too if specified. Spans cannot.

Harbs

> On Mar 15, 2018, at 9:56 PM, Alex Harui <ah...@adobe.com.INVALID> wrote:
> 
> Have the truncation bead swap the span for div.  Again, some component has
> to put a span in the DOM.  Label has been just fine for that so far.
> 
> A Label without width should grow to the size of its text.  Isn't that how
> it worked in Flex?
> 
> Maybe Label should be refactored to not have width/height properties but
> IMO we have bigger fish to fry.
> 
> I'm sure Div is used to wrap text in some frameworks, but those frameworks
> probably aren't PAYG.  In Alina's app, Label has a usage score of 69, but
> Label.width has a score of only 5.  We will have her use
> LabelWithTruncation or add the truncation bead on the few labels that need
> 
> My 2 cents,
> -Alex
> 
> On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:
> 
>> But we already have a truncation bead. The only reason it doesn’t work in
>> Label is because spans don’t have widths.
>> 
>> Label is not something which should flow beyond its bounds — which is
>> what span is useful for. I still don’t see why you think span makes more
>> sense.
>> 
>> FWIW, div *is* used as a container for text in various frameworks.
>> 
>> My $0.02,
>> Harbs
>> 
>>> On Mar 15, 2018, at 9:42 PM, Alex Harui <ah...@adobe.com.INVALID>
>>> wrote:
>>> 
>>> AIUI, "inline" is the default display style for Span.  "block" is the
>>> default for Div.  HTML flows inline by default for just plain text.
>>> Basic
>>> components try to give Flex-friendly names for HTMLElements.  Some
>>> component in Basic needs to inject a span into the DOM.  In a few
>>> seconds
>>> of looking at a Google web page, I did not see any divs with text as
>>> children.  I saw spans.  The Divs all contained other elements.
>>> 
>>> I don't create HTML web pages for a living, but if I were to place a
>>> label
>>> over a control like I often see in Flex, I would not wrap the label in a
>>> Div.  The control would be div, so I would us a span or just plain text.
>>> If I looked at the final DOM and saw Divs around every chunk of text, I
>>> would think there is something heavy about the framework.
>>> 
>>> Again, the goal is to encapsulate common patterns.  Label combined with
>>> some control is trying to replicate common patterns for labeling
>>> controls.
>>> You are trying to solve the common pattern of truncating text.  That
>>> will
>>> require a Div. But truncation, or even width/height is not something
>>> that
>>> should be built into Label for PAYG reasons.  IMO, you should create a
>>> different component with a different name.  TruncatingLabel, or
>>> LabelWIthTruncation.
>>> 
>>> My 2 cents,
>>> -Alex
>>> 
>>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
>>> 
>>>> Why is span lighter than div?
>>>> 
>>>> Inline and nowrap is not specific to span. AFAICT, there’s nothing
>>>> specific to snap which fits Label better than div.
>>>> 
>>>> As far as components which “does” span: Besides Span in HTML, we have
>>>> HTMLText in Basic which encapsulates span.
>>>> 
>>>> I can revert the change I made to Label, but I have not seen any
>>>> downside
>>>> to using div for Label. It seems to me that there’s nothing in the
>>>> Label
>>>> promise which dictates using span.
>>>> 
>>>> Harbs
>>>> 
>>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui <ah...@adobe.com.INVALID>
>>>>> wrote:
>>>>> 
>>>>> 
>>>>> 
>>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
>>>>> 
>>>>>> Gotcha. FWIW, we now have the HTML element component set which more
>>>>>> thinly wraps HTML elements.
>>>>>> 
>>>>>> I can’t think of any reason why Label would be better as a span than
>>>>>> a
>>>>>> div. It seems to me that simply using div instead of span would make
>>>>>> Label more versatile. Am I missing something?
>>>>> 
>>>>> You may be missing that the only real goal of Royale is to encapsulate
>>>>> popular patterns.  Pretty sure I've seen span used on many web pages,
>>>>> so
>>>>> we need a component that does what it does, including assuming inline
>>>>> instead of block display.  Similarly, what would you think of a
>>>>> framework
>>>>> that had a HelloWorld that used a div instead of a span?  You might
>>>>> think
>>>>> it is too heavy.
>>>>> 
>>>>> Per PAYG, if span doesn’t' support certain features, then you create a
>>>>> LabelWithTruncation and have it use a Div if you need to.
>>>>> 
>>>>> My 2 cents,
>>>>> -Alex
>>>>>> 
>>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID>
>>>>>>> wrote:
>>>>>>> 
>>>>>>> Label was one of the very first components and the idea was
>>>>>>> minimalism.
>>>>>>> Button was <button> and TextInput was <input type="text"> and Label
>>>>>>> was
>>>>>>> <span>. 
>>>>>>> 
>>>>>>> I'm wondering if we should have NativeButton, NativeLabel, etc.
>>>>>>> which
>>>>>>> would be these minimal elements and have others that are <div>
>>>>>>> wrapping.
>>>>>>> For instance, ImageAndTextButton is a <button><img
>>>>>>> src="goo.jpg">Label
>>>>>>> Here</button> which works but the alignment is weird so maybe
>>>>>>> ImageAndTextButton should be a <div><img>Text</div> which can be
>>>>>>> aligned
>>>>>>> and styled better.
>>>>>>> 
>>>>>>> Anyway, that's the reason: simplicity.
>>>>>>> 
>>>>>>> ‹peter
>>>>>>> 
>>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>>>>>>> 
>>>>>>>> Is there a reason that the element type of Basic Label is span?
>>>>>>>> 
>>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not
>>>>>>>> seem
>>>>>>>> to
>>>>>>>> work because spans donąt really have a working width. Switching the
>>>>>>>> element type to div seems to make it work.
>>>>>>>> 
>>>>>>>> Harbs
>>>>>>> 
>>>>>> 
>>>>> 
>>>> 
>>> 
>> 
> 


Re: Label

Posted by Alex Harui <ah...@adobe.com.INVALID>.
Have the truncation bead swap the span for div.  Again, some component has
to put a span in the DOM.  Label has been just fine for that so far.

A Label without width should grow to the size of its text.  Isn't that how
it worked in Flex?

Maybe Label should be refactored to not have width/height properties but
IMO we have bigger fish to fry.

I'm sure Div is used to wrap text in some frameworks, but those frameworks
probably aren't PAYG.  In Alina's app, Label has a usage score of 69, but
Label.width has a score of only 5.  We will have her use
LabelWithTruncation or add the truncation bead on the few labels that need

My 2 cents,
-Alex

On 3/15/18, 12:45 PM, "Harbs" <ha...@gmail.com> wrote:

>But we already have a truncation bead. The only reason it doesn’t work in
>Label is because spans don’t have widths.
>
>Label is not something which should flow beyond its bounds — which is
>what span is useful for. I still don’t see why you think span makes more
>sense.
>
>FWIW, div *is* used as a container for text in various frameworks.
>
>My $0.02,
>Harbs
>
>> On Mar 15, 2018, at 9:42 PM, Alex Harui <ah...@adobe.com.INVALID>
>>wrote:
>> 
>> AIUI, "inline" is the default display style for Span.  "block" is the
>> default for Div.  HTML flows inline by default for just plain text.
>>Basic
>> components try to give Flex-friendly names for HTMLElements.  Some
>> component in Basic needs to inject a span into the DOM.  In a few
>>seconds
>> of looking at a Google web page, I did not see any divs with text as
>> children.  I saw spans.  The Divs all contained other elements.
>> 
>> I don't create HTML web pages for a living, but if I were to place a
>>label
>> over a control like I often see in Flex, I would not wrap the label in a
>> Div.  The control would be div, so I would us a span or just plain text.
>> If I looked at the final DOM and saw Divs around every chunk of text, I
>> would think there is something heavy about the framework.
>> 
>> Again, the goal is to encapsulate common patterns.  Label combined with
>> some control is trying to replicate common patterns for labeling
>>controls.
>> You are trying to solve the common pattern of truncating text.  That
>>will
>> require a Div. But truncation, or even width/height is not something
>>that
>> should be built into Label for PAYG reasons.  IMO, you should create a
>> different component with a different name.  TruncatingLabel, or
>> LabelWIthTruncation.
>> 
>> My 2 cents,
>> -Alex
>> 
>> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
>> 
>>> Why is span lighter than div?
>>> 
>>> Inline and nowrap is not specific to span. AFAICT, there’s nothing
>>> specific to snap which fits Label better than div.
>>> 
>>> As far as components which “does” span: Besides Span in HTML, we have
>>> HTMLText in Basic which encapsulates span.
>>> 
>>> I can revert the change I made to Label, but I have not seen any
>>>downside
>>> to using div for Label. It seems to me that there’s nothing in the
>>>Label
>>> promise which dictates using span.
>>> 
>>> Harbs
>>> 
>>>> On Mar 15, 2018, at 6:55 PM, Alex Harui <ah...@adobe.com.INVALID>
>>>> wrote:
>>>> 
>>>> 
>>>> 
>>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
>>>> 
>>>>> Gotcha. FWIW, we now have the HTML element component set which more
>>>>> thinly wraps HTML elements.
>>>>> 
>>>>> I can’t think of any reason why Label would be better as a span than
>>>>>a
>>>>> div. It seems to me that simply using div instead of span would make
>>>>> Label more versatile. Am I missing something?
>>>> 
>>>> You may be missing that the only real goal of Royale is to encapsulate
>>>> popular patterns.  Pretty sure I've seen span used on many web pages,
>>>>so
>>>> we need a component that does what it does, including assuming inline
>>>> instead of block display.  Similarly, what would you think of a
>>>> framework
>>>> that had a HelloWorld that used a div instead of a span?  You might
>>>> think
>>>> it is too heavy.
>>>> 
>>>> Per PAYG, if span doesn’t' support certain features, then you create a
>>>> LabelWithTruncation and have it use a Div if you need to.
>>>> 
>>>> My 2 cents,
>>>> -Alex
>>>>> 
>>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID>
>>>>>>wrote:
>>>>>> 
>>>>>> Label was one of the very first components and the idea was
>>>>>> minimalism.
>>>>>> Button was <button> and TextInput was <input type="text"> and Label
>>>>>> was
>>>>>> <span>. 
>>>>>> 
>>>>>> I'm wondering if we should have NativeButton, NativeLabel, etc.
>>>>>>which
>>>>>> would be these minimal elements and have others that are <div>
>>>>>> wrapping.
>>>>>> For instance, ImageAndTextButton is a <button><img
>>>>>>src="goo.jpg">Label
>>>>>> Here</button> which works but the alignment is weird so maybe
>>>>>> ImageAndTextButton should be a <div><img>Text</div> which can be
>>>>>> aligned
>>>>>> and styled better.
>>>>>> 
>>>>>> Anyway, that's the reason: simplicity.
>>>>>> 
>>>>>> ‹peter
>>>>>> 
>>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>>>>>> 
>>>>>>> Is there a reason that the element type of Basic Label is span?
>>>>>>> 
>>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not
>>>>>>>seem
>>>>>>> to
>>>>>>> work because spans donąt really have a working width. Switching the
>>>>>>> element type to div seems to make it work.
>>>>>>> 
>>>>>>> Harbs
>>>>>> 
>>>>> 
>>>> 
>>> 
>> 
>


Re: Label

Posted by Harbs <ha...@gmail.com>.
But we already have a truncation bead. The only reason it doesn’t work in Label is because spans don’t have widths.

Label is not something which should flow beyond its bounds — which is what span is useful for. I still don’t see why you think span makes more sense.

FWIW, div *is* used as a container for text in various frameworks.

My $0.02,
Harbs

> On Mar 15, 2018, at 9:42 PM, Alex Harui <ah...@adobe.com.INVALID> wrote:
> 
> AIUI, "inline" is the default display style for Span.  "block" is the
> default for Div.  HTML flows inline by default for just plain text.  Basic
> components try to give Flex-friendly names for HTMLElements.  Some
> component in Basic needs to inject a span into the DOM.  In a few seconds
> of looking at a Google web page, I did not see any divs with text as
> children.  I saw spans.  The Divs all contained other elements.
> 
> I don't create HTML web pages for a living, but if I were to place a label
> over a control like I often see in Flex, I would not wrap the label in a
> Div.  The control would be div, so I would us a span or just plain text.
> If I looked at the final DOM and saw Divs around every chunk of text, I
> would think there is something heavy about the framework.
> 
> Again, the goal is to encapsulate common patterns.  Label combined with
> some control is trying to replicate common patterns for labeling controls.
> You are trying to solve the common pattern of truncating text.  That will
> require a Div. But truncation, or even width/height is not something that
> should be built into Label for PAYG reasons.  IMO, you should create a
> different component with a different name.  TruncatingLabel, or
> LabelWIthTruncation.
> 
> My 2 cents,
> -Alex
> 
> On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:
> 
>> Why is span lighter than div?
>> 
>> Inline and nowrap is not specific to span. AFAICT, there’s nothing
>> specific to snap which fits Label better than div.
>> 
>> As far as components which “does” span: Besides Span in HTML, we have
>> HTMLText in Basic which encapsulates span.
>> 
>> I can revert the change I made to Label, but I have not seen any downside
>> to using div for Label. It seems to me that there’s nothing in the Label
>> promise which dictates using span.
>> 
>> Harbs
>> 
>>> On Mar 15, 2018, at 6:55 PM, Alex Harui <ah...@adobe.com.INVALID>
>>> wrote:
>>> 
>>> 
>>> 
>>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
>>> 
>>>> Gotcha. FWIW, we now have the HTML element component set which more
>>>> thinly wraps HTML elements.
>>>> 
>>>> I can’t think of any reason why Label would be better as a span than a
>>>> div. It seems to me that simply using div instead of span would make
>>>> Label more versatile. Am I missing something?
>>> 
>>> You may be missing that the only real goal of Royale is to encapsulate
>>> popular patterns.  Pretty sure I've seen span used on many web pages, so
>>> we need a component that does what it does, including assuming inline
>>> instead of block display.  Similarly, what would you think of a
>>> framework
>>> that had a HelloWorld that used a div instead of a span?  You might
>>> think
>>> it is too heavy.
>>> 
>>> Per PAYG, if span doesn’t' support certain features, then you create a
>>> LabelWithTruncation and have it use a Div if you need to.
>>> 
>>> My 2 cents,
>>> -Alex
>>>> 
>>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID> wrote:
>>>>> 
>>>>> Label was one of the very first components and the idea was
>>>>> minimalism.
>>>>> Button was <button> and TextInput was <input type="text"> and Label
>>>>> was
>>>>> <span>. 
>>>>> 
>>>>> I'm wondering if we should have NativeButton, NativeLabel, etc. which
>>>>> would be these minimal elements and have others that are <div>
>>>>> wrapping.
>>>>> For instance, ImageAndTextButton is a <button><img src="goo.jpg">Label
>>>>> Here</button> which works but the alignment is weird so maybe
>>>>> ImageAndTextButton should be a <div><img>Text</div> which can be
>>>>> aligned
>>>>> and styled better.
>>>>> 
>>>>> Anyway, that's the reason: simplicity.
>>>>> 
>>>>> ‹peter
>>>>> 
>>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>>>>> 
>>>>>> Is there a reason that the element type of Basic Label is span?
>>>>>> 
>>>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not seem
>>>>>> to
>>>>>> work because spans donąt really have a working width. Switching the
>>>>>> element type to div seems to make it work.
>>>>>> 
>>>>>> Harbs
>>>>> 
>>>> 
>>> 
>> 
> 


Re: Label

Posted by Alex Harui <ah...@adobe.com.INVALID>.
AIUI, "inline" is the default display style for Span.  "block" is the
default for Div.  HTML flows inline by default for just plain text.  Basic
components try to give Flex-friendly names for HTMLElements.  Some
component in Basic needs to inject a span into the DOM.  In a few seconds
of looking at a Google web page, I did not see any divs with text as
children.  I saw spans.  The Divs all contained other elements.

I don't create HTML web pages for a living, but if I were to place a label
over a control like I often see in Flex, I would not wrap the label in a
Div.  The control would be div, so I would us a span or just plain text.
If I looked at the final DOM and saw Divs around every chunk of text, I
would think there is something heavy about the framework.

Again, the goal is to encapsulate common patterns.  Label combined with
some control is trying to replicate common patterns for labeling controls.
 You are trying to solve the common pattern of truncating text.  That will
require a Div. But truncation, or even width/height is not something that
should be built into Label for PAYG reasons.  IMO, you should create a
different component with a different name.  TruncatingLabel, or
LabelWIthTruncation.

My 2 cents,
-Alex

On 3/15/18, 12:19 PM, "Harbs" <ha...@gmail.com> wrote:

>Why is span lighter than div?
>
>Inline and nowrap is not specific to span. AFAICT, there’s nothing
>specific to snap which fits Label better than div.
>
>As far as components which “does” span: Besides Span in HTML, we have
>HTMLText in Basic which encapsulates span.
>
>I can revert the change I made to Label, but I have not seen any downside
>to using div for Label. It seems to me that there’s nothing in the Label
>promise which dictates using span.
>
>Harbs
>
>> On Mar 15, 2018, at 6:55 PM, Alex Harui <ah...@adobe.com.INVALID>
>>wrote:
>> 
>> 
>> 
>> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
>> 
>>> Gotcha. FWIW, we now have the HTML element component set which more
>>> thinly wraps HTML elements.
>>> 
>>> I can’t think of any reason why Label would be better as a span than a
>>> div. It seems to me that simply using div instead of span would make
>>> Label more versatile. Am I missing something?
>> 
>> You may be missing that the only real goal of Royale is to encapsulate
>> popular patterns.  Pretty sure I've seen span used on many web pages, so
>> we need a component that does what it does, including assuming inline
>> instead of block display.  Similarly, what would you think of a
>>framework
>> that had a HelloWorld that used a div instead of a span?  You might
>>think
>> it is too heavy.
>> 
>> Per PAYG, if span doesn’t' support certain features, then you create a
>> LabelWithTruncation and have it use a Div if you need to.
>> 
>> My 2 cents,
>> -Alex
>>> 
>>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID> wrote:
>>>> 
>>>> Label was one of the very first components and the idea was
>>>>minimalism.
>>>> Button was <button> and TextInput was <input type="text"> and Label
>>>>was
>>>> <span>. 
>>>> 
>>>> I'm wondering if we should have NativeButton, NativeLabel, etc. which
>>>> would be these minimal elements and have others that are <div>
>>>>wrapping.
>>>> For instance, ImageAndTextButton is a <button><img src="goo.jpg">Label
>>>> Here</button> which works but the alignment is weird so maybe
>>>> ImageAndTextButton should be a <div><img>Text</div> which can be
>>>>aligned
>>>> and styled better.
>>>> 
>>>> Anyway, that's the reason: simplicity.
>>>> 
>>>> ‹peter
>>>> 
>>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>>>> 
>>>>> Is there a reason that the element type of Basic Label is span?
>>>>> 
>>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not seem
>>>>>to
>>>>> work because spans donąt really have a working width. Switching the
>>>>> element type to div seems to make it work.
>>>>> 
>>>>> Harbs
>>>> 
>>> 
>> 
>


Re: Label

Posted by Harbs <ha...@gmail.com>.
Why is span lighter than div?

Inline and nowrap is not specific to span. AFAICT, there’s nothing specific to snap which fits Label better than div.

As far as components which “does” span: Besides Span in HTML, we have HTMLText in Basic which encapsulates span.

I can revert the change I made to Label, but I have not seen any downside to using div for Label. It seems to me that there’s nothing in the Label promise which dictates using span.

Harbs

> On Mar 15, 2018, at 6:55 PM, Alex Harui <ah...@adobe.com.INVALID> wrote:
> 
> 
> 
> On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:
> 
>> Gotcha. FWIW, we now have the HTML element component set which more
>> thinly wraps HTML elements.
>> 
>> I can’t think of any reason why Label would be better as a span than a
>> div. It seems to me that simply using div instead of span would make
>> Label more versatile. Am I missing something?
> 
> You may be missing that the only real goal of Royale is to encapsulate
> popular patterns.  Pretty sure I've seen span used on many web pages, so
> we need a component that does what it does, including assuming inline
> instead of block display.  Similarly, what would you think of a framework
> that had a HelloWorld that used a div instead of a span?  You might think
> it is too heavy.
> 
> Per PAYG, if span doesn’t' support certain features, then you create a
> LabelWithTruncation and have it use a Div if you need to.
> 
> My 2 cents,
> -Alex
>> 
>>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID> wrote:
>>> 
>>> Label was one of the very first components and the idea was minimalism.
>>> Button was <button> and TextInput was <input type="text"> and Label was
>>> <span>. 
>>> 
>>> I'm wondering if we should have NativeButton, NativeLabel, etc. which
>>> would be these minimal elements and have others that are <div> wrapping.
>>> For instance, ImageAndTextButton is a <button><img src="goo.jpg">Label
>>> Here</button> which works but the alignment is weird so maybe
>>> ImageAndTextButton should be a <div><img>Text</div> which can be aligned
>>> and styled better.
>>> 
>>> Anyway, that's the reason: simplicity.
>>> 
>>> ‹peter
>>> 
>>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>>> 
>>>> Is there a reason that the element type of Basic Label is span?
>>>> 
>>>> I tried adding a łTextOverflow˛ bead to a Label and it does not seem to
>>>> work because spans donąt really have a working width. Switching the
>>>> element type to div seems to make it work.
>>>> 
>>>> Harbs
>>> 
>> 
> 


Re: Label

Posted by Alex Harui <ah...@adobe.com.INVALID>.

On 3/15/18, 5:34 AM, "Harbs" <ha...@gmail.com> wrote:

>Gotcha. FWIW, we now have the HTML element component set which more
>thinly wraps HTML elements.
>
>I can’t think of any reason why Label would be better as a span than a
>div. It seems to me that simply using div instead of span would make
>Label more versatile. Am I missing something?

You may be missing that the only real goal of Royale is to encapsulate
popular patterns.  Pretty sure I've seen span used on many web pages, so
we need a component that does what it does, including assuming inline
instead of block display.  Similarly, what would you think of a framework
that had a HelloWorld that used a div instead of a span?  You might think
it is too heavy.

Per PAYG, if span doesn’t' support certain features, then you create a
LabelWithTruncation and have it use a Div if you need to.

My 2 cents,
-Alex
>
>> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID> wrote:
>> 
>> Label was one of the very first components and the idea was minimalism.
>> Button was <button> and TextInput was <input type="text"> and Label was
>> <span>. 
>> 
>> I'm wondering if we should have NativeButton, NativeLabel, etc. which
>> would be these minimal elements and have others that are <div> wrapping.
>> For instance, ImageAndTextButton is a <button><img src="goo.jpg">Label
>> Here</button> which works but the alignment is weird so maybe
>> ImageAndTextButton should be a <div><img>Text</div> which can be aligned
>> and styled better.
>> 
>> Anyway, that's the reason: simplicity.
>> 
>> ‹peter
>> 
>> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
>> 
>>> Is there a reason that the element type of Basic Label is span?
>>> 
>>> I tried adding a łTextOverflow˛ bead to a Label and it does not seem to
>>> work because spans donąt really have a working width. Switching the
>>> element type to div seems to make it work.
>>> 
>>> Harbs
>> 
>


Re: Label

Posted by Harbs <ha...@gmail.com>.
Gotcha. FWIW, we now have the HTML element component set which more thinly wraps HTML elements.

I can’t think of any reason why Label would be better as a span than a div. It seems to me that simply using div instead of span would make Label more versatile. Am I missing something?

> On Mar 15, 2018, at 2:30 PM, Peter Ent <pe...@adobe.com.INVALID> wrote:
> 
> Label was one of the very first components and the idea was minimalism.
> Button was <button> and TextInput was <input type="text"> and Label was
> <span>. 
> 
> I'm wondering if we should have NativeButton, NativeLabel, etc. which
> would be these minimal elements and have others that are <div> wrapping.
> For instance, ImageAndTextButton is a <button><img src="goo.jpg">Label
> Here</button> which works but the alignment is weird so maybe
> ImageAndTextButton should be a <div><img>Text</div> which can be aligned
> and styled better.
> 
> Anyway, that's the reason: simplicity.
> 
> ‹peter
> 
> On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:
> 
>> Is there a reason that the element type of Basic Label is span?
>> 
>> I tried adding a łTextOverflow˛ bead to a Label and it does not seem to
>> work because spans donąt really have a working width. Switching the
>> element type to div seems to make it work.
>> 
>> Harbs
> 


Re: Label

Posted by Peter Ent <pe...@adobe.com.INVALID>.
Label was one of the very first components and the idea was minimalism.
Button was <button> and TextInput was <input type="text"> and Label was
<span>. 

I'm wondering if we should have NativeButton, NativeLabel, etc. which
would be these minimal elements and have others that are <div> wrapping.
For instance, ImageAndTextButton is a <button><img src="goo.jpg">Label
Here</button> which works but the alignment is weird so maybe
ImageAndTextButton should be a <div><img>Text</div> which can be aligned
and styled better.

Anyway, that's the reason: simplicity.

‹peter

On 3/15/18, 7:51 AM, "Harbs" <ha...@gmail.com> wrote:

>Is there a reason that the element type of Basic Label is span?
>
>I tried adding a ³TextOverflow² bead to a Label and it does not seem to
>work because spans don¹t really have a working width. Switching the
>element type to div seems to make it work.
>
>Harbs