@slimr/styled 2.0.4 → 2.0.6

package/esm/index.ts

@@ -1,200 +1,4 @@
-import {TemplateStringProps} from '@slimr/css'
-
-import {FC} from 'react'
-
-import {styledBase as s} from './core.js'
-
 export * from '@slimr/css'
 export * from './core.js'
-
-/** Shorthand type */
-type unk = unknown
-/** Shorthand type */
-type TSP = TemplateStringProps
-/** Shorthand type */
-type HTP = JSX.IntrinsicElements
-
-export const styled = Object.assign(s, {
-  /** creates a 'a' component with css applied */
-  a: (...p: TSP) => s('a' as unk as FC<HTP['a']>)(...p),
-  /** creates a 'abbr' component with css applied */
-  abbr: (...p: TSP) => s('abbr' as unk as FC<HTP['abbr']>)(...p),
-  /** creates a 'address' component with css applied */
-  address: (...p: TSP) => s('address' as unk as FC<HTP['address']>)(...p),
-  /** creates a 'area' component with css applied */
-  area: (...p: TSP) => s('area' as unk as FC<HTP['area']>)(...p),
-  /** creates a 'article' component with css applied */
-  article: (...p: TSP) => s('article' as unk as FC<HTP['article']>)(...p),
-  /** creates a 'aside' component with css applied */
-  aside: (...p: TSP) => s('aside' as unk as FC<HTP['aside']>)(...p),
-  /** creates a 'audio' component with css applied */
-  audio: (...p: TSP) => s('audio' as unk as FC<HTP['audio']>)(...p),
-  /** creates a 'b' component with css applied */
-  b: (...p: TSP) => s('b' as unk as FC<HTP['b']>)(...p),
-  /** creates a 'big' component with css applied; Deprecated so left out */
-  // big: (...p: TSP) => styled('big' as unk as FC<HTP['big']>)(...p),
-  /** creates a 'blockquote' component with css applied */
-  blockquote: (...p: TSP) => s('blockquote' as unk as FC<HTP['blockquote']>)(...p),
-  /** creates a 'body' component with css applied; omitted bc doesnt seem useful */
-  // body: (...p: TSP) => styled('body' as unk as FC<HTP['body']>)(...p),
-  /** creates a 'br' component with css applied; omitted bc doesnt seem useful */
-  br: (...p: TSP) => s('br' as unk as FC<HTP['br']>)(...p),
-  /** creates a 'button' component with css applied */
-  button: (...p: TSP) => s('button' as unk as FC<HTP['button']>)(...p),
-  /** creates a 'caption' component with css applied */
-  caption: (...p: TSP) => s('caption' as unk as FC<HTP['caption']>)(...p),
-  /** creates a 'cite' component with css applied */
-  cite: (...p: TSP) => s('cite' as unk as FC<HTP['cite']>)(...p),
-  /** creates a 'code' component with css applied */
-  code: (...p: TSP) => s('code' as unk as FC<HTP['code']>)(...p),
-  /** creates a 'col' component with css applied */
-  col: (...p: TSP) => s('col' as unk as FC<HTP['col']>)(...p),
-  /** creates a 'colgroup' component with css applied */
-  colgroup: (...p: TSP) => s('colgroup' as unk as FC<HTP['colgroup']>)(...p),
-  /** creates a 'dd' component with css applied */
-  dd: (...p: TSP) => s('dd' as unk as FC<HTP['dd']>)(...p),
-  /** creates a 'del' component with css applied */
-  del: (...p: TSP) => s('del' as unk as FC<HTP['del']>)(...p),
-  /** creates a 'details' component with css applied */
-  details: (...p: TSP) => s('details' as unk as FC<HTP['details']>)(...p),
-  /** creates a 'dfn' component with css applied */
-  dfn: (...p: TSP) => s('dfn' as unk as FC<HTP['dfn']>)(...p),
-  /** creates a 'dialog' component with css applied */
-  dialog: (...p: TSP) => s('dialog' as unk as FC<HTP['dialog']>)(...p),
-  /** creates a 'div' component with css applied */
-  div: (...p: TSP) => s('div' as unk as FC<HTP['div']>)(...p),
-  /** creates a 'dl' component with css applied */
-  dl: (...p: TSP) => s('dl' as unk as FC<HTP['dl']>)(...p),
-  /** creates a 'dt' component with css applied */
-  dt: (...p: TSP) => s('dt' as unk as FC<HTP['dt']>)(...p),
-  /** creates a 'em' component with css applied */
-  em: (...p: TSP) => s('em' as unk as FC<HTP['em']>)(...p),
-  /** creates a 'embed' component with css applied */
-  embed: (...p: TSP) => s('embed' as unk as FC<HTP['embed']>)(...p),
-  /** creates a 'fieldset' component with css applied */
-  fieldset: (...p: TSP) => s('fieldset' as unk as FC<HTP['fieldset']>)(...p),
-  /** creates a 'figcaption' component with css applied */
-  figcaption: (...p: TSP) => s('figcaption' as unk as FC<HTP['figcaption']>)(...p),
-  /** creates a 'figure' component with css applied */
-  figure: (...p: TSP) => s('figure' as unk as FC<HTP['figure']>)(...p),
-  /** creates a 'footer' component with css applied */
-  footer: (...p: TSP) => s('footer' as unk as FC<HTP['footer']>)(...p),
-  /** creates a 'form' component with css applied */
-  form: (...p: TSP) => s('form' as unk as FC<HTP['form']>)(...p),
-  /** creates a 'h1' component with css applied */
-  h1: (...p: TSP) => s('h1' as unk as FC<HTP['h1']>)(...p),
-  /** creates a 'h2' component with css applied */
-  h2: (...p: TSP) => s('h2' as unk as FC<HTP['h2']>)(...p),
-  /** creates a 'h3' component with css applied */
-  h3: (...p: TSP) => s('h3' as unk as FC<HTP['h3']>)(...p),
-  /** creates a 'h4' component with css applied */
-  h4: (...p: TSP) => s('h4' as unk as FC<HTP['h4']>)(...p),
-  /** creates a 'h5' component with css applied */
-  h5: (...p: TSP) => s('h5' as unk as FC<HTP['h5']>)(...p),
-  /** creates a 'h6' component with css applied */
-  h6: (...p: TSP) => s('h6' as unk as FC<HTP['h6']>)(...p),
-  /** creates a 'header' component with css applied */
-  header: (...p: TSP) => s('header' as unk as FC<HTP['header']>)(...p),
-  /** creates a 'hgroup' component with css applied */
-  hgroup: (...p: TSP) => s('hgroup' as unk as FC<HTP['hgroup']>)(...p),
-  /** creates a 'hr' component with css applied */
-  hr: (...p: TSP) => s('hr' as unk as FC<HTP['hr']>)(...p),
-  /** creates a 'i' component with css applied */
-  i: (...p: TSP) => s('i' as unk as FC<HTP['i']>)(...p),
-  /** creates a 'iframe' component with css applied */
-  iframe: (...p: TSP) => s('iframe' as unk as FC<HTP['iframe']>)(...p),
-  /** creates a 'img' component with css applied */
-  img: (...p: TSP) => s('img' as unk as FC<HTP['img']>)(...p),
-  /** creates a 'input' component with css applied */
-  input: (...p: TSP) => s('input' as unk as FC<HTP['input']>)(...p),
-  /** creates a 'ins' component with css applied */
-  ins: (...p: TSP) => s('ins' as unk as FC<HTP['ins']>)(...p),
-  /** creates a 'kbd' component with css applied */
-  kbd: (...p: TSP) => s('kbd' as unk as FC<HTP['kbd']>)(...p),
-  /** creates a 'label' component with css applied */
-  label: (...p: TSP) => s('label' as unk as FC<HTP['label']>)(...p),
-  /** creates a 'legend' component with css applied */
-  legend: (...p: TSP) => s('legend' as unk as FC<HTP['legend']>)(...p),
-  /** creates a 'li' component with css applied */
-  li: (...p: TSP) => s('li' as unk as FC<HTP['li']>)(...p),
-  /** creates a 'main' component with css applied */
-  main: (...p: TSP) => s('main' as unk as FC<HTP['main']>)(...p),
-  /** creates a 'map' component with css applied */
-  map: (...p: TSP) => s('map' as unk as FC<HTP['map']>)(...p),
-  /** creates a 'mark' component with css applied */
-  mark: (...p: TSP) => s('mark' as unk as FC<HTP['mark']>)(...p),
-  /** creates a 'meter' component with css applied */
-  meter: (...p: TSP) => s('meter' as unk as FC<HTP['meter']>)(...p),
-  /** creates a 'nav' component with css applied */
-  nav: (...p: TSP) => s('nav' as unk as FC<HTP['nav']>)(...p),
-  /** creates a 'object' component with css applied */
-  object: (...p: TSP) => s('object' as unk as FC<HTP['object']>)(...p),
-  /** creates a 'ol' component with css applied */
-  ol: (...p: TSP) => s('ol' as unk as FC<HTP['ol']>)(...p),
-  /** creates a 'optgroup' component with css applied */
-  optgroup: (...p: TSP) => s('optgroup' as unk as FC<HTP['optgroup']>)(...p),
-  /** creates a 'option' component with css applied */
-  option: (...p: TSP) => s('option' as unk as FC<HTP['option']>)(...p),
-  /** creates a 'output' component with css applied */
-  output: (...p: TSP) => s('output' as unk as FC<HTP['output']>)(...p),
-  /** creates a 'p' component with css applied */
-  p: (...p: TSP) => s('p' as unk as FC<HTP['p']>)(...p),
-  /** creates a 'picture' component with css applied */
-  picture: (...p: TSP) => s('picture' as unk as FC<HTP['picture']>)(...p),
-  /** creates a 'pre' component with css applied */
-  pre: (...p: TSP) => s('pre' as unk as FC<HTP['pre']>)(...p),
-  /** creates a 'progress' component with css applied */
-  progress: (...p: TSP) => s('progress' as unk as FC<HTP['progress']>)(...p),
-  /** creates a 'q' component with css applied */
-  q: (...p: TSP) => s('q' as unk as FC<HTP['q']>)(...p),
-  /** creates a 'rp' component with css applied */
-  rp: (...p: TSP) => s('rp' as unk as FC<HTP['rp']>)(...p),
-  /** creates a 'rt' component with css applied */
-  rt: (...p: TSP) => s('rt' as unk as FC<HTP['rt']>)(...p),
-  /** creates a 'ruby' component with css applied */
-  ruby: (...p: TSP) => s('ruby' as unk as FC<HTP['ruby']>)(...p),
-  /** creates a 's' component with css applied */
-  s: (...p: TSP) => s('s' as unk as FC<HTP['s']>)(...p),
-  /** creates a 'samp' component with css applied */
-  samp: (...p: TSP) => s('samp' as unk as FC<HTP['samp']>)(...p),
-  /** creates a 'section' component with css applied */
-  section: (...p: TSP) => s('section' as unk as FC<HTP['section']>)(...p),
-  /** creates a 'select' component with css applied */
-  select: (...p: TSP) => s('select' as unk as FC<HTP['select']>)(...p),
-  /** creates a 'small' component with css applied */
-  small: (...p: TSP) => s('small' as unk as FC<HTP['small']>)(...p),
-  /** creates a 'span' component with css applied */
-  span: (...p: TSP) => s('span' as unk as FC<HTP['span']>)(...p),
-  /** creates a 'strong' component with css applied */
-  strong: (...p: TSP) => s('strong' as unk as FC<HTP['strong']>)(...p),
-  /** creates a 'sub' component with css applied */
-  sub: (...p: TSP) => s('sub' as unk as FC<HTP['sub']>)(...p),
-  /** creates a 'summary' component with css applied */
-  summary: (...p: TSP) => s('summary' as unk as FC<HTP['summary']>)(...p),
-  /** creates a 'sup' component with css applied */
-  sup: (...p: TSP) => s('sup' as unk as FC<HTP['sup']>)(...p),
-  /** creates a 'table' component with css applied */
-  table: (...p: TSP) => s('table' as unk as FC<HTP['table']>)(...p),
-  /** creates a 'tbody' component with css applied */
-  tbody: (...p: TSP) => s('tbody' as unk as FC<HTP['tbody']>)(...p),
-  /** creates a 'td' component with css applied */
-  td: (...p: TSP) => s('td' as unk as FC<HTP['td']>)(...p),
-  /** creates a 'textarea' component with css applied */
-  textarea: (...p: TSP) => s('textarea' as unk as FC<HTP['textarea']>)(...p),
-  /** creates a 'tfoot' component with css applied */
-  tfoot: (...p: TSP) => s('tfoot' as unk as FC<HTP['tfoot']>)(...p),
-  /** creates a 'th' component with css applied */
-  th: (...p: TSP) => s('th' as unk as FC<HTP['th']>)(...p),
-  /** creates a 'thead' component with css applied */
-  thead: (...p: TSP) => s('thead' as unk as FC<HTP['thead']>)(...p),
-  /** creates a 'time' component with css applied */
-  time: (...p: TSP) => s('time' as unk as FC<HTP['time']>)(...p),
-  /** creates a 'tr' component with css applied */
-  tr: (...p: TSP) => s('tr' as unk as FC<HTP['tr']>)(...p),
-  /** creates a 'u' component with css applied */
-  u: (...p: TSP) => s('u' as unk as FC<HTP['u']>)(...p),
-  /** creates a 'ul' component with css applied */
-  ul: (...p: TSP) => s('ul' as unk as FC<HTP['ul']>)(...p),
-  /** creates a 'video' component with css applied */
-  video: (...p: TSP) => s('video' as unk as FC<HTP['video']>)(...p),
-})
+export * from './primitives.js'
+export * from './styled.js'

package/esm/primitives.d.ts

@@ -0,0 +1,93 @@
+/// <reference types="react" />
+export declare const A: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>>;
+export declare const Abbr: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Address: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Area: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").AreaHTMLAttributes<HTMLAreaElement>, HTMLAreaElement>>;
+export declare const Article: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Aside: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const AudioC: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").AudioHTMLAttributes<HTMLAudioElement>, HTMLAudioElement>>;
+export declare const B: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Blockquote: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").BlockquoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>>;
+export declare const Br: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLBRElement>, HTMLBRElement>>;
+export declare const Button: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>>;
+export declare const Caption: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Cite: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Code: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Col: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").ColHTMLAttributes<HTMLTableColElement>, HTMLTableColElement>>;
+export declare const Colgroup: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").ColgroupHTMLAttributes<HTMLTableColElement>, HTMLTableColElement>>;
+export declare const Dd: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Del: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").DelHTMLAttributes<HTMLModElement>, HTMLModElement>>;
+export declare const Details: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").DetailsHTMLAttributes<HTMLDetailsElement>, HTMLDetailsElement>>;
+export declare const Dfn: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Dialog: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").DialogHTMLAttributes<HTMLDialogElement>, HTMLDialogElement>>;
+export declare const Div: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
+export declare const Dl: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDListElement>, HTMLDListElement>>;
+export declare const Dt: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Em: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Embed: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").EmbedHTMLAttributes<HTMLEmbedElement>, HTMLEmbedElement>>;
+export declare const Fieldset: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>>;
+export declare const Figcaption: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Figure: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Footer: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Form: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>>;
+export declare const H1: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>>;
+export declare const H2: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>>;
+export declare const H3: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>>;
+export declare const H4: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>>;
+export declare const H5: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>>;
+export declare const H6: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>>;
+export declare const Header: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Hgroup: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Hr: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHRElement>, HTMLHRElement>>;
+export declare const I: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Iframe: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").IframeHTMLAttributes<HTMLIFrameElement>, HTMLIFrameElement>>;
+export declare const Img: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>>;
+export declare const Input: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>>;
+export declare const Ins: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").InsHTMLAttributes<HTMLModElement>, HTMLModElement>>;
+export declare const Kbd: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Label: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>>;
+export declare const Legend: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>>;
+export declare const Li: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>>;
+export declare const Main: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const MapC: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").MapHTMLAttributes<HTMLMapElement>, HTMLMapElement>>;
+export declare const Mark: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Meter: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").MeterHTMLAttributes<HTMLMeterElement>, HTMLMeterElement>>;
+export declare const Nav: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const ObjectC: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").ObjectHTMLAttributes<HTMLObjectElement>, HTMLObjectElement>>;
+export declare const Ol: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>>;
+export declare const Optgroup: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").OptgroupHTMLAttributes<HTMLOptGroupElement>, HTMLOptGroupElement>>;
+export declare const OptionC: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>>;
+export declare const Output: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").OutputHTMLAttributes<HTMLOutputElement>, HTMLOutputElement>>;
+export declare const P: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>>;
+export declare const Picture: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Pre: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLPreElement>, HTMLPreElement>>;
+export declare const Progress: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").ProgressHTMLAttributes<HTMLProgressElement>, HTMLProgressElement>>;
+export declare const Q: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").QuoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>>;
+export declare const Rp: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Rt: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Ruby: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const S: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Samp: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Section: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Select: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>>;
+export declare const Small: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Span: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>>;
+export declare const Strong: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Sub: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Summary: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Sup: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Table: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>>;
+export declare const Tbody: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>>;
+export declare const Td: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>>;
+export declare const Textarea: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>>;
+export declare const Tfoot: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>>;
+export declare const Th: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>>;
+export declare const Thead: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>>;
+export declare const Time: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").TimeHTMLAttributes<HTMLTimeElement>, HTMLTimeElement>>;
+export declare const Tr: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>>;
+export declare const U: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>>;
+export declare const Ul: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>>;
+export declare const Video: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>>;
+export declare const Box: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
+export declare const Flex: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;
+export declare const FlexC: import("./core.js").SC<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>;

package/esm/primitives.js

@@ -0,0 +1,99 @@
+import { styled } from './styled.js';
+export const A = styled.a ``;
+export const Abbr = styled.abbr ``;
+export const Address = styled.address ``;
+export const Area = styled.area ``;
+export const Article = styled.article ``;
+export const Aside = styled.aside ``;
+export const AudioC = styled.audio ``;
+export const B = styled.b ``;
+export const Blockquote = styled.blockquote ``;
+export const Br = styled.br ``;
+export const Button = styled.button ``;
+export const Caption = styled.caption ``;
+export const Cite = styled.cite ``;
+export const Code = styled.code ``;
+export const Col = styled.col ``;
+export const Colgroup = styled.colgroup ``;
+export const Dd = styled.dd ``;
+export const Del = styled.del ``;
+export const Details = styled.details ``;
+export const Dfn = styled.dfn ``;
+export const Dialog = styled.dialog ``;
+export const Div = styled.div ``;
+export const Dl = styled.dl ``;
+export const Dt = styled.dt ``;
+export const Em = styled.em ``;
+export const Embed = styled.embed ``;
+export const Fieldset = styled.fieldset ``;
+export const Figcaption = styled.figcaption ``;
+export const Figure = styled.figure ``;
+export const Footer = styled.footer ``;
+export const Form = styled.form ``;
+export const H1 = styled.h1 ``;
+export const H2 = styled.h2 ``;
+export const H3 = styled.h3 ``;
+export const H4 = styled.h4 ``;
+export const H5 = styled.h5 ``;
+export const H6 = styled.h6 ``;
+export const Header = styled.header ``;
+export const Hgroup = styled.hgroup ``;
+export const Hr = styled.hr ``;
+export const I = styled.i ``;
+export const Iframe = styled.iframe ``;
+export const Img = styled.img ``;
+export const Input = styled.input ``;
+export const Ins = styled.ins ``;
+export const Kbd = styled.kbd ``;
+export const Label = styled.label ``;
+export const Legend = styled.legend ``;
+export const Li = styled.li ``;
+export const Main = styled.main ``;
+export const MapC = styled.map ``;
+export const Mark = styled.mark ``;
+export const Meter = styled.meter ``;
+export const Nav = styled.nav ``;
+export const ObjectC = styled.object ``;
+export const Ol = styled.ol ``;
+export const Optgroup = styled.optgroup ``;
+export const OptionC = styled.option ``;
+export const Output = styled.output ``;
+export const P = styled.p ``;
+export const Picture = styled.picture ``;
+export const Pre = styled.pre ``;
+export const Progress = styled.progress ``;
+export const Q = styled.q ``;
+export const Rp = styled.rp ``;
+export const Rt = styled.rt ``;
+export const Ruby = styled.ruby ``;
+export const S = styled.s ``;
+export const Samp = styled.samp ``;
+export const Section = styled.section ``;
+export const Select = styled.select ``;
+export const Small = styled.small ``;
+export const Span = styled.span ``;
+export const Strong = styled.strong ``;
+export const Sub = styled.sub ``;
+export const Summary = styled.summary ``;
+export const Sup = styled.sup ``;
+export const Table = styled.table ``;
+export const Tbody = styled.tbody ``;
+export const Td = styled.td ``;
+export const Textarea = styled.textarea ``;
+export const Tfoot = styled.tfoot ``;
+export const Th = styled.th ``;
+export const Thead = styled.thead ``;
+export const Time = styled.time ``;
+export const Tr = styled.tr ``;
+export const U = styled.u ``;
+export const Ul = styled.ul ``;
+export const Video = styled.video ``;
+export const Box = Div;
+export const Flex = styled.div `
+  d: flex;
+`;
+export const FlexC = styled.div `
+  d: flex;
+  fd: column;
+`;
+//# sourceMappingURL=primitives.js.map

package/esm/primitives.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"primitives.js","sourceRoot":"","sources":["../src/primitives.ts"],"names":[],"mappings":"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"}

package/esm/primitives.ts

@@ -0,0 +1,100 @@
+import {styled} from './styled.js'
+
+export const A = styled.a``
+export const Abbr = styled.abbr``
+export const Address = styled.address``
+export const Area = styled.area``
+export const Article = styled.article``
+export const Aside = styled.aside``
+export const AudioC = styled.audio``
+export const B = styled.b``
+export const Blockquote = styled.blockquote``
+export const Br = styled.br``
+export const Button = styled.button``
+export const Caption = styled.caption``
+export const Cite = styled.cite``
+export const Code = styled.code``
+export const Col = styled.col``
+export const Colgroup = styled.colgroup``
+export const Dd = styled.dd``
+export const Del = styled.del``
+export const Details = styled.details``
+export const Dfn = styled.dfn``
+export const Dialog = styled.dialog``
+export const Div = styled.div``
+export const Dl = styled.dl``
+export const Dt = styled.dt``
+export const Em = styled.em``
+export const Embed = styled.embed``
+export const Fieldset = styled.fieldset``
+export const Figcaption = styled.figcaption``
+export const Figure = styled.figure``
+export const Footer = styled.footer``
+export const Form = styled.form``
+export const H1 = styled.h1``
+export const H2 = styled.h2``
+export const H3 = styled.h3``
+export const H4 = styled.h4``
+export const H5 = styled.h5``
+export const H6 = styled.h6``
+export const Header = styled.header``
+export const Hgroup = styled.hgroup``
+export const Hr = styled.hr``
+export const I = styled.i``
+export const Iframe = styled.iframe``
+export const Img = styled.img``
+export const Input = styled.input``
+export const Ins = styled.ins``
+export const Kbd = styled.kbd``
+export const Label = styled.label``
+export const Legend = styled.legend``
+export const Li = styled.li``
+export const Main = styled.main``
+export const MapC = styled.map``
+export const Mark = styled.mark``
+export const Meter = styled.meter``
+export const Nav = styled.nav``
+export const ObjectC = styled.object``
+export const Ol = styled.ol``
+export const Optgroup = styled.optgroup``
+export const OptionC = styled.option``
+export const Output = styled.output``
+export const P = styled.p``
+export const Picture = styled.picture``
+export const Pre = styled.pre``
+export const Progress = styled.progress``
+export const Q = styled.q``
+export const Rp = styled.rp``
+export const Rt = styled.rt``
+export const Ruby = styled.ruby``
+export const S = styled.s``
+export const Samp = styled.samp``
+export const Section = styled.section``
+export const Select = styled.select``
+export const Small = styled.small``
+export const Span = styled.span``
+export const Strong = styled.strong``
+export const Sub = styled.sub``
+export const Summary = styled.summary``
+export const Sup = styled.sup``
+export const Table = styled.table``
+export const Tbody = styled.tbody``
+export const Td = styled.td``
+export const Textarea = styled.textarea``
+export const Tfoot = styled.tfoot``
+export const Th = styled.th``
+export const Thead = styled.thead``
+export const Time = styled.time``
+export const Tr = styled.tr``
+export const U = styled.u``
+export const Ul = styled.ul``
+export const Video = styled.video``
+
+export const Box = Div
+export const Flex = styled.div`
+  d: flex;
+`
+export const FlexC = styled.div`
+  d: flex;
+  fd: column;
+`