@rarui/components 1.13.0 → 1.15.0

package/CHANGELOG.md

@@ -2,6 +2,19 @@
 
 `@rarui/components` components is a component library built with [Lit](https://lit.dev/).
 
+## 2025-06-27 `1.15.0`
+
+#### 🎉 New features
+
+- Added new navigation `Pagination` component. ([#122](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/122) by [@junior](https://git.rarolabs.com.br/junior))
+
+## 2025-06-26 `1.14.0`
+
+#### 🎉 New features
+
+- Added new exhibition `Label` component. ([#122](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/122) by [@junior](https://git.rarolabs.com.br/junior))
+- Added new input `Toggle` component. ([#122](https://git.rarolabs.com.br/frontend/rarui/-/merge_requests/122) by [@junior](https://git.rarolabs.com.br/junior))
+
 ## 2025-06-23 `1.13.0`
 
 #### 🎉 New features

package/custom-elements.json

@@ -1,9 +1,9 @@
 {
-  "version": "1.12.0",
+  "version": "1.14.0",
   "tags": [
     {
       "name": "rarui-avatar",
-      "description": "## Rarui Avatar\n---\nThe Avatar component is normally used to display circular photos of the user's profile.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/avatar) for more details.",
+      "description": "## Rarui Avatar\n---\nThe Avatar component is normally used to display circular photos of the user's profile.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/avatar) for more details.",
       "attributes": [
         {
           "name": "size",
@@ -30,7 +30,7 @@
     },
     {
       "name": "rarui-badge",
-      "description": "## Rarui Badge\n---\nThe Badge components are only used to transmit dynamic information, such as a connection or status.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/badge) for more details.",
+      "description": "## Rarui Badge\n---\nThe Badge components are only used to transmit dynamic information, such as a connection or status.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/badge) for more details.",
       "attributes": [
         {
           "name": "appearance",
@@ -102,7 +102,7 @@
     },
     {
       "name": "rarui-divider",
-      "description": "## Rarui Divider\n---\nA Divider is a thin line used to separate or group content in lists and layouts.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/divider) for more details.",
+      "description": "## Rarui Divider\n---\nA Divider is a thin line used to separate or group content in lists and layouts.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/divider) for more details.",
       "attributes": [
         {
           "name": "direction",
@@ -1355,9 +1355,26 @@
         }
       ]
     },
+    {
+      "name": "rarui-label",
+      "description": "## Rarui Label\n---\nThe label component allows us to name elements within a form.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/label) for more details.",
+      "attributes": [
+        {
+          "name": "html-for",
+          "description": "The for attribute specifies which form element a label is bound to.",
+          "type": "string"
+        },
+        {
+          "name": "hidden",
+          "default": false,
+          "description": "Specifies whether the label is hidden or not",
+          "type": "boolean"
+        }
+      ]
+    },
     {
       "name": "rarui-stepper",
-      "description": "## Rarui Stepper\n---\nStepper transmit progress through steps.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/stepper) for more details.",
+      "description": "## Rarui Stepper\n---\nStepper transmit progress through steps.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/stepper) for more details.",
       "attributes": [
         {
           "name": "direction",
@@ -1378,7 +1395,7 @@
     },
     {
       "name": "rarui-stepper-step",
-      "description": "## Rarui Stepper Step\n---\nStepper transmit progress through steps.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/stepper) for more details.",
+      "description": "## Rarui Stepper Step\n---\nStepper transmit progress through steps.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/stepper) for more details.",
       "attributes": [
         {
           "name": "title",
@@ -1406,7 +1423,7 @@
     },
     {
       "name": "rarui-text",
-      "description": "## Rarui Text\n---\nText is a basic component that allows us to write blocks of text and give it formatting to use within other components, sections and pages of our application or website.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/typography) for more details.",
+      "description": "## Rarui Text\n---\nText is a basic component that allows us to write blocks of text and give it formatting to use within other components, sections and pages of our application or website.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/typography) for more details.",
       "attributes": [
         {
           "name": "color",
@@ -1749,7 +1766,7 @@
     },
     {
       "name": "rarui-title",
-      "description": "## Rarui Title\n---\nTilte is a basic component that allows you to give titles and more hierarchy to blocks of text for sections or header components.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/typography) for more details.",
+      "description": "## Rarui Title\n---\nTilte is a basic component that allows you to give titles and more hierarchy to blocks of text for sections or header components.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/typography) for more details.",
       "attributes": [
         {
           "name": "as",
@@ -2012,7 +2029,7 @@
     },
     {
       "name": "rarui-tooltip",
-      "description": "## Rarui Tootip\n---\nTooltips are informative, specific, and action-oriented text labels that provide contextual support\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/tooltip) for more details.",
+      "description": "## Rarui Tootip\n---\nTooltips are informative, specific, and action-oriented text labels that provide contextual support\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/tooltip) for more details.",
       "attributes": [
         {
           "name": "inverted",
@@ -2135,7 +2152,7 @@
     },
     {
       "name": "rarui-progress",
-      "description": "## Rarui Progress\n---\nThe Badge components are only used to transmit dynamic information, such as a connection or status.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/badge) for more details.",
+      "description": "## Rarui Progress\n---\nThe Badge components are only used to transmit dynamic information, such as a connection or status.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/badge) for more details.",
       "attributes": [
         {
           "name": "percentage",
@@ -2164,7 +2181,7 @@
     },
     {
       "name": "rarui-progress-circle",
-      "description": "## Rarui Card Body\n---\nThe Card component contains textual content, images, and actions about a topic.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/surface/card) for more details.",
+      "description": "## Rarui Card Body\n---\nThe Card component contains textual content, images, and actions about a topic.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/surface/card) for more details.",
       "attributes": [
         {
           "name": "percentage",
@@ -2208,7 +2225,7 @@
     },
     {
       "name": "rarui-skeleton",
-      "description": "## Rarui Divider\n---\nA Divider is a thin line used to separate or group content in lists and layouts.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/divider) for more details.",
+      "description": "## Rarui Divider\n---\nA Divider is a thin line used to separate or group content in lists and layouts.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/divider) for more details.",
       "attributes": [
         {
           "name": "data-testid",
@@ -2371,7 +2388,7 @@
     },
     {
       "name": "rarui-status",
-      "description": "## Rarui Status\n---\nVisual indicator that shows the current status or situation of an item or process.\nUseful for providing fast and understandable feedback to users.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/exhibition/status) for more details.",
+      "description": "## Rarui Status\n---\nVisual indicator that shows the current status or situation of an item or process.\nUseful for providing fast and understandable feedback to users.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/exhibition/status) for more details.",
       "attributes": [
         {
           "name": "dot",
@@ -2449,7 +2466,7 @@
     },
     {
       "name": "rarui-button",
-      "description": "## Rarui Button\n---\nButton allows the user to perform actions, such as sending a file, advancing a form, sharing a document, or making a comment.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/input/button) for more details.",
+      "description": "## Rarui Button\n---\nButton allows the user to perform actions, such as sending a file, advancing a form, sharing a document, or making a comment.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/input/button) for more details.",
       "attributes": [
         {
           "name": "disabled",
@@ -2550,7 +2567,7 @@
     },
     {
       "name": "rarui-checkbox",
-      "description": "## Rarui Checkbox\n---\nThe Checkbox allows users to select one or more items from a set and can be used to enable or disable an option.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/input/checkbox) for more details.",
+      "description": "## Rarui Checkbox\n---\nThe Checkbox allows users to select one or more items from a set and can be used to enable or disable an option.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/input/checkbox) for more details.",
       "attributes": [
         {
           "name": "label",
@@ -2589,7 +2606,7 @@
     },
     {
       "name": "rarui-chip",
-      "description": "## Rarui Chip\n---\nChip component helps people enter information, make selections, filter content or trigger actions.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/input/button) for more details.",
+      "description": "## Rarui Chip\n---\nChip component helps people enter information, make selections, filter content or trigger actions.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/input/button) for more details.",
       "attributes": [
         {
           "name": "closeable",
@@ -2676,7 +2693,7 @@
     },
     {
       "name": "rarui-icon-button",
-      "description": "## Rarui Icon Button\n---\nButton allows the user to perform actions, such as sending a file, advancing a form, sharing a document, or making a comment.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/input/button) for more details.",
+      "description": "## Rarui Icon Button\n---\nButton allows the user to perform actions, such as sending a file, advancing a form, sharing a document, or making a comment.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/input/button) for more details.",
       "attributes": [
         {
           "name": "disabled",
@@ -2758,7 +2775,7 @@
     },
     {
       "name": "rarui-radio-button",
-      "description": "## Rarui Radio Button\n---\nRadio Button allows users to select one option from a set. They are a selection control that usually appears when users are asked to make decisions or select an option from a set of choices.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/input/radiobutton) for more details.",
+      "description": "## Rarui Radio Button\n---\nRadio Button allows users to select one option from a set. They are a selection control that usually appears when users are asked to make decisions or select an option from a set of choices.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/input/radiobutton) for more details.",
       "attributes": [
         {
           "name": "selected",
@@ -2803,7 +2820,7 @@
     },
     {
       "name": "rarui-textarea",
-      "description": "## Rarui Radio Button\n---\nExpanded text area for long text entries. Allows you to enter large blocks of text, such as comments or detailed descriptions.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/input/textarea) for more details.",
+      "description": "## Rarui Radio Button\n---\nExpanded text area for long text entries. Allows you to enter large blocks of text, such as comments or detailed descriptions.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/input/textarea) for more details.",
       "attributes": [
         {
           "name": "lines",
@@ -2832,9 +2849,62 @@
         }
       ]
     },
+    {
+      "name": "rarui-toggle",
+      "description": "## Rarui Toggle\n---\nToggle switches activate or deactivate the state of a single item.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/input/toggle) for more details.",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "The name of the input element.",
+          "type": "string"
+        },
+        {
+          "name": "selected",
+          "description": "Sets toggle state to activated or deactivated.",
+          "type": "boolean"
+        },
+        {
+          "name": "label",
+          "description": "Text to be rendered inside the component",
+          "type": "string"
+        },
+        {
+          "name": "size",
+          "default": "large",
+          "description": "Specifies the size of the toggle, controlling its dimensions.\n\n- large\n- small",
+          "type": "string",
+          "values": [
+            {
+              "name": "large",
+              "description": "(default)"
+            },
+            {
+              "name": "small"
+            }
+          ]
+        },
+        {
+          "name": "error",
+          "default": false,
+          "description": "Specifies whether the radiobutton is in error state",
+          "type": "boolean"
+        },
+        {
+          "name": "disabled",
+          "default": false,
+          "description": "Defines if Toggle is disabled.\nWhen `true`, the component cannot be interacted.",
+          "type": "boolean"
+        },
+        {
+          "name": "id",
+          "description": "Single ID associated with Toggle Input.If not provided,\nThe name will be used as Fallback to `id`.",
+          "type": "string"
+        }
+      ]
+    },
     {
       "name": "rarui-box",
-      "description": "## Rarui Box\n---\nA low-level `utility` component that provides stylized system accessories to allow for custom styling with theme reconfection.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/layout/box) for more details.",
+      "description": "## Rarui Box\n---\nA low-level `utility` component that provides stylized system accessories to allow for custom styling with theme reconfection.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/layout/box) for more details.",
       "attributes": [
         {
           "name": "background-color",
@@ -6624,7 +6694,7 @@
     },
     {
       "name": "rarui-link",
-      "description": "## Rarui Link\n---\nA link (abbreviation of hyperlink) is an html object that allows you to jump to a new location when clicking or playing it\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/navigation/link) for more details.",
+      "description": "## Rarui Link\n---\nA link (abbreviation of hyperlink) is an html object that allows you to jump to a new location when clicking or playing it\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/navigation/link) for more details.",
       "attributes": [
         {
           "name": "appearance",
@@ -6703,9 +6773,55 @@
         }
       ]
     },
+    {
+      "name": "rarui-pagination",
+      "description": "## Rarui Pagination\n---\nThe pagination component allows the user to select a specific page in a page range.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/navigation/pagination) for more details.",
+      "attributes": [
+        {
+          "name": "page-count",
+          "description": "The total number of pages.",
+          "type": "number"
+        },
+        {
+          "name": "active-page",
+          "description": "The currently selected page.",
+          "type": "number"
+        },
+        {
+          "name": "size",
+          "default": "large",
+          "description": "Specifies the size of the Pagination component.\n\n- dot\n- large\n- small",
+          "type": "string",
+          "values": [
+            {
+              "name": "dot"
+            },
+            {
+              "name": "large",
+              "description": "(default)"
+            },
+            {
+              "name": "small"
+            }
+          ]
+        },
+        {
+          "name": "show-numbers",
+          "default": true,
+          "description": "Determines whether page numbers should be shown.",
+          "type": "boolean"
+        },
+        {
+          "name": "show-arrows",
+          "default": true,
+          "description": "Determines whether page arrows should be shown.",
+          "type": "boolean"
+        }
+      ]
+    },
     {
       "name": "rarui-tabs",
-      "description": "## Rarui Tabs\n---\nThe Tabs are used to switch between different display modes or pages.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/navigation/tabs) for more details.",
+      "description": "## Rarui Tabs\n---\nThe Tabs are used to switch between different display modes or pages.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/navigation/tabs) for more details.",
       "attributes": [
         {
           "name": "pre-selected-tab",
@@ -6749,7 +6865,7 @@
     },
     {
       "name": "rarui-banner",
-      "description": "## Rarui Banner\n---\nBanner messages are displayed to the user at the top of the window/screen.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/surface/banner) for more details.",
+      "description": "## Rarui Banner\n---\nBanner messages are displayed to the user at the top of the window/screen.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/surface/banner) for more details.",
       "attributes": [
         {
           "name": "appearance",
@@ -6794,7 +6910,7 @@
     },
     {
       "name": "rarui-card",
-      "description": "## Rarui Card\n---\nThe Card component contains textual content, images, and actions about a topic.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/surface/card) for more details.",
+      "description": "## Rarui Card\n---\nThe Card component contains textual content, images, and actions about a topic.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/surface/card) for more details.",
       "attributes": [
         {
           "name": "padding",
@@ -6835,12 +6951,12 @@
     },
     {
       "name": "rarui-card-body",
-      "description": "## Rarui Card Body\n---\nThe Card component contains textual content, images, and actions about a topic.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/surface/card) for more details.",
+      "description": "## Rarui Card Body\n---\nThe Card component contains textual content, images, and actions about a topic.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/surface/card) for more details.",
       "attributes": []
     },
     {
       "name": "rarui-card-header",
-      "description": "## Rarui Card Header\n---\nThe Card component contains textual content, images, and actions about a topic.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components/surface/card) for more details.",
+      "description": "## Rarui Card Header\n---\nThe Card component contains textual content, images, and actions about a topic.\n\nSee [a complete document](https://rarui.rarolabs.com.br/docs/components-web-components/surface/card) for more details.",
       "attributes": [
         {
           "name": "title",