@tiendanube/nube-sdk-ui 0.4.0 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -23,11 +23,15 @@ __export(index_exports, {
23
23
  box: () => box,
24
24
  button: () => button,
25
25
  check: () => check,
26
- col: () => col,
26
+ checkbox: () => checkbox,
27
+ column: () => column,
27
28
  field: () => field,
28
29
  fragment: () => fragment,
30
+ image: () => image,
29
31
  img: () => img,
30
32
  row: () => row,
33
+ text: () => text,
34
+ textarea: () => textarea,
31
35
  txt: () => txt,
32
36
  txtarea: () => txtarea
33
37
  });
@@ -39,8 +43,8 @@ var box = (props) => ({
39
43
  ...props
40
44
  });
41
45
 
42
- // src/components/col.ts
43
- var col = (props) => ({
46
+ // src/components/column.ts
47
+ var column = (props) => ({
44
48
  type: "col",
45
49
  ...props
46
50
  });
@@ -63,29 +67,45 @@ var fragment = (props) => ({
63
67
  ...props
64
68
  });
65
69
 
66
- // src/components/img.ts
70
+ // src/components/image.ts
67
71
  var img = (props) => ({
68
72
  type: "img",
69
73
  ...props
70
74
  });
75
+ var image = (props) => ({
76
+ type: "img",
77
+ ...props
78
+ });
71
79
 
72
- // src/components/txt.ts
80
+ // src/components/text.ts
81
+ var text = (props) => ({
82
+ type: "txt",
83
+ ...props
84
+ });
73
85
  var txt = (props) => ({
74
86
  type: "txt",
75
87
  ...props
76
88
  });
77
89
 
78
- // src/components/check.ts
90
+ // src/components/checkbox.ts
79
91
  var check = (props) => ({
80
92
  type: "check",
81
93
  ...props
82
94
  });
95
+ var checkbox = (props) => ({
96
+ type: "check",
97
+ ...props
98
+ });
83
99
 
84
- // src/components/txtarea.ts
100
+ // src/components/textarea.ts
85
101
  var txtarea = (props) => ({
86
102
  type: "txtarea",
87
103
  ...props
88
104
  });
105
+ var textarea = (props) => ({
106
+ type: "txtarea",
107
+ ...props
108
+ });
89
109
 
90
110
  // src/components/button.ts
91
111
  var button = (props) => ({
@@ -97,11 +117,15 @@ var button = (props) => ({
97
117
  box,
98
118
  button,
99
119
  check,
100
- col,
120
+ checkbox,
121
+ column,
101
122
  field,
102
123
  fragment,
124
+ image,
103
125
  img,
104
126
  row,
127
+ text,
128
+ textarea,
105
129
  txt,
106
130
  txtarea
107
131
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/components/box.ts","../src/components/col.ts","../src/components/row.ts","../src/components/field.ts","../src/components/fragment.ts","../src/components/img.ts","../src/components/txt.ts","../src/components/check.ts","../src/components/txtarea.ts","../src/components/button.ts"],"sourcesContent":["export * from \"./components/box\";\nexport * from \"./components/col\";\nexport * from \"./components/row\";\nexport * from \"./components/field\";\nexport * from \"./components/fragment\";\nexport * from \"./components/img\";\nexport * from \"./components/txt\";\nexport * from \"./components/check\";\nexport * from \"./components/txtarea\";\nexport * from \"./components/button\";\n","import type {\n\tNubeComponentBox,\n\tNubeComponentBoxProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `box` component.\n *\n * A `box` is a flexible container that can be used for layout purposes.\n * It supports properties like width, height, padding, margin, and flex-based alignment.\n *\n * @param props - The properties for configuring the box component.\n * @returns A `NubeComponentBox` object representing the box component.\n */\nexport const box = (props: NubeComponentBoxProps): NubeComponentBox => ({\n\ttype: \"box\",\n\t...props,\n});\n","import type {\n\tNubeComponentCol,\n\tNubeComponentColProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `col` (column) component.\n *\n * A `col` is a flexible column container that can be used for structuring layouts.\n * It inherits most properties from `box`, except for the `direction` property.\n *\n * @param props - The properties for configuring the column component.\n * @returns A `NubeComponentCol` object representing the column component.\n */\nexport const col = (props: NubeComponentColProps): NubeComponentCol => ({\n\ttype: \"col\",\n\t...props,\n});\n","import type {\n\tNubeComponentRow,\n\tNubeComponentRowProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `row` component.\n *\n * A `row` is a flexible container used for structuring layouts in a horizontal direction.\n * It inherits most properties from `box`, except for the `direction` property.\n *\n * @param props - The properties for configuring the row component.\n * @returns A `NubeComponentRow` object representing the row component.\n */\nexport const row = (props: NubeComponentRowProps): NubeComponentRow => ({\n\ttype: \"row\",\n\t...props,\n});\n","import type {\n\tNubeComponentField,\n\tNubeComponentFieldProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `field` component.\n *\n * A `field` represents an input element in a form, such as text fields, dropdowns, or checkboxes.\n * It supports properties like `name`, `label`, and event handlers (`onChange`, `onBlur`, `onFocus`).\n *\n * @param props - The properties for configuring the field component.\n * @returns A `NubeComponentField` object representing the form field.\n */\nexport const field = (props: NubeComponentFieldProps): NubeComponentField => ({\n\ttype: \"field\",\n\t...props,\n});\n","import type {\n\tNubeComponentFragment,\n\tNubeComponentFragmentProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `fragment` component.\n *\n * A `fragment` is a logical grouping element that allows multiple children\n * to be wrapped without introducing an additional DOM node.\n *\n * @param props - The properties for configuring the fragment component.\n * @returns A `NubeComponentFragment` object representing the fragment.\n */\nexport const fragment = (\n\tprops: NubeComponentFragmentProps,\n): NubeComponentFragment => ({\n\ttype: \"fragment\",\n\t...props,\n});\n","import type {\n\tNubeComponentImg,\n\tNubeComponentImgProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates an `img` (image) component.\n *\n * The `img` component is used to display images. It supports properties such as\n * `src`, `alt`, `width`, `height`, and responsive `sources` for different screen sizes.\n *\n * @param props - The properties for configuring the image component.\n * @returns A `NubeComponentImg` object representing the image component.\n */\nexport const img = (props: NubeComponentImgProps): NubeComponentImg => ({\n\ttype: \"img\",\n\t...props,\n});\n","import type {\n\tNubeComponentTxt,\n\tNubeComponentTxtProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `txt` (text) component.\n *\n * The `txt` component is used to render text with optional styling.\n * It supports properties such as `color`, `background`, `heading` levels (h1-h6),\n * text formatting `modifiers` (bold, italic, etc.), and inline display.\n *\n * @param props - The properties for configuring the text component.\n * @returns A `NubeComponentTxt` object representing the text component.\n */\nexport const txt = (props: NubeComponentTxtProps): NubeComponentTxt => ({\n\ttype: \"txt\",\n\t...props,\n});\n","import type {\n\tNubeComponentCheck,\n\tNubeComponentCheckProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `check` component.\n *\n * A `check` represents a selectable field that can be toggled between checked and unchecked states.\n * It is typically used to allow users to select one or more options.\n * Supports properties such as `name`, `label`, `checked`, and event handlers (`onChange`).\n *\n * @param props - The properties for configuring the checkbox component.\n * @returns A `NubeComponentCheck` object representing the checkbox.\n */\nexport const check = (props: NubeComponentCheckProps): NubeComponentCheck => ({\n\ttype: \"check\",\n\t...props,\n});\n","import type {\n\tNubeComponentTxtArea,\n\tNubeComponentTxtAreaProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `txtarea` component.\n *\n * A `txtarea` represents a multi-line text input field that allows users to enter longer texts.\n * It supports properties such as `name`, `value`, and event handlers (`onChange`, `onBlur`, `onFocus`).\n *\n * @param props - The properties for configuring the textarea component.\n * @returns A `NubeComponentTxtArea` object representing the textarea component.\n */\nexport const txtarea = (\n\tprops: NubeComponentTxtAreaProps,\n): NubeComponentTxtArea => ({\n\ttype: \"txtarea\",\n\t...props,\n});\n","import type {\n\tNubeComponentButton,\n\tNubeComponentButtonProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `button` component.\n *\n * A `button` represents a clickable element typically used to trigger an action or submit a form.\n * It supports properties such as `text`, `onClick`, and style configurations.\n *\n * @param props - The properties for configuring the button component.\n * @returns A `NubeComponentButton` object representing the button component.\n */\nexport const button = (\n\tprops: NubeComponentButtonProps,\n): NubeComponentButton => ({\n\ttype: \"button\",\n\t...props,\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACcO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,QAAQ,CAAC,WAAwD;AAAA,EAC7E,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,WAAW,CACvB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACLO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACFO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,QAAQ,CAAC,WAAwD;AAAA,EAC7E,MAAM;AAAA,EACN,GAAG;AACJ;;;ACJO,IAAM,UAAU,CACtB,WAC2B;AAAA,EAC3B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACLO,IAAM,SAAS,CACrB,WAC0B;AAAA,EAC1B,MAAM;AAAA,EACN,GAAG;AACJ;","names":[]}
1
+ {"version":3,"sources":["../src/index.ts","../src/components/box.ts","../src/components/column.ts","../src/components/row.ts","../src/components/field.ts","../src/components/fragment.ts","../src/components/image.ts","../src/components/text.ts","../src/components/checkbox.ts","../src/components/textarea.ts","../src/components/button.ts"],"sourcesContent":["export * from \"./components/box\";\nexport * from \"./components/column\";\nexport * from \"./components/row\";\nexport * from \"./components/field\";\nexport * from \"./components/fragment\";\nexport * from \"./components/image\";\nexport * from \"./components/text\";\nexport * from \"./components/checkbox\";\nexport * from \"./components/textarea\";\nexport * from \"./components/button\";\n","import type {\n\tNubeComponentBox,\n\tNubeComponentBoxProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `box` component.\n *\n * A `box` is a flexible container that can be used for layout purposes.\n * It supports properties like width, height, padding, margin, and flex-based alignment.\n *\n * @param props - The properties for configuring the box component.\n * @returns A `NubeComponentBox` object representing the box component.\n */\nexport const box = (props: NubeComponentBoxProps): NubeComponentBox => ({\n\ttype: \"box\",\n\t...props,\n});\n","import type {\n\tNubeComponentColumn,\n\tNubeComponentColumnProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `column` component.\n *\n * A `column` is a flexible column container that can be used for structuring layouts.\n * It inherits most properties from `box`, except for the `direction` property.\n *\n * @param props - The properties for configuring the column component.\n * @returns A `NubeComponentColumn` object representing the column component.\n */\nexport const column = (\n\tprops: NubeComponentColumnProps,\n): NubeComponentColumn => ({\n\ttype: \"col\",\n\t...props,\n});\n","import type {\n\tNubeComponentRow,\n\tNubeComponentRowProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `row` component.\n *\n * A `row` is a flexible container used for structuring layouts in a horizontal direction.\n * It inherits most properties from `box`, except for the `direction` property.\n *\n * @param props - The properties for configuring the row component.\n * @returns A `NubeComponentRow` object representing the row component.\n */\nexport const row = (props: NubeComponentRowProps): NubeComponentRow => ({\n\ttype: \"row\",\n\t...props,\n});\n","import type {\n\tNubeComponentField,\n\tNubeComponentFieldProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `field` component.\n *\n * A `field` represents an input element in a form, such as text fields, dropdowns, or checkboxes.\n * It supports properties like `name`, `label`, and event handlers (`onChange`, `onBlur`, `onFocus`).\n *\n * @param props - The properties for configuring the field component.\n * @returns A `NubeComponentField` object representing the form field.\n */\nexport const field = (props: NubeComponentFieldProps): NubeComponentField => ({\n\ttype: \"field\",\n\t...props,\n});\n","import type {\n\tNubeComponentFragment,\n\tNubeComponentFragmentProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `fragment` component.\n *\n * A `fragment` is a logical grouping element that allows multiple children\n * to be wrapped without introducing an additional DOM node.\n *\n * @param props - The properties for configuring the fragment component.\n * @returns A `NubeComponentFragment` object representing the fragment.\n */\nexport const fragment = (\n\tprops: NubeComponentFragmentProps,\n): NubeComponentFragment => ({\n\ttype: \"fragment\",\n\t...props,\n});\n","import type {\n\tNubeComponentImage,\n\tNubeComponentImageProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * @deprecated This component has been deprecated since version `0.8.0`. Please use the `image` component instead.\n */\nexport const img = (props: NubeComponentImageProps): NubeComponentImage => ({\n\ttype: \"img\",\n\t...props,\n});\n\n/**\n * Creates an `image` (image) component.\n *\n * The `image` component is used to display images. It supports properties such as\n * `src`, `alt`, `width`, `height`, and responsive `sources` for different screen sizes.\n *\n * @param props - The properties for configuring the image component.\n * @returns A `NubeComponentImage` object representing the image component.\n */\nexport const image = (props: NubeComponentImageProps): NubeComponentImage => ({\n\ttype: \"img\",\n\t...props,\n});\n","import type {\n\tNubeComponentText,\n\tNubeComponentTextProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `txt` (text) component.\n *\n * The `txt` component is used to render text with optional styling.\n * It supports properties such as `color`, `background`, `heading` levels (h1-h6),\n * text formatting `modifiers` (bold, italic, etc.), and inline display.\n *\n * @param props - The properties for configuring the text component.\n * @returns A `NubeComponentTxt` object representing the text component.\n */\nexport const text = (props: NubeComponentTextProps): NubeComponentText => ({\n\ttype: \"txt\",\n\t...props,\n});\n\n/**\n * @deprecated This component has been deprecated since version `0.8.0`. Please use the `text` component instead.\n */\nexport const txt = (props: NubeComponentTextProps): NubeComponentText => ({\n\ttype: \"txt\",\n\t...props,\n});\n","import type {\n\tNubeComponentCheckbox,\n\tNubeComponentCheckboxProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * @deprecated This component has been deprecated since version `0.8.0`. Please use the `checkbox` component instead.\n */\nexport const check = (\n\tprops: NubeComponentCheckboxProps,\n): NubeComponentCheckbox => ({\n\ttype: \"check\",\n\t...props,\n});\n\n/**\n * Creates a `checkbox` component.\n *\n * A `checkbox` represents a selectable field that can be toggled between checked and unchecked states.\n * It is typically used to allow users to select one or more options.\n * Supports properties such as `name`, `label`, `checked`, and event handlers (`onChange`).\n *\n * @param props - The properties for configuring the checkbox component.\n * @returns A `NubeComponentCheckbox` object representing the checkbox.\n */\nexport const checkbox = (\n\tprops: NubeComponentCheckboxProps,\n): NubeComponentCheckbox => ({\n\ttype: \"check\",\n\t...props,\n});\n","import type {\n\tNubeComponentTextarea,\n\tNubeComponentTextareaProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * @deprecated This component has been deprecated since version `0.8.0`. Please use the `textarea` component instead.\n */\nexport const txtarea = (\n\tprops: NubeComponentTextareaProps,\n): NubeComponentTextarea => ({\n\ttype: \"txtarea\",\n\t...props,\n});\n\n/**\n * Creates a `textarea` component.\n *\n * A `textarea` represents a multi-line text input field that allows users to enter longer texts.\n * It supports properties such as `name`, `value`, and event handlers (`onChange`, `onBlur`, `onFocus`).\n *\n * @param props - The properties for configuring the textarea component.\n * @returns A `NubeComponentTextarea` object representing the textarea component.\n */\nexport const textarea = (\n\tprops: NubeComponentTextareaProps,\n): NubeComponentTextarea => ({\n\ttype: \"txtarea\",\n\t...props,\n});\n","import type {\n\tNubeComponentButton,\n\tNubeComponentButtonProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `button` component.\n *\n * A `button` represents a clickable element typically used to trigger an action or submit a form.\n * It supports properties such as `text`, `onClick`, and style configurations.\n *\n * @param props - The properties for configuring the button component.\n * @returns A `NubeComponentButton` object representing the button component.\n */\nexport const button = (\n\tprops: NubeComponentButtonProps,\n): NubeComponentButton => ({\n\ttype: \"button\",\n\t...props,\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACcO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,SAAS,CACrB,WAC0B;AAAA,EAC1B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACLO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,QAAQ,CAAC,WAAwD;AAAA,EAC7E,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,WAAW,CACvB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACXO,IAAM,MAAM,CAAC,WAAwD;AAAA,EAC3E,MAAM;AAAA,EACN,GAAG;AACJ;AAWO,IAAM,QAAQ,CAAC,WAAwD;AAAA,EAC7E,MAAM;AAAA,EACN,GAAG;AACJ;;;ACVO,IAAM,OAAO,CAAC,WAAsD;AAAA,EAC1E,MAAM;AAAA,EACN,GAAG;AACJ;AAKO,IAAM,MAAM,CAAC,WAAsD;AAAA,EACzE,MAAM;AAAA,EACN,GAAG;AACJ;;;AClBO,IAAM,QAAQ,CACpB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;AAYO,IAAM,WAAW,CACvB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACtBO,IAAM,UAAU,CACtB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;AAWO,IAAM,WAAW,CACvB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACfO,IAAM,SAAS,CACrB,WAC0B;AAAA,EAC1B,MAAM;AAAA,EACN,GAAG;AACJ;","names":[]}
package/dist/index.d.cts CHANGED
@@ -1,4 +1,4 @@
1
- import { NubeComponentBoxProps, NubeComponentBox, NubeComponentColProps, NubeComponentCol, NubeComponentRowProps, NubeComponentRow, NubeComponentFieldProps, NubeComponentField, NubeComponentFragmentProps, NubeComponentFragment, NubeComponentImgProps, NubeComponentImg, NubeComponentTxtProps, NubeComponentTxt, NubeComponentCheckProps, NubeComponentCheck, NubeComponentTxtAreaProps, NubeComponentTxtArea, NubeComponentButtonProps, NubeComponentButton } from '@tiendanube/nube-sdk-types';
1
+ import { NubeComponentBoxProps, NubeComponentBox, NubeComponentColumnProps, NubeComponentColumn, NubeComponentRowProps, NubeComponentRow, NubeComponentFieldProps, NubeComponentField, NubeComponentFragmentProps, NubeComponentFragment, NubeComponentImageProps, NubeComponentImage, NubeComponentTextProps, NubeComponentText, NubeComponentCheckboxProps, NubeComponentCheckbox, NubeComponentTextareaProps, NubeComponentTextarea, NubeComponentButtonProps, NubeComponentButton } from '@tiendanube/nube-sdk-types';
2
2
 
3
3
  /**
4
4
  * Creates a `box` component.
@@ -12,15 +12,15 @@ import { NubeComponentBoxProps, NubeComponentBox, NubeComponentColProps, NubeCom
12
12
  declare const box: (props: NubeComponentBoxProps) => NubeComponentBox;
13
13
 
14
14
  /**
15
- * Creates a `col` (column) component.
15
+ * Creates a `column` component.
16
16
  *
17
- * A `col` is a flexible column container that can be used for structuring layouts.
17
+ * A `column` is a flexible column container that can be used for structuring layouts.
18
18
  * It inherits most properties from `box`, except for the `direction` property.
19
19
  *
20
20
  * @param props - The properties for configuring the column component.
21
- * @returns A `NubeComponentCol` object representing the column component.
21
+ * @returns A `NubeComponentColumn` object representing the column component.
22
22
  */
23
- declare const col: (props: NubeComponentColProps) => NubeComponentCol;
23
+ declare const column: (props: NubeComponentColumnProps) => NubeComponentColumn;
24
24
 
25
25
  /**
26
26
  * Creates a `row` component.
@@ -56,15 +56,19 @@ declare const field: (props: NubeComponentFieldProps) => NubeComponentField;
56
56
  declare const fragment: (props: NubeComponentFragmentProps) => NubeComponentFragment;
57
57
 
58
58
  /**
59
- * Creates an `img` (image) component.
59
+ * @deprecated This component has been deprecated since version `0.8.0`. Please use the `image` component instead.
60
+ */
61
+ declare const img: (props: NubeComponentImageProps) => NubeComponentImage;
62
+ /**
63
+ * Creates an `image` (image) component.
60
64
  *
61
- * The `img` component is used to display images. It supports properties such as
65
+ * The `image` component is used to display images. It supports properties such as
62
66
  * `src`, `alt`, `width`, `height`, and responsive `sources` for different screen sizes.
63
67
  *
64
68
  * @param props - The properties for configuring the image component.
65
- * @returns A `NubeComponentImg` object representing the image component.
69
+ * @returns A `NubeComponentImage` object representing the image component.
66
70
  */
67
- declare const img: (props: NubeComponentImgProps) => NubeComponentImg;
71
+ declare const image: (props: NubeComponentImageProps) => NubeComponentImage;
68
72
 
69
73
  /**
70
74
  * Creates a `txt` (text) component.
@@ -76,30 +80,42 @@ declare const img: (props: NubeComponentImgProps) => NubeComponentImg;
76
80
  * @param props - The properties for configuring the text component.
77
81
  * @returns A `NubeComponentTxt` object representing the text component.
78
82
  */
79
- declare const txt: (props: NubeComponentTxtProps) => NubeComponentTxt;
83
+ declare const text: (props: NubeComponentTextProps) => NubeComponentText;
84
+ /**
85
+ * @deprecated This component has been deprecated since version `0.8.0`. Please use the `text` component instead.
86
+ */
87
+ declare const txt: (props: NubeComponentTextProps) => NubeComponentText;
80
88
 
81
89
  /**
82
- * Creates a `check` component.
90
+ * @deprecated This component has been deprecated since version `0.8.0`. Please use the `checkbox` component instead.
91
+ */
92
+ declare const check: (props: NubeComponentCheckboxProps) => NubeComponentCheckbox;
93
+ /**
94
+ * Creates a `checkbox` component.
83
95
  *
84
- * A `check` represents a selectable field that can be toggled between checked and unchecked states.
96
+ * A `checkbox` represents a selectable field that can be toggled between checked and unchecked states.
85
97
  * It is typically used to allow users to select one or more options.
86
98
  * Supports properties such as `name`, `label`, `checked`, and event handlers (`onChange`).
87
99
  *
88
100
  * @param props - The properties for configuring the checkbox component.
89
- * @returns A `NubeComponentCheck` object representing the checkbox.
101
+ * @returns A `NubeComponentCheckbox` object representing the checkbox.
90
102
  */
91
- declare const check: (props: NubeComponentCheckProps) => NubeComponentCheck;
103
+ declare const checkbox: (props: NubeComponentCheckboxProps) => NubeComponentCheckbox;
92
104
 
93
105
  /**
94
- * Creates a `txtarea` component.
106
+ * @deprecated This component has been deprecated since version `0.8.0`. Please use the `textarea` component instead.
107
+ */
108
+ declare const txtarea: (props: NubeComponentTextareaProps) => NubeComponentTextarea;
109
+ /**
110
+ * Creates a `textarea` component.
95
111
  *
96
- * A `txtarea` represents a multi-line text input field that allows users to enter longer texts.
112
+ * A `textarea` represents a multi-line text input field that allows users to enter longer texts.
97
113
  * It supports properties such as `name`, `value`, and event handlers (`onChange`, `onBlur`, `onFocus`).
98
114
  *
99
115
  * @param props - The properties for configuring the textarea component.
100
- * @returns A `NubeComponentTxtArea` object representing the textarea component.
116
+ * @returns A `NubeComponentTextarea` object representing the textarea component.
101
117
  */
102
- declare const txtarea: (props: NubeComponentTxtAreaProps) => NubeComponentTxtArea;
118
+ declare const textarea: (props: NubeComponentTextareaProps) => NubeComponentTextarea;
103
119
 
104
120
  /**
105
121
  * Creates a `button` component.
@@ -112,4 +128,4 @@ declare const txtarea: (props: NubeComponentTxtAreaProps) => NubeComponentTxtAre
112
128
  */
113
129
  declare const button: (props: NubeComponentButtonProps) => NubeComponentButton;
114
130
 
115
- export { box, button, check, col, field, fragment, img, row, txt, txtarea };
131
+ export { box, button, check, checkbox, column, field, fragment, image, img, row, text, textarea, txt, txtarea };
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { NubeComponentBoxProps, NubeComponentBox, NubeComponentColProps, NubeComponentCol, NubeComponentRowProps, NubeComponentRow, NubeComponentFieldProps, NubeComponentField, NubeComponentFragmentProps, NubeComponentFragment, NubeComponentImgProps, NubeComponentImg, NubeComponentTxtProps, NubeComponentTxt, NubeComponentCheckProps, NubeComponentCheck, NubeComponentTxtAreaProps, NubeComponentTxtArea, NubeComponentButtonProps, NubeComponentButton } from '@tiendanube/nube-sdk-types';
1
+ import { NubeComponentBoxProps, NubeComponentBox, NubeComponentColumnProps, NubeComponentColumn, NubeComponentRowProps, NubeComponentRow, NubeComponentFieldProps, NubeComponentField, NubeComponentFragmentProps, NubeComponentFragment, NubeComponentImageProps, NubeComponentImage, NubeComponentTextProps, NubeComponentText, NubeComponentCheckboxProps, NubeComponentCheckbox, NubeComponentTextareaProps, NubeComponentTextarea, NubeComponentButtonProps, NubeComponentButton } from '@tiendanube/nube-sdk-types';
2
2
 
3
3
  /**
4
4
  * Creates a `box` component.
@@ -12,15 +12,15 @@ import { NubeComponentBoxProps, NubeComponentBox, NubeComponentColProps, NubeCom
12
12
  declare const box: (props: NubeComponentBoxProps) => NubeComponentBox;
13
13
 
14
14
  /**
15
- * Creates a `col` (column) component.
15
+ * Creates a `column` component.
16
16
  *
17
- * A `col` is a flexible column container that can be used for structuring layouts.
17
+ * A `column` is a flexible column container that can be used for structuring layouts.
18
18
  * It inherits most properties from `box`, except for the `direction` property.
19
19
  *
20
20
  * @param props - The properties for configuring the column component.
21
- * @returns A `NubeComponentCol` object representing the column component.
21
+ * @returns A `NubeComponentColumn` object representing the column component.
22
22
  */
23
- declare const col: (props: NubeComponentColProps) => NubeComponentCol;
23
+ declare const column: (props: NubeComponentColumnProps) => NubeComponentColumn;
24
24
 
25
25
  /**
26
26
  * Creates a `row` component.
@@ -56,15 +56,19 @@ declare const field: (props: NubeComponentFieldProps) => NubeComponentField;
56
56
  declare const fragment: (props: NubeComponentFragmentProps) => NubeComponentFragment;
57
57
 
58
58
  /**
59
- * Creates an `img` (image) component.
59
+ * @deprecated This component has been deprecated since version `0.8.0`. Please use the `image` component instead.
60
+ */
61
+ declare const img: (props: NubeComponentImageProps) => NubeComponentImage;
62
+ /**
63
+ * Creates an `image` (image) component.
60
64
  *
61
- * The `img` component is used to display images. It supports properties such as
65
+ * The `image` component is used to display images. It supports properties such as
62
66
  * `src`, `alt`, `width`, `height`, and responsive `sources` for different screen sizes.
63
67
  *
64
68
  * @param props - The properties for configuring the image component.
65
- * @returns A `NubeComponentImg` object representing the image component.
69
+ * @returns A `NubeComponentImage` object representing the image component.
66
70
  */
67
- declare const img: (props: NubeComponentImgProps) => NubeComponentImg;
71
+ declare const image: (props: NubeComponentImageProps) => NubeComponentImage;
68
72
 
69
73
  /**
70
74
  * Creates a `txt` (text) component.
@@ -76,30 +80,42 @@ declare const img: (props: NubeComponentImgProps) => NubeComponentImg;
76
80
  * @param props - The properties for configuring the text component.
77
81
  * @returns A `NubeComponentTxt` object representing the text component.
78
82
  */
79
- declare const txt: (props: NubeComponentTxtProps) => NubeComponentTxt;
83
+ declare const text: (props: NubeComponentTextProps) => NubeComponentText;
84
+ /**
85
+ * @deprecated This component has been deprecated since version `0.8.0`. Please use the `text` component instead.
86
+ */
87
+ declare const txt: (props: NubeComponentTextProps) => NubeComponentText;
80
88
 
81
89
  /**
82
- * Creates a `check` component.
90
+ * @deprecated This component has been deprecated since version `0.8.0`. Please use the `checkbox` component instead.
91
+ */
92
+ declare const check: (props: NubeComponentCheckboxProps) => NubeComponentCheckbox;
93
+ /**
94
+ * Creates a `checkbox` component.
83
95
  *
84
- * A `check` represents a selectable field that can be toggled between checked and unchecked states.
96
+ * A `checkbox` represents a selectable field that can be toggled between checked and unchecked states.
85
97
  * It is typically used to allow users to select one or more options.
86
98
  * Supports properties such as `name`, `label`, `checked`, and event handlers (`onChange`).
87
99
  *
88
100
  * @param props - The properties for configuring the checkbox component.
89
- * @returns A `NubeComponentCheck` object representing the checkbox.
101
+ * @returns A `NubeComponentCheckbox` object representing the checkbox.
90
102
  */
91
- declare const check: (props: NubeComponentCheckProps) => NubeComponentCheck;
103
+ declare const checkbox: (props: NubeComponentCheckboxProps) => NubeComponentCheckbox;
92
104
 
93
105
  /**
94
- * Creates a `txtarea` component.
106
+ * @deprecated This component has been deprecated since version `0.8.0`. Please use the `textarea` component instead.
107
+ */
108
+ declare const txtarea: (props: NubeComponentTextareaProps) => NubeComponentTextarea;
109
+ /**
110
+ * Creates a `textarea` component.
95
111
  *
96
- * A `txtarea` represents a multi-line text input field that allows users to enter longer texts.
112
+ * A `textarea` represents a multi-line text input field that allows users to enter longer texts.
97
113
  * It supports properties such as `name`, `value`, and event handlers (`onChange`, `onBlur`, `onFocus`).
98
114
  *
99
115
  * @param props - The properties for configuring the textarea component.
100
- * @returns A `NubeComponentTxtArea` object representing the textarea component.
116
+ * @returns A `NubeComponentTextarea` object representing the textarea component.
101
117
  */
102
- declare const txtarea: (props: NubeComponentTxtAreaProps) => NubeComponentTxtArea;
118
+ declare const textarea: (props: NubeComponentTextareaProps) => NubeComponentTextarea;
103
119
 
104
120
  /**
105
121
  * Creates a `button` component.
@@ -112,4 +128,4 @@ declare const txtarea: (props: NubeComponentTxtAreaProps) => NubeComponentTxtAre
112
128
  */
113
129
  declare const button: (props: NubeComponentButtonProps) => NubeComponentButton;
114
130
 
115
- export { box, button, check, col, field, fragment, img, row, txt, txtarea };
131
+ export { box, button, check, checkbox, column, field, fragment, image, img, row, text, textarea, txt, txtarea };
package/dist/index.js CHANGED
@@ -4,8 +4,8 @@ var box = (props) => ({
4
4
  ...props
5
5
  });
6
6
 
7
- // src/components/col.ts
8
- var col = (props) => ({
7
+ // src/components/column.ts
8
+ var column = (props) => ({
9
9
  type: "col",
10
10
  ...props
11
11
  });
@@ -28,29 +28,45 @@ var fragment = (props) => ({
28
28
  ...props
29
29
  });
30
30
 
31
- // src/components/img.ts
31
+ // src/components/image.ts
32
32
  var img = (props) => ({
33
33
  type: "img",
34
34
  ...props
35
35
  });
36
+ var image = (props) => ({
37
+ type: "img",
38
+ ...props
39
+ });
36
40
 
37
- // src/components/txt.ts
41
+ // src/components/text.ts
42
+ var text = (props) => ({
43
+ type: "txt",
44
+ ...props
45
+ });
38
46
  var txt = (props) => ({
39
47
  type: "txt",
40
48
  ...props
41
49
  });
42
50
 
43
- // src/components/check.ts
51
+ // src/components/checkbox.ts
44
52
  var check = (props) => ({
45
53
  type: "check",
46
54
  ...props
47
55
  });
56
+ var checkbox = (props) => ({
57
+ type: "check",
58
+ ...props
59
+ });
48
60
 
49
- // src/components/txtarea.ts
61
+ // src/components/textarea.ts
50
62
  var txtarea = (props) => ({
51
63
  type: "txtarea",
52
64
  ...props
53
65
  });
66
+ var textarea = (props) => ({
67
+ type: "txtarea",
68
+ ...props
69
+ });
54
70
 
55
71
  // src/components/button.ts
56
72
  var button = (props) => ({
@@ -61,11 +77,15 @@ export {
61
77
  box,
62
78
  button,
63
79
  check,
64
- col,
80
+ checkbox,
81
+ column,
65
82
  field,
66
83
  fragment,
84
+ image,
67
85
  img,
68
86
  row,
87
+ text,
88
+ textarea,
69
89
  txt,
70
90
  txtarea
71
91
  };
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/box.ts","../src/components/col.ts","../src/components/row.ts","../src/components/field.ts","../src/components/fragment.ts","../src/components/img.ts","../src/components/txt.ts","../src/components/check.ts","../src/components/txtarea.ts","../src/components/button.ts"],"sourcesContent":["import type {\n\tNubeComponentBox,\n\tNubeComponentBoxProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `box` component.\n *\n * A `box` is a flexible container that can be used for layout purposes.\n * It supports properties like width, height, padding, margin, and flex-based alignment.\n *\n * @param props - The properties for configuring the box component.\n * @returns A `NubeComponentBox` object representing the box component.\n */\nexport const box = (props: NubeComponentBoxProps): NubeComponentBox => ({\n\ttype: \"box\",\n\t...props,\n});\n","import type {\n\tNubeComponentCol,\n\tNubeComponentColProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `col` (column) component.\n *\n * A `col` is a flexible column container that can be used for structuring layouts.\n * It inherits most properties from `box`, except for the `direction` property.\n *\n * @param props - The properties for configuring the column component.\n * @returns A `NubeComponentCol` object representing the column component.\n */\nexport const col = (props: NubeComponentColProps): NubeComponentCol => ({\n\ttype: \"col\",\n\t...props,\n});\n","import type {\n\tNubeComponentRow,\n\tNubeComponentRowProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `row` component.\n *\n * A `row` is a flexible container used for structuring layouts in a horizontal direction.\n * It inherits most properties from `box`, except for the `direction` property.\n *\n * @param props - The properties for configuring the row component.\n * @returns A `NubeComponentRow` object representing the row component.\n */\nexport const row = (props: NubeComponentRowProps): NubeComponentRow => ({\n\ttype: \"row\",\n\t...props,\n});\n","import type {\n\tNubeComponentField,\n\tNubeComponentFieldProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `field` component.\n *\n * A `field` represents an input element in a form, such as text fields, dropdowns, or checkboxes.\n * It supports properties like `name`, `label`, and event handlers (`onChange`, `onBlur`, `onFocus`).\n *\n * @param props - The properties for configuring the field component.\n * @returns A `NubeComponentField` object representing the form field.\n */\nexport const field = (props: NubeComponentFieldProps): NubeComponentField => ({\n\ttype: \"field\",\n\t...props,\n});\n","import type {\n\tNubeComponentFragment,\n\tNubeComponentFragmentProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `fragment` component.\n *\n * A `fragment` is a logical grouping element that allows multiple children\n * to be wrapped without introducing an additional DOM node.\n *\n * @param props - The properties for configuring the fragment component.\n * @returns A `NubeComponentFragment` object representing the fragment.\n */\nexport const fragment = (\n\tprops: NubeComponentFragmentProps,\n): NubeComponentFragment => ({\n\ttype: \"fragment\",\n\t...props,\n});\n","import type {\n\tNubeComponentImg,\n\tNubeComponentImgProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates an `img` (image) component.\n *\n * The `img` component is used to display images. It supports properties such as\n * `src`, `alt`, `width`, `height`, and responsive `sources` for different screen sizes.\n *\n * @param props - The properties for configuring the image component.\n * @returns A `NubeComponentImg` object representing the image component.\n */\nexport const img = (props: NubeComponentImgProps): NubeComponentImg => ({\n\ttype: \"img\",\n\t...props,\n});\n","import type {\n\tNubeComponentTxt,\n\tNubeComponentTxtProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `txt` (text) component.\n *\n * The `txt` component is used to render text with optional styling.\n * It supports properties such as `color`, `background`, `heading` levels (h1-h6),\n * text formatting `modifiers` (bold, italic, etc.), and inline display.\n *\n * @param props - The properties for configuring the text component.\n * @returns A `NubeComponentTxt` object representing the text component.\n */\nexport const txt = (props: NubeComponentTxtProps): NubeComponentTxt => ({\n\ttype: \"txt\",\n\t...props,\n});\n","import type {\n\tNubeComponentCheck,\n\tNubeComponentCheckProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `check` component.\n *\n * A `check` represents a selectable field that can be toggled between checked and unchecked states.\n * It is typically used to allow users to select one or more options.\n * Supports properties such as `name`, `label`, `checked`, and event handlers (`onChange`).\n *\n * @param props - The properties for configuring the checkbox component.\n * @returns A `NubeComponentCheck` object representing the checkbox.\n */\nexport const check = (props: NubeComponentCheckProps): NubeComponentCheck => ({\n\ttype: \"check\",\n\t...props,\n});\n","import type {\n\tNubeComponentTxtArea,\n\tNubeComponentTxtAreaProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `txtarea` component.\n *\n * A `txtarea` represents a multi-line text input field that allows users to enter longer texts.\n * It supports properties such as `name`, `value`, and event handlers (`onChange`, `onBlur`, `onFocus`).\n *\n * @param props - The properties for configuring the textarea component.\n * @returns A `NubeComponentTxtArea` object representing the textarea component.\n */\nexport const txtarea = (\n\tprops: NubeComponentTxtAreaProps,\n): NubeComponentTxtArea => ({\n\ttype: \"txtarea\",\n\t...props,\n});\n","import type {\n\tNubeComponentButton,\n\tNubeComponentButtonProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `button` component.\n *\n * A `button` represents a clickable element typically used to trigger an action or submit a form.\n * It supports properties such as `text`, `onClick`, and style configurations.\n *\n * @param props - The properties for configuring the button component.\n * @returns A `NubeComponentButton` object representing the button component.\n */\nexport const button = (\n\tprops: NubeComponentButtonProps,\n): NubeComponentButton => ({\n\ttype: \"button\",\n\t...props,\n});\n"],"mappings":";AAcO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,QAAQ,CAAC,WAAwD;AAAA,EAC7E,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,WAAW,CACvB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACLO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACFO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,QAAQ,CAAC,WAAwD;AAAA,EAC7E,MAAM;AAAA,EACN,GAAG;AACJ;;;ACJO,IAAM,UAAU,CACtB,WAC2B;AAAA,EAC3B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACLO,IAAM,SAAS,CACrB,WAC0B;AAAA,EAC1B,MAAM;AAAA,EACN,GAAG;AACJ;","names":[]}
1
+ {"version":3,"sources":["../src/components/box.ts","../src/components/column.ts","../src/components/row.ts","../src/components/field.ts","../src/components/fragment.ts","../src/components/image.ts","../src/components/text.ts","../src/components/checkbox.ts","../src/components/textarea.ts","../src/components/button.ts"],"sourcesContent":["import type {\n\tNubeComponentBox,\n\tNubeComponentBoxProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `box` component.\n *\n * A `box` is a flexible container that can be used for layout purposes.\n * It supports properties like width, height, padding, margin, and flex-based alignment.\n *\n * @param props - The properties for configuring the box component.\n * @returns A `NubeComponentBox` object representing the box component.\n */\nexport const box = (props: NubeComponentBoxProps): NubeComponentBox => ({\n\ttype: \"box\",\n\t...props,\n});\n","import type {\n\tNubeComponentColumn,\n\tNubeComponentColumnProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `column` component.\n *\n * A `column` is a flexible column container that can be used for structuring layouts.\n * It inherits most properties from `box`, except for the `direction` property.\n *\n * @param props - The properties for configuring the column component.\n * @returns A `NubeComponentColumn` object representing the column component.\n */\nexport const column = (\n\tprops: NubeComponentColumnProps,\n): NubeComponentColumn => ({\n\ttype: \"col\",\n\t...props,\n});\n","import type {\n\tNubeComponentRow,\n\tNubeComponentRowProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `row` component.\n *\n * A `row` is a flexible container used for structuring layouts in a horizontal direction.\n * It inherits most properties from `box`, except for the `direction` property.\n *\n * @param props - The properties for configuring the row component.\n * @returns A `NubeComponentRow` object representing the row component.\n */\nexport const row = (props: NubeComponentRowProps): NubeComponentRow => ({\n\ttype: \"row\",\n\t...props,\n});\n","import type {\n\tNubeComponentField,\n\tNubeComponentFieldProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `field` component.\n *\n * A `field` represents an input element in a form, such as text fields, dropdowns, or checkboxes.\n * It supports properties like `name`, `label`, and event handlers (`onChange`, `onBlur`, `onFocus`).\n *\n * @param props - The properties for configuring the field component.\n * @returns A `NubeComponentField` object representing the form field.\n */\nexport const field = (props: NubeComponentFieldProps): NubeComponentField => ({\n\ttype: \"field\",\n\t...props,\n});\n","import type {\n\tNubeComponentFragment,\n\tNubeComponentFragmentProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `fragment` component.\n *\n * A `fragment` is a logical grouping element that allows multiple children\n * to be wrapped without introducing an additional DOM node.\n *\n * @param props - The properties for configuring the fragment component.\n * @returns A `NubeComponentFragment` object representing the fragment.\n */\nexport const fragment = (\n\tprops: NubeComponentFragmentProps,\n): NubeComponentFragment => ({\n\ttype: \"fragment\",\n\t...props,\n});\n","import type {\n\tNubeComponentImage,\n\tNubeComponentImageProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * @deprecated This component has been deprecated since version `0.8.0`. Please use the `image` component instead.\n */\nexport const img = (props: NubeComponentImageProps): NubeComponentImage => ({\n\ttype: \"img\",\n\t...props,\n});\n\n/**\n * Creates an `image` (image) component.\n *\n * The `image` component is used to display images. It supports properties such as\n * `src`, `alt`, `width`, `height`, and responsive `sources` for different screen sizes.\n *\n * @param props - The properties for configuring the image component.\n * @returns A `NubeComponentImage` object representing the image component.\n */\nexport const image = (props: NubeComponentImageProps): NubeComponentImage => ({\n\ttype: \"img\",\n\t...props,\n});\n","import type {\n\tNubeComponentText,\n\tNubeComponentTextProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `txt` (text) component.\n *\n * The `txt` component is used to render text with optional styling.\n * It supports properties such as `color`, `background`, `heading` levels (h1-h6),\n * text formatting `modifiers` (bold, italic, etc.), and inline display.\n *\n * @param props - The properties for configuring the text component.\n * @returns A `NubeComponentTxt` object representing the text component.\n */\nexport const text = (props: NubeComponentTextProps): NubeComponentText => ({\n\ttype: \"txt\",\n\t...props,\n});\n\n/**\n * @deprecated This component has been deprecated since version `0.8.0`. Please use the `text` component instead.\n */\nexport const txt = (props: NubeComponentTextProps): NubeComponentText => ({\n\ttype: \"txt\",\n\t...props,\n});\n","import type {\n\tNubeComponentCheckbox,\n\tNubeComponentCheckboxProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * @deprecated This component has been deprecated since version `0.8.0`. Please use the `checkbox` component instead.\n */\nexport const check = (\n\tprops: NubeComponentCheckboxProps,\n): NubeComponentCheckbox => ({\n\ttype: \"check\",\n\t...props,\n});\n\n/**\n * Creates a `checkbox` component.\n *\n * A `checkbox` represents a selectable field that can be toggled between checked and unchecked states.\n * It is typically used to allow users to select one or more options.\n * Supports properties such as `name`, `label`, `checked`, and event handlers (`onChange`).\n *\n * @param props - The properties for configuring the checkbox component.\n * @returns A `NubeComponentCheckbox` object representing the checkbox.\n */\nexport const checkbox = (\n\tprops: NubeComponentCheckboxProps,\n): NubeComponentCheckbox => ({\n\ttype: \"check\",\n\t...props,\n});\n","import type {\n\tNubeComponentTextarea,\n\tNubeComponentTextareaProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * @deprecated This component has been deprecated since version `0.8.0`. Please use the `textarea` component instead.\n */\nexport const txtarea = (\n\tprops: NubeComponentTextareaProps,\n): NubeComponentTextarea => ({\n\ttype: \"txtarea\",\n\t...props,\n});\n\n/**\n * Creates a `textarea` component.\n *\n * A `textarea` represents a multi-line text input field that allows users to enter longer texts.\n * It supports properties such as `name`, `value`, and event handlers (`onChange`, `onBlur`, `onFocus`).\n *\n * @param props - The properties for configuring the textarea component.\n * @returns A `NubeComponentTextarea` object representing the textarea component.\n */\nexport const textarea = (\n\tprops: NubeComponentTextareaProps,\n): NubeComponentTextarea => ({\n\ttype: \"txtarea\",\n\t...props,\n});\n","import type {\n\tNubeComponentButton,\n\tNubeComponentButtonProps,\n} from \"@tiendanube/nube-sdk-types\";\n\n/**\n * Creates a `button` component.\n *\n * A `button` represents a clickable element typically used to trigger an action or submit a form.\n * It supports properties such as `text`, `onClick`, and style configurations.\n *\n * @param props - The properties for configuring the button component.\n * @returns A `NubeComponentButton` object representing the button component.\n */\nexport const button = (\n\tprops: NubeComponentButtonProps,\n): NubeComponentButton => ({\n\ttype: \"button\",\n\t...props,\n});\n"],"mappings":";AAcO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,SAAS,CACrB,WAC0B;AAAA,EAC1B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACLO,IAAM,MAAM,CAAC,WAAoD;AAAA,EACvE,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,QAAQ,CAAC,WAAwD;AAAA,EAC7E,MAAM;AAAA,EACN,GAAG;AACJ;;;ACHO,IAAM,WAAW,CACvB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACXO,IAAM,MAAM,CAAC,WAAwD;AAAA,EAC3E,MAAM;AAAA,EACN,GAAG;AACJ;AAWO,IAAM,QAAQ,CAAC,WAAwD;AAAA,EAC7E,MAAM;AAAA,EACN,GAAG;AACJ;;;ACVO,IAAM,OAAO,CAAC,WAAsD;AAAA,EAC1E,MAAM;AAAA,EACN,GAAG;AACJ;AAKO,IAAM,MAAM,CAAC,WAAsD;AAAA,EACzE,MAAM;AAAA,EACN,GAAG;AACJ;;;AClBO,IAAM,QAAQ,CACpB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;AAYO,IAAM,WAAW,CACvB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACtBO,IAAM,UAAU,CACtB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;AAWO,IAAM,WAAW,CACvB,WAC4B;AAAA,EAC5B,MAAM;AAAA,EACN,GAAG;AACJ;;;ACfO,IAAM,SAAS,CACrB,WAC0B;AAAA,EAC1B,MAAM;AAAA,EACN,GAAG;AACJ;","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tiendanube/nube-sdk-ui",
3
- "version": "0.4.0",
3
+ "version": "0.5.0",
4
4
  "description": "Library for building declarative interfaces for NubeSDK",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",