serializing dataframe values to contextual html

when serializing a dataframe we need several serializations

%% 
1. the series comprosing a dataframe contains type and object information,
colorless and colorful forms. this information needs to be transformed to many strings.

        flowchart =\
```mermaid
flowchart LR
    dataframe --> series
    series --> value
    series --> dtype
```

2. at the value level, we need to dispatch on the `dtype` or the `type`.

        flowchart +=\
```mermaid
    dtype --> value
    type --> value
```

3. for each value may need to create 3 different representations for a single `value`.
for example, a `time` value will separate attribute and css representations

        time = pandas.to_datetime("now")
attribute
: {{time.isoformat()}}

css
: {{time.timestamp()}}

with the attribute being reused in the overall html representation.

tag/element
: `<time datetime="{{time.isoformat()}}">{{time.strftime("%Y-%m-%d")}}</time>`

        flowchart +=\
```mermaid
    value --&gt; tag
    attribute --&gt; tag
    value --&gt; attribute
    value --&gt; s[style]
    s[style] --&gt; attribute
```

1. the series comprosing a dataframe contains type and object information, colorless and colorful forms. this information needs to be transformed to many strings.

    flowchart =\
   

flowchart LR
    dataframe --> series
    series --> value
    series --> dtype

2. at the value level, we need to dispatch on the dtype or the type.

    flowchart +=\
   

    dtype --> value
    type --> value

3. for each value may need to create 3 different representations for a single value. for example, a time value will separate attribute and css representations

    time = pandas.to_datetime("now")
   

attribute

2024-09-13T21:55:37.458285

css

1726264537.458285

with the attribute being reused in the overall html representation.

tag/element

<time datetime="2024-09-13T21:55:37.458285">2024-09-13</time>

  flowchart +=\

    value --> tag
    attribute --> tag
    value --> attribute
    value --> s[style]
    s[style] --> attribute

    Mermaid(flowchart)

flowchart LR
    dataframe --> series
    series --> value
    series --> dtype
dtype --> value
type --> value
value --> tag
attribute --> tag
value --> attribute
value --> s[style]
s[style] --> attribute