prxmpt
v0.2.0
-El artesanía rápida con JSX-
NPM • GitHub • Problemas
PRXMPT es como "Viento de cola para ingeniería rápida" . Proporciona un conjunto de utilidades para formatear cadenas con JSX.
PRXMPT está diseñado para dar forma a la entrada a LLM e incluye elementos poderosos como <riority> para la gestión de tokens. Sin embargo, PRXMPT también proporciona elementos de Markdown y HTML, lo que lo hace perfecto para formatear salidas LLM para usuarios finales también.
Leyabilidad : JSX nos da más control sobre el espacio en blanco, lo que permite un código más legible.
" Control de ️: con accesorios incorporados como hide , podemos controlar fácilmente el texto que mostramos sin camarillas.
? Reutilización : los componentes PRXMPT toman accesorios al igual que los componentes JSX normales, haciéndolos fáciles de reutilizar.
text const = (
<Lined> <h1> Esta es la primera línea. </h1> <text hide = {hideline2}> Aquí hay una segunda línea. </ext> <caute/> <ext> Esta es una línea más larga, así que lo haremos Rompe la etiqueta de texto.
Incluso podemos comenzar otra línea aquí, y se agregará un espacio. </ext>
</lined>);hideLine2=false ) # This is the first line. Here's a second line. This is a long line, so we'llbreak the text tag We can even start another line here, and a space will be added.
hideLine2=true ) # This is the first line. This is a long line, so we'll break the text tag We can even start another line here, and a space will be added.
Compare esto con un equivalente usando literales de plantilla:
const text = `# Esta es la primera línea. $ {Hideline2? "No es una segunda línea". : ""} nnthis es una línea más larga, por lo que ahora estamos fuera de la página. Incluso podemos comenzar otra línea aquí, pero no lo recomendaría.NPM install @AutoSsey/PRXMPT
Yarn agregar @autossey/prxmpt
PNPM ADD @AutoSsey/PRXMPT
Bun Agregar @AutoSsey/Prxmpt
PRXMPT proporciona una base tsconfig.json que puede extender:
{"extiende": "@autossey/prxmpt/tsconfig.json"}Nota: BUN no parece detectar PRXMPT correctamente cuando se usa el método "Extends".
Alternativamente, simplemente puede agregar los siguientes campos a su tsconfig.json :
{"compilerOptions": {"jsx": "react-jsx", "jsximportSource": "@autossey/prxmpt", "módulo": "nodEnext"
}
}Debería poder usar elementos PRXMPT ahora, sin importar:
Exportar const myComponent = () => ( <Ext> ¡Hola, mundo! </text>);
Si usa PRXMPT con React, agregue la siguiente línea en la parte superior de cada archivo que usa PRXMPT en su lugar:
/** @jsximportsource @autossey/prxmpt*/export const myComponent = () => ( <Ext> ¡Hola, mundo! </text>);
Se proporcionan varios ejemplos en el directorio de ejemplos:
Ejemplos de uso de elementos:
fregadero de la cocina (muestra muchos elementos)
Prioridad (algunos ejemplos del elemento <priority> )
Ejemplos de configuración (TypeScript):
bollo
Bun (modo clásico)
Next.js
SWC
SWC (modo clásico)
nodo ts
nodo TS (modo clásico)
TSC
TSC (modo clásico)
Ejemplos de configuración (JavaScript):
nodo --loader @autossey/prxmpt
SWC
SWC (modo clásico)
Para ejemplos de cómo usar elementos específicos, las pruebas muestran más artículos de uso.
Elementos de texto
<kv> (par de valores clave)
<state>
<ask>
<exclaim>
<comment type="slash">
<comment type="hash">
<comment type="dash">
<comment type="html">
<sq> (cita única)
<dq> (cita doble)
<bq> (cita de atrás)
<tsq> (cita triple)
<tdq> (cita doble triple)
<tbq> (cita triple)
<parens> (paréntesis)
<square> (soporte cuadrado)
<curly> (soporte cuadrado)
<angle> (soporte de ángulo)
<empty>
<space>
<tab>
<ellipsis>
<na> (n/a)
<text>
Personajes
Corchetes
Citas
Comentario
Oraciones
Misceláneas
Elementos html
<span>
<p>
<blockquote>
<q>
<pre>
<i> (cursiva)
<b> (en negrita)
<s> (strikethrough)
<code> (código)
<ul> (lista desordenada)
<ol> (lista ordenada)
<cl> (lista de casillas de verificación)
<dl> (lista de definiciones)
<h1>
<h2>
<h3>
<h4>
<h5>
<h6>
<a> (ancla)
<img> (imagen)
<br> (break de línea)
<hr> (regla horizontal)
<tag>
Brote
Enlace
Encabezados
Liza
Estilo
Misceláneas
Elementos de serialización
<json>
<yaml>
<datetime>
<date>
<time>
<year>
<month>
<day>
<hour>
<minute>
<second>
<millisecond>
<duration>
<num>
Primitivos
Fechas
Objetos
Elementos de servicios públicos
<cap>
<priority>
<trim>
<frame>
<and>
<andor>
<or>
<nor>
<lined>
<spaced>
<csl> (lista separada por coma)
<union>
<sectioned>
<upper>
<lower>
<capital>
<title>
Caja
Unión
Sets
Afijos
Limitadores
Las siguientes funciones también se exportan desde PRXMPT:
Representación
createElement
render
Niños
hasChildren
isChildren
Divisores
split
paragraphs
lines
spaces
words
commas
chars
<text>
El texto es el elemento Base PRXMPT. Devuelve a sus hijos como una cadena:
const string = <Ext> Hello, World! </ext>;
Hello, World!
El texto también se puede ocultar con el accesorio hide :
const string = <Ext> Hello <Text Hide>, World </side>! </text>;
Hello!
Dado que <text> es la base de la mayoría de los otros elementos, los accesorios que proporciona se pueden usar con la mayoría de los otros elementos.
PRXMPT trata a los niños como una variedad de cuerdas, lo que significa que <text> también puede proporcionar varias funciones de matriz para mapear, filtrar y unir a los niños.
esconder
/*** Evite que el elemento se represente. * @default falso */escondite?: boolean;
filtrar
/*** Una función para filtrar a los niños. * @default (nodo) => verdadero */filtro?: (nodo: prxmpt.children, índice: número, arr: prxmpt.children []) => boolean;
mapa
/*** Una función que mapea a cada niño a un nuevo elemento. * @default (nodo) => prxmpt.render (nodo) */map ?: (nodo: prxmpt.children, índice: número, arr: prxmpt.children []) => prxmpt.jsx.element;
contrarrestar
/*** Revertir el orden de los niños. */reverso?: booleano;
unirse
/*** Un elemento para insertar entre cada niño. * @default "" " */unirse?: prxmpt.children;
repetir
/** * @default 1 */repetir?: número;
recortar
/*** `True`: recorte el espacio en blanco desde el principio y el final del elemento. * * `` "Inicio" `: Recorte el espacio en blanco desde el comienzo del elemento. * * * `" End "`: Recorte el espacio en blanco desde el final del elemento. * * @default false */TRIM?: boolean | Trimside;
caja
/*** Convierta el elemento en una carcasa dada. * @default indefinido */carcasa?: carcasa;
prefijo
/*** Un elemento para preparar al elemento. * @default "" */prefix?: prxmpt.children;
sufijo
/*** Un elemento para agregar al elemento. * @default "" */sufix?: prxmpt.children;
sangrar
/*** Aplicar la sangría a cada línea del elemento. * * Si `True`, la sangría se aplica usando 2 espacios. * * Si se proporciona un número, se utiliza ese número de espacios. * * Si se proporciona `" t "`, se usa un solo carácter de pestaña. * * @default falso */indent?: boolean | Número | "T";
bloquear
/*** Agregar una nueva línea al final del elemento. * @default falso */block?: boolean;
<empty>
El elemento <empty> devuelve una cadena vacía:
// "" const string = <vacía />;
<empty> a menudo es útil como hijo de elementos que se unen a sus hijos en algún delimitador.
const string = ( <Lined> <Ext> Línea 1 </ext> <cacuente/> <ext> línea 3 </ext> </lined>);
Line 1 Line 2
<space>
El elemento <space> devuelve un espacio:
// "" const string = <space />;
<tab>
literal
/*** Si es verdadero, use un personaje de pestaña literal. De lo contrario, use espacios. * @default falso */literal?: boolean;
ancho
/** * Número de caracteres por pestaña * @default 1 Si `literal` es verdadero, de lo contrario 2 */ancho?: Número;
// "" const string = <tab width = {4} /> <ellipsis>
const string = <ellipsis />;
...
<na>
const string = <Na />;
n/a
?
Corchetes <parens>
const string = <parens> hola, mundo! </parens>;
(Hello, World!)
<square>
const string = <S Square> Hello, World! </ Square>;
[Hello, World!]
<curly>
const string = <Scurly> Hello, World! </ curly>;
{Hello, World!} <angle>
const string = <Gangle> Hello, World! </Angle>;
<Hello, World!>
<sq>
const string = <sq> Hello, World! </sq>;
'Hello, World!'
<dq>
const string = <dq> Hello, World! </dq>;
"Hello, World!"
<bq>
const string = <bq> Hello, World! </bq>;
`Hello, World!`
<tsq>
const string = <TSQ> Hello, World! </ tsq>;
''' Hello, World! '''
<tdq>
const string = <TDQ> Hello, World! </ tdq>;
""" Hello, World! """
<tbq>
const tbq = <tbq> hello, world! </ tbq>;
`` `` `` ¡Hola Mundo! `` `` ``
<comment type="slash">
const slash = <comment type = "slash"> ¡Hola, mundo! </comment>;
// Hello, World!
<comment type="hash">
const hash = <comment type = "hash"> hola, mundo! </smont>;
# Hello, World!
<comment type="dash">
const dash = <comment type = "dash"> ¡Hola, mundo! </ comment>;
-- Hello, World!
<comment type="html">
const html = <comment type = "html"> Hola, mundo! </sment>;
<!-- Hello, World! -->
<state>
const state = <tate> hola, mundo! </tate>;
Hello, World.
<ask>
const ask = <k pregunta> hola, mundo! </k>;
Hello, World?
<exclaim>
const exclamar = <exclamación> hola, mundo! </exclamación>;
Hello, World!
<kv>
llave
/*** Una clave para renderizar. */clave: prxmpt.children;
caída
/*** Caso para aplicar a la clave. * @default undefined */keycase?: "superior" | "Bajo" | "Capital" | "título";
envoltura
/*** Anule el comportamiento predeterminado para envolver el valor. * @default undefined */wrap?: boolean;
espacio
/*** Si es verdadero, no agregue un espacio entre la clave y el valor. * Solo se aplica cuando no se envuelve. * @default falso */nospace?: boolean;
const string = <kv key = "Hello"> World </ kv>;
Hello: World
Cuando los niños contienen múltiples líneas, el valor se representa a partir de una nueva línea de forma predeterminada:
CONST WORLDS = (
<tdq join = {"n"}> <Ext> World1 </ext> <EEXT> WORLD2 </EXT> <EEXT> WORLD3 </EXT>
</tdq>); const string = <kv key = "hello"> {worlds} </ kv>;Hello: """ World1 World2 World3 """
Los elementos HTML están construidos sobre el elemento <tag> . Cada elemento HTML tiene un accesorio html booleano que se establece en falso de forma predeterminada. Cuando html es verdadero, el elemento se representa como HTML. De lo contrario, el elemento se representa como un equivalente de Markdown.
Además, los atributos personalizados se pueden establecer utilizando el Prop attributes .
<tag>
nombre
/*** Nombre de la etiqueta. */nombre: cadena;
noindente
/** * @default falso */noindent?: boolean;
envoltura
/*** Predeterminado es verdadero si el contenido contiene una nueva línea. */envoltura?: boolean;
const tag = <tag name = "mytag"> ¡Hola, mundo! </tag>;
<mytag>Hello, World!</mytag>
Si no se proporcionan niños, la etiqueta se representa como una etiqueta de cierre autocipulante:
const tag = <tag name = "mytag" />;
<mytag />
<br />
// "n" const br = <br />;
const br = <br html />;
<br />
<hr />
ancho
/** * @default 3 */ancho?: número;
carbonizarse
/** * @default "-" */char?: "-" | "_" | "=" | "*";
const hr = <hr />;
---
const hr = <hr />;
<hr />
<a>
href
/*** La URL del enlace. */href: string;
título
/*** Un título para el enlace. */título?: cadena;
const string = <a href = "https://example.com" title = "un título"> ¡Hola, mundo! </a>;
[Hello, World!](https://example.com "A Title")
const string = <a href = "https://example.com" title = "a title" html> hola, mundo! </a>;
<a href="https://example.com" title="A Title">Hello, World!</a>
<img>
SRC
/*** La URL de la imagen. */href: string;
título
/*** Un título para la imagen. */título?: cadena;
const string = <img src = "https://example.com" title = "un título"> ¡Hola, mundo! </img>;
const string = <img src = "https://example.com" title = "A Title" Html> Hello, World! </img>;
<img src="https://example.com" alt="Hello, World!" title="A Title" />
<h1>
const string = <h1> Hello, World! </h1>;
# Hello, World!
const string = <h1 html> hola, mundo! </h1>;
<h1>Hello, World!</h1>
<h2>
const string = <h2> Hello, World! </h2>;
## Hello, World!
const string = <h2 html> hola, mundo! </h2>;
<h2>Hello, World!</h2>
<h3>
const string = <h3> Hello, World! </h3>;
### Hello, World!
const string = <h3 html> hola, mundo! </h3>;
<h3>Hello, World!</h3>
<h4>
const string = <h4> Hello, World! </h4>;
#### Hello, World!
const string = <h4 html> hello, world! </h4>;
<h4>Hello, World!</h4>
<h5>
const string = <h5> Hello, World! </h5>;
##### Hello, World!
const string = <h5 html> hola, mundo! </h5>;
<h5>Hello, World!</h5>
<h6>
const string = <h6> Hello, World! </h6>;
###### Hello, World!
const string = <h6 html> hola, mundo! </h6>;
<h6>Hello, World!</h6>
<ol>
OnlyMarkiflist
/*** Solo incluye marcadores si la lista contiene más de un elemento. * @default false */solo marcariMiSist?: boolean;
const string = ( <Ol> <EEXT> Hello </Text> <Ext> World </Text> </ol>);
1. Hello 2. World
<ul>
OnlyMarkiflist
/*** Solo incluye marcadores si la lista contiene más de un elemento. * @default false */solo marcariMiSist?: boolean;
const string = ( <ul> <Ext> Hola </ext> <EEXT> WORLD </EXT> </ul>);
- Hello - World
<cl>
elementos
elementos: {
/** * @default falso */
revisado?: booleano;
/*** Contenido para renderizar después de la casilla de verificación. */
contenido: prxmpt.children;} []; const string = (
<clitems = {[{content: "hola"}, {content: "world", checked: true},]}
/>);- [ ] Hello - [x] World
<dl>
elementos
/*** Los elementos para renderizar. */elementos: registro <string, prxmpt.children>;
estuche
/*** carcasa para aplicar a cada clave. * @default undefined */término?: "superior" | "Bajo" | "Capital" | "título";
espacio
/*** Número de en blanco forrado para insertar entre cada elemento. * @default 0 */espacio?: número;
envoltura
/*** Anule el comportamiento predeterminado para los valores de envoltura. * @default undefined */wrap?: boolean;
const string = (
<dlitems = {{Hello: "World", Foo: "Bar"}}
/>);Hello: World Foo: Bar
<i>
carbonizarse
/***@default "_"*/char?: "*" | "_";
const string = <i> Hello, World! </i>;
_Hello, World!_
const string = <i html> hola, mundo! </i>;
<i>Hello, World!</i>
<b>
carbonizarse
/***@default "*"*/char?: "*" | "_";
const string = <b> Hello, World! </b>;
**Hello, World!**
const string = <b html> hola, mundo! </b>;
<b>Hello, World!</b>
<s>
const string = <s> Hello, World! </s>;
~~Hello, World!~~
const string = <s html> hello, world! </s>;
<s>Hello, World!</s>
<code>
const string = <code> Hello, World! </code>;
`Hello, World!`
const string = <código html> hello, world! </code>;
<code>Hello, World!</code>
<span>
Cuando se renderiza como texto, <span> simplemente hace que sus hijos sean como <text> :
const string = <span> Hello, World! </span>;
Hello, World!
const string = <span html> hola, mundo! </span>;
<span>Hello, World!</span>
<p>
Cuando se representa como texto, la etiqueta de párrafo agrega una nueva línea al final del elemento:
const string = <p> Hello, World! </p>;
Hello, World!
const string = <p html> hola, mundo! </p>;
<p>Hello, World!</p>
<blockquote>
const string = (
<BlockQuote Join = {"N"}> <Ext> Hello </Ext> <Shace/> <Ext> World! </Ext>
</blockquote>);> Hello > > World!
const string = <BlockQuote html> Hello, World! </BlockQuote>;
<blockquote>Hello, World!</blockquote>
<q>
tipo
/** * @default "double" */type?: "Single" | "Doble" | "retroceso";
El elemento de cotización devuelve una cita triple si los niños contienen una nueva línea, de lo contrario devuelve una sola cita.
const string = <Q> Hello, World! </ Q>;
"Hello, World!"
const string = <Q> Hello <Br /> World </ q>;
""" Hello, World! """
const string = <Q html> Hello, World! </ Q>;
<q>Hello, World!</q>
<pre>
const string = <pre> Hello, World! </pre>;
`` `` `` ¡Hola Mundo! `` `` ``
const string = <pre html> hello, world! </ pre>;
<pre>Hello, World!</pre>
<num>
agregar
/*** Agregue un valor al número. */agregar?: número;
mínimo
/*** Valor mínimo. Aplicado después de 'add'. */min?: número;
máximo
/*** Valor máximo. Aplicado después de 'add'. */max?: número;
fijado
/*** Número de lugares decimales. */arreglado?: número;
const string = <num fijo = {2}> 1 </num>;1.00
const string = <num min = {1}> 0 </num>;1
valor
/** * @default date.now () */valor?: fecha | cadena | número;
dateFormat
/** * @default "Short" */DateFormat?: "Long" | "Medio" | "Corto" | "lleno";
TimeFormat
/** * @default "Short" */TimeFormat?: "Long" | "Medio" | "Corto" | "lleno";
const string = <dateTime />;
September 23, 2023 at 5:17 PM
valor
/** * @default date.now () */valor?: fecha | cadena | número;
formato
/** * @default "Short" */Format?: "Long" | "Medio" | "Corto" | "lleno";
const string = <date />;
September 23, 2023
valor
/** * @default date.now () */valor?: fecha | cadena | número;
formato
/** * @default "Short" */Format?: "Long" | "Medio" | "Corto" | "lleno";
const string = <time />;
5:17 PM
valor
/** * @default date.now () */valor?: fecha | cadena | número;
const string = <año />
2023
valor
/** * @default date.now () */valor?: fecha | cadena | número;
formato
/** * @default "número" */formato?: "número" | "Long" | "Corto" | "angosto";
const string = <mes />
8
const string = <mes format = "long" />
September
const string = <Month Format = "Short" />
Sep
const string = <mes format = "estrecho" />
S
valor
/** * @default date.now () */valor?: fecha | cadena | número;
formato
/** * @default "número" */formato?: "número" | "Long" | "Corto" | "angosto";
const string = <day />
6
const string = <day format = "long" />
Saturday
const string = <day format = "short" />
Sat
const string = <day format = "estrecho" />
S
valor
/** * @default date.now () */valor?: fecha | cadena | número;
ciclo
/** * @default "12" */ciclo?: "12" | "24";
const string = <hora />
5
const string = <hora ciclo = "24">
17
valor
/** * @default date.now () */valor?: fecha | cadena | número;
const string = <minim />
42
valor
/** * @default date.now () */valor?: fecha | cadena | número;
const string = <Second />
42
valor
/** * @default date.now () */valor?: fecha | cadena | número;
const string = <MilliseCond />
999
valor
/*** El final de la duración. * @default date.now () */valor?: fecha | cadena | número;
desde
/*** El comienzo de la duración. */Desde: fecha | cadena | número;
const string = <duración desde = {"septiembre 2021"} />2 years
datos
/*** Los datos para Stringify. */Datos: NestedOptionALJSONValue;
bonito
/** * @default falso */bonito?: boolean;
const string = <json data = {{Hello: "World"}} Pretty />;{
"Hello": "World"
}datos
/*** Los datos para Stringify. */Datos: NestedOptionALJSONValue;
nostartmarker
/** * @default false */nostartmarker?: boolean;
secuencia
/** * @default false */secuenceindent?: boolean;
const string = <yaml data = {{Hello: "World"}} />;--- hello: world
<upper>
const string = <protes> hello, world! </powe>;
HELLO, WORLD!
<lower>
const string = <mind> hola, mundo! </lowr>;
hello, world!
<capital>
const string = <capital> hello, world! </capital>;
Hello, world!
<title>
const string = <title> Hello, World! </title>;
Hello, World!
// "¡Hola, mundo!" Const String = <Crime> ¡Hola, mundo! </crim>;
Hello, World!
con
/*** Un valor para aplicar tanto al `prefijo 'como al` sufijo`. */con: prxmpt.children;
const string = <frame with = "-"> ¡Hola, mundo! </marcal>;
-- Hello, World! --
<lined>
const string = ( <Lined> <Ext> Hello </Text> <Ext> World! </Text> </lined>);
Hello World!
<spaced>
const string = ( <spaced> <Ext> Hola </ext> <Ext> World! </Text> </spaced>);
Hello World!
<csl>
espacio
/** * @default falso */nospace?: boolean;
const string = ( <csl> <Ext> Hola </ext> <Ext> World </Text> </csl>);
hello, world
const string = ( <CSL Nospace> <Ext> Hello </Text> <Ext> World </Text> </csl>);
hello,world
<union>
espacio
/** * @default falso */nospace?: boolean;
const string = ( <Inion> <Ext> Hello </Text> <Ext> World </Text> </ion>);
hello | world
const string = ( <NIVE NOSPACE> <EEXT> Hello </Text> <Ext> World </Text> </ion>);
hello|world
divisor
/** * @default "---" */divisor?: cadena;
marco
/*** Si agregue divisores antes y después del cuerpo. * @default false */frame?: boolean;
const string = ( <Sected> <Ext> Hello </Text> <Ext> World! </Text> </sected>);
Hello --- World!
Los conjuntos ajustan automáticamente los separadores utilizados en función del número de niños proporcionados.
<and>
const string = ( <y> <ext> a </ext> </y>);
a
const string = ( <y> <ext> a </ext> <exting> b </text> </y>);
a and b
const string = ( <y> <ext> a </ext> <ext> b </ext> <etx> c </text> </y>);
a, b, and c
<andor>
const string = ( <aNDOR> <EEXT> A </EEXT> <EEXT> B </EXT> <EEXT> C </EXT> </andor>);
a, b, and/or c
<or>
const string = ( <o> <ext> a </ext> <ext> b </ext> <ext> c </text> </o>);
a, b, or c
<nor>
const string = ( <Nor> <Ext> A </ext> <EEXT> B </EXT> <EEXT> C </EXT> </nor>);
a, b, nor c
El elemento <cap> le permite limitar la longitud de una cadena proporcionando una función splitter y un número max de "unidades" para permitir.
máximo
/*** Las "unidades" máximas para incluir. * @default infinity */max?: número;
disidente
/*** Una función que divide una cadena en "unidades". * @default "Chars" */Splitter?: "Párrafos" | "Líneas" | "Espacios" | "Palabras" | "Comas" | "Chars" | (String: String) => String [];
elipsis
/*** Una cadena para agregar al final si se alcanza el máximo. * Esta cadena está incluida en el recuento máximo. * Si `True`," ... "se usa. * @default undefined */ellipsis?: cadena | verdadero;
const string = <cap max = {5}> Hello, World! </ap>;Hello
El elemento <priority> es como una consulta de medios CSS basada en ancho para cadenas.
En lugar de proporcionar una lista de niños, <priority> espera una lista de elementos, cada uno de los cuales puede tener una prioridad. Las prioridades más altas se representan primero (como z-index en CSS), y cada elemento tiene una prioridad predeterminada de 0. También se proporcionan varias estrategias para ajustar cómo se priorizan los elementos.
Los elementos prioritarios también pueden estar anidados, lo que permite un control de grano extremadamente fino sobre qué contenido se representa. Se proporcionan varios ejemplos en el directorio de ejemplo de prioridad.
máximo
/*** Las "unidades" máximas para incluir. * @default infinity */max?: número;
encimera
/*** Una función que devuelve el número de "unidades" en una cadena. * @default (string: string) => string.length */contador?: (string: string) => número;
elementos
/*** Los elementos para renderizar, en orden de prioridad. */elementos: (prxmpt.children | {
/*** La prioridad de este artículo. Los elementos de mayor prioridad se incluyen primero. * @default 0 */
P?: número;
/*** El contenido de renderizar. */
Contenido: ((Capacidad: Número) => PrxMpt.Children) | Prxmpt.children;}) [];estrategia
La estrategia para usar al priorizar elementos.
Si se proporcionan múltiples estrategias, se prueban estrategias posteriores para romper los lazos.
"priority" :
Priorizar los elementos por la prioridad proporcionada.
Una vez que se alcanza el máximo, continúe verificando si los artículos restantes se ajustan.
"order-asc" :
Priorizar los elementos por el pedido proporcionado.
Una vez que se alcanza el máximo, continúe verificando si los artículos restantes se ajustan.
"order-desc" :
Priorice los elementos en el reverso del pedido proporcionado.
Una vez que se alcanza el máximo, continúe verificando si los artículos restantes se ajustan.
"size-asc" :
Priorice los artículos en orden de tamaño, más pequeño a más grande.
Use si desea incluir tantos elementos como sea posible.
"size-desc" :
Los artículos priorizados en orden de tamaño, más grande a más pequeño.
Use si desea incluir la menor cantidad de artículos posible.
/** * @default ["prioridad", "orden-asc"] */estrategia?: prioritystrategy | Prioritystrategy [];
veloz
/*** Si `True`, no omita los artículos después de alcanzar el máximo. * @default false */noskip?: boolean;
const string = (
<priorityMax = {15} Join = {"n"} items = {[{p: 2 Content: "Test 1"}, {// p: 0 es el contenido predeterminado: "Esta es una cadena súper larga que ganó" t ajuste. "}, {p: 1, contenido:" prueba 3 "}]} />);Test 1 Test 3
createElement import {CreateElement} de "@AutoSsey/PrxMpt"; const String = CreateElement ("Text", {}, "¡Hola, mundo!");Hello, World!
render import {render} de "@autossey/prxmpt"; const string = render (
<Ext> ¡Hola, mundo! </text>);Hello, World!
hasChildren Devuelve true si el objeto de accesorios proporcionado tiene una propiedad children .
import {Haschildren} de "@AutoSsey/Prxmpt"; if (HasChildren ({niños: "¡Hola, mundo!"})) {
// ...}isChildren Devuelve true si el valor proporcionado es un elemento PRXMPT válido.
import {isChildren} de "@autossey/prxmpt"; if (isChildren ("¡Hola, mundo!")) {
// ...}split Dividir children en separator . Si separator está undefined , no se produce división.
import {split} de "@autossey/prxmpt"; const children = (
<Lined> <Ext> Hello </Text> <Ext> World! </Text>
</lined>); // ["Hola", "¡Mundo!"] Const Strings = Split (niños, "n");paragraphs Divir children en "nn" .
lines Dividir children en "n" .
spaces Dividir children en espacios en blanco.
words Dividir children en los límites de las palabras.
commas Dividir children "," .
characters Dividir children en "" .
@SWC/Core: Alternativa súper rápida para Babel
Array tipada: hacer que cualquier valor sea una matriz
tipos-json: comprobación de tipos para objetos JSON
Yaml: JavaScript Parser y Stringifier para YAML
@AutoSsey/Eslint-Config: una base para proyectos que usan Eslint.
@AutoSsey/TSConfig: una colección de tsconfigs base para varios tipos de proyectos.
@Jest/Globals
@SWC/Jest: SWC Integración para Jest
@tipos/nodo: definiciones de typeScript para node.js
Eslint: un verificador de patrones basado en AST para JavaScript.
Jest: Deliciosas pruebas de JavaScript.
TypeScript: TypeScript es un lenguaje para el desarrollo de JavaScript de escala de aplicación
MIT - La licencia del MIT
