@tempots/dom

svgAttr variable

An object that provides a convenient way to create mountable attributes for SVG elements.

Signature:

svgAttr: {
    'accent-height': (value: NValue<number>) => Renderable;
    accumulate: (value: NValue<"none" | "sum">) => Renderable;
    additive: (value: NValue<"replace" | "sum">) => Renderable;
    'alignment-baseline': (value: NValue<"auto" | "baseline" | "before-edge" | "text-before-edge" | "middle" | "central" | "after-edge" | "text-after-edge" | "ideographic" | "alphabetic" | "hanging" | "mathematical" | "inherit">) => Renderable;
    'allow-reorder': (value: NValue<"no" | "yes">) => Renderable;
    alphabetic: (value: NValue<number>) => Renderable;
    amplitude: (value: NValue<number>) => Renderable;
    'arabic-form': (value: NValue<"initial" | "medial" | "terminal" | "isolated">) => Renderable;
    ascent: (value: NValue<number>) => Renderable;
    attributeName: (value: NValue<string>) => Renderable;
    attributeType: (value: NValue<string>) => Renderable;
    autoReverse: (value: NValue<"false" | "true">) => Renderable;
    azimuth: (value: NValue<number>) => Renderable;
    baseFrequency: (value: NValue<number>) => Renderable;
    baseProfile: (value: NValue<string>) => Renderable;
    'baseline-shift': (value: NValue<number>) => Renderable;
    bbox: (value: NValue<number>) => Renderable;
    begin: (value: NValue<number>) => Renderable;
    bias: (value: NValue<number>) => Renderable;
    by: (value: NValue<number>) => Renderable;
    calcMode: (value: NValue<string>) => Renderable;
    'cap-height': (value: NValue<number>) => Renderable;
    clip: (value: NValue<number>) => Renderable;
    'clip-path': (value: NValue<string>) => Renderable;
    clipPathUnits: (value: NValue<string>) => Renderable;
    clipRule: (value: NValue<string>) => Renderable;
    'color-interpolation': (value: NValue<string>) => Renderable;
    'color-interpolation-filters': (value: NValue<"auto" | "inherit" | "sRGB" | "linearRGB">) => Renderable;
    colorProfile: (value: NValue<string>) => Renderable;
    'color-rendering': (value: NValue<string>) => Renderable;
    contentScriptType: (value: NValue<string>) => Renderable;
    contentStyleType: (value: NValue<string>) => Renderable;
    cursor: (value: NValue<string>) => Renderable;
    cx: (value: NValue<number>) => Renderable;
    cy: (value: NValue<number>) => Renderable;
    d: (value: NValue<string>) => Renderable;
    decelerate: (value: NValue<number>) => Renderable;
    descent: (value: NValue<number>) => Renderable;
    diffuseConstant: (value: NValue<number>) => Renderable;
    direction: (value: NValue<string>) => Renderable;
    display: (value: NValue<string>) => Renderable;
    divisor: (value: NValue<number>) => Renderable;
    'dominant-baseline': (value: NValue<string>) => Renderable;
    dur: (value: NValue<number>) => Renderable;
    dx: (value: NValue<number>) => Renderable;
    dy: (value: NValue<number>) => Renderable;
    edgeMode: (value: NValue<string>) => Renderable;
    elevation: (value: NValue<number>) => Renderable;
    enableBackground: (value: NValue<string>) => Renderable;
    end: (value: NValue<number>) => Renderable;
    exponent: (value: NValue<number>) => Renderable;
    externalResourcesRequired: (value: NValue<"false" | "true">) => Renderable;
    fill: (value: NValue<string>) => Renderable;
    'fill-opacity': (value: NValue<number>) => Renderable;
    'fill-rule': (value: NValue<string>) => Renderable;
    filter: (value: NValue<string>) => Renderable;
    filterRes: (value: NValue<number>) => Renderable;
    filterUnits: (value: NValue<string>) => Renderable;
    'flood-color': (value: NValue<string>) => Renderable;
    'flood-opacity': (value: NValue<number>) => Renderable;
    focusable: (value: NValue<"false" | "true" | "auto">) => Renderable;
    'font-family': (value: NValue<string>) => Renderable;
    'font-size': (value: NValue<number>) => Renderable;
    'font-size-adjust': (value: NValue<number>) => Renderable;
    'font-stretch': (value: NValue<string>) => Renderable;
    'font-style': (value: NValue<string>) => Renderable;
    'font-variant': (value: NValue<string>) => Renderable;
    'font-weight': (value: NValue<string>) => Renderable;
    format: (value: NValue<string>) => Renderable;
    from: (value: NValue<number>) => Renderable;
    fx: (value: NValue<number>) => Renderable;
    fy: (value: NValue<number>) => Renderable;
    g1: (value: NValue<number>) => Renderable;
    g2: (value: NValue<number>) => Renderable;
    'glyph-name': (value: NValue<string>) => Renderable;
    'glyph-orientation-horizontal': (value: NValue<number>) => Renderable;
    'glyph-orientation-vertical': (value: NValue<number>) => Renderable;
    glyphRef: (value: NValue<string>) => Renderable;
    gradientTransform: (value: NValue<string>) => Renderable;
    gradientUnits: (value: NValue<string>) => Renderable;
    hanging: (value: NValue<number>) => Renderable;
    height: (value: NValue<number>) => Renderable;
    'horiz-adv-x': (value: NValue<number>) => Renderable;
    'horiz-origin-x': (value: NValue<number>) => Renderable;
    'horiz-origin-y': (value: NValue<number>) => Renderable;
    ideographic: (value: NValue<number>) => Renderable;
    'image-rendering': (value: NValue<string>) => Renderable;
    in: (value: NValue<string>) => Renderable;
    in2: (value: NValue<string>) => Renderable;
    intercept: (value: NValue<number>) => Renderable;
    k: (value: NValue<number>) => Renderable;
    k1: (value: NValue<number>) => Renderable;
    k2: (value: NValue<number>) => Renderable;
    k3: (value: NValue<number>) => Renderable;
    k4: (value: NValue<number>) => Renderable;
    kernelMatrix: (value: NValue<string>) => Renderable;
    kernelUnitLength: (value: NValue<number>) => Renderable;
    kerning: (value: NValue<number>) => Renderable;
    keyPoints: (value: NValue<string>) => Renderable;
    keySplines: (value: NValue<string>) => Renderable;
    keyTimes: (value: NValue<string>) => Renderable;
    lengthAdjust: (value: NValue<string>) => Renderable;
    'letter-spacing': (value: NValue<number>) => Renderable;
    'lighting-color': (value: NValue<string>) => Renderable;
    limitingConeAngle: (value: NValue<number>) => Renderable;
    local: (value: NValue<number>) => Renderable;
    'marker-end': (value: NValue<string>) => Renderable;
    markerHeight: (value: NValue<number>) => Renderable;
    'marker-mid': (value: NValue<string>) => Renderable;
    'marker-start': (value: NValue<string>) => Renderable;
    markerUnits: (value: NValue<string>) => Renderable;
    markerWidth: (value: NValue<number>) => Renderable;
    mask: (value: NValue<string>) => Renderable;
    maskContentUnits: (value: NValue<string>) => Renderable;
    maskUnits: (value: NValue<string>) => Renderable;
    mathematical: (value: NValue<number>) => Renderable;
    mode: (value: NValue<string>) => Renderable;
    numOctaves: (value: NValue<number>) => Renderable;
    offset: (value: NValue<number>) => Renderable;
    opacity: (value: NValue<number>) => Renderable;
    operator: (value: NValue<string>) => Renderable;
    order: (value: NValue<number>) => Renderable;
    orient: (value: NValue<string>) => Renderable;
    orientation: (value: NValue<number>) => Renderable;
    origin: (value: NValue<number>) => Renderable;
    overflow: (value: NValue<string>) => Renderable;
    'overline-position': (value: NValue<number>) => Renderable;
    'overline-thickness': (value: NValue<number>) => Renderable;
    'paint-order': (value: NValue<string>) => Renderable;
    'panose-1': (value: NValue<number>) => Renderable;
    pathLength: (value: NValue<number>) => Renderable;
    patternContentUnits: (value: NValue<string>) => Renderable;
    patternTransform: (value: NValue<string>) => Renderable;
    patternUnits: (value: NValue<string>) => Renderable;
    'pointer-events': (value: NValue<string>) => Renderable;
    points: (value: NValue<string>) => Renderable;
    pointsAtX: (value: NValue<number>) => Renderable;
    pointsAtY: (value: NValue<number>) => Renderable;
    pointsAtZ: (value: NValue<number>) => Renderable;
    preserveAlpha: (value: NValue<"false" | "true">) => Renderable;
    preserveAspectRatio: (value: NValue<string>) => Renderable;
    primitiveUnits: (value: NValue<string>) => Renderable;
    r: (value: NValue<number>) => Renderable;
    radius: (value: NValue<number>) => Renderable;
    refX: (value: NValue<number>) => Renderable;
    refY: (value: NValue<number>) => Renderable;
    'rendering-intent': (value: NValue<string>) => Renderable;
    repeatCount: (value: NValue<number>) => Renderable;
    repeatDur: (value: NValue<number>) => Renderable;
    requiredExtensions: (value: NValue<string>) => Renderable;
    requiredFeatures: (value: NValue<string>) => Renderable;
    restart: (value: NValue<string>) => Renderable;
    result: (value: NValue<string>) => Renderable;
    rotate: (value: NValue<number>) => Renderable;
    rx: (value: NValue<number>) => Renderable;
    ry: (value: NValue<number>) => Renderable;
    scale: (value: NValue<number>) => Renderable;
    seed: (value: NValue<number>) => Renderable;
    'shape-rendering': (value: NValue<string>) => Renderable;
    slope: (value: NValue<number>) => Renderable;
    spacing: (value: NValue<number>) => Renderable;
    specularConstant: (value: NValue<number>) => Renderable;
    specularExponent: (value: NValue<number>) => Renderable;
    speed: (value: NValue<number>) => Renderable;
    spreadMethod: (value: NValue<string>) => Renderable;
    startOffset: (value: NValue<number>) => Renderable;
    stdDeviation: (value: NValue<number>) => Renderable;
    stemh: (value: NValue<number>) => Renderable;
    stemv: (value: NValue<number>) => Renderable;
    stitchTiles: (value: NValue<string>) => Renderable;
    'stop-color': (value: NValue<string>) => Renderable;
    'stop-opacity': (value: NValue<number>) => Renderable;
    'strikethrough-position': (value: NValue<number>) => Renderable;
    'strikethrough-thickness': (value: NValue<number>) => Renderable;
    string: (value: NValue<string>) => Renderable;
    stroke: (value: NValue<string>) => Renderable;
    'stroke-dasharray': (value: NValue<string>) => Renderable;
    'stroke-dashoffset': (value: NValue<number>) => Renderable;
    'stroke-linecap': (value: NValue<string>) => Renderable;
    'stroke-linejoin': (value: NValue<string>) => Renderable;
    'stroke-miterlimit': (value: NValue<number>) => Renderable;
    'stroke-opacity': (value: NValue<number>) => Renderable;
    'stroke-width': (value: NValue<number>) => Renderable;
    surfaceScale: (value: NValue<number>) => Renderable;
    systemLanguage: (value: NValue<string>) => Renderable;
    tableValues: (value: NValue<string>) => Renderable;
    targetX: (value: NValue<number>) => Renderable;
    targetY: (value: NValue<number>) => Renderable;
    'text-anchor': (value: NValue<string>) => Renderable;
    'text-decoration': (value: NValue<string>) => Renderable;
    textLength: (value: NValue<number>) => Renderable;
    'text-rendering': (value: NValue<string>) => Renderable;
    to: (value: NValue<number>) => Renderable;
    transform: (value: NValue<string>) => Renderable;
    'transform-origin': (value: NValue<string>) => Renderable;
    u1: (value: NValue<number>) => Renderable;
    u2: (value: NValue<number>) => Renderable;
    'underline-position': (value: NValue<number>) => Renderable;
    'underline-thickness': (value: NValue<number>) => Renderable;
    unicode: (value: NValue<number>) => Renderable;
    'unicode-bidi': (value: NValue<string>) => Renderable;
    'unicode-range': (value: NValue<string>) => Renderable;
    'units-per-em': (value: NValue<number>) => Renderable;
    'v-alphabetic': (value: NValue<number>) => Renderable;
    values: (value: NValue<string>) => Renderable;
    'vector-effect': (value: NValue<string>) => Renderable;
    version: (value: NValue<string>) => Renderable;
    'vert-adv-y': (value: NValue<number>) => Renderable;
    'vert-origin-x': (value: NValue<number>) => Renderable;
    'vert-origin-y': (value: NValue<number>) => Renderable;
    'v-hanging': (value: NValue<number>) => Renderable;
    'v-ideographic': (value: NValue<number>) => Renderable;
    viewBox: (value: NValue<string>) => Renderable;
    viewTarget: (value: NValue<number>) => Renderable;
    visibility: (value: NValue<string>) => Renderable;
    'v-mathematical': (value: NValue<number>) => Renderable;
    width: (value: NValue<number>) => Renderable;
    widths: (value: NValue<number>) => Renderable;
    'word-spacing': (value: NValue<number>) => Renderable;
    'writing-mode': (value: NValue<string>) => Renderable;
    x1: (value: NValue<number>) => Renderable;
    x2: (value: NValue<number>) => Renderable;
    x: (value: NValue<number>) => Renderable;
    xChannelSelector: (value: NValue<string>) => Renderable;
    'x-height': (value: NValue<number>) => Renderable;
    xlinkActuate: (value: NValue<string>) => Renderable;
    xlinkArcrole: (value: NValue<string>) => Renderable;
    xlinkHref: (value: NValue<string>) => Renderable;
    xlinkRole: (value: NValue<string>) => Renderable;
    xlinkShow: (value: NValue<string>) => Renderable;
    xlinkTitle: (value: NValue<string>) => Renderable;
    xlinkType: (value: NValue<string>) => Renderable;
    xmlBase: (value: NValue<string>) => Renderable;
    xmlLang: (value: NValue<string>) => Renderable;
    xmlns: (value: NValue<string>) => Renderable;
    xmlnsXlink: (value: NValue<string>) => Renderable;
    xmlSpace: (value: NValue<string>) => Renderable;
    y1: (value: NValue<number>) => Renderable;
    y2: (value: NValue<number>) => Renderable;
    y: (value: NValue<number>) => Renderable;
    yChannelSelector: (value: NValue<string>) => Renderable;
    z: (value: NValue<number>) => Renderable;
    zoomAndPan: (value: NValue<string>) => Renderable;
}

Example

const svg = html.svg(
 svgAttr.width(100),
 svgAttr.height(height), // where height is a `Signal`
// ...
)