@quidgest/ui 0.16.42 → 0.16.43

package/dist/ui.scss

@@ -1,5 +1,5 @@
 /*!
- * Quidgest UI v0.16.42
+ * Quidgest UI v0.16.43
  * (c) 2025 Quidgest - Consultores de Gestão, S.A.
  * Released under the MIT License.
  */
@@ -1573,62 +1573,74 @@ $q-carousel-height-md: 300px;
   }
 }
 .q-divider {
+  --q-divider-thickness: 1px;
+  --q-divider-color: var(--q-theme-neutral);
   display: flex;
   align-items: center;
   justify-content: center;
   position: relative;
-  color: var(--q-theme-neutral);
+  color: var(--q-divider-color);
   font-size: 0.875rem;
-}
-.q-divider--horizontal {
-  width: 100%;
-  flex-direction: row;
-  margin: 8px 0;
-}
-.q-divider--horizontal:not(.q-divider--labeled)::before {
-  content: '';
-  flex: 1;
-  border-top-width: 1px;
-}
-.q-divider--horizontal.q-divider--labeled .q-divider__line {
-  flex: 1;
-  border-top-width: 1px;
-}
-.q-divider--horizontal.q-divider--labeled .q-divider__label {
-  padding: 0 12px;
-  white-space: nowrap;
-}
-.q-divider--horizontal.q-divider--inset {
-  max-width: calc(100% - 72px);
-  margin-inline-start: 72px;
-}
-.q-divider--vertical {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  height: 100%;
-  min-height: 100%; 
-  margin: 0 8px;
-}
-.q-divider--vertical:not(.q-divider--labeled)::before {
-  content: '';
-  flex: 1;
-  border-left-width: 1px;
-}
-.q-divider--vertical.q-divider--labeled .q-divider__line {
-  border-left-width: 1px;
-  height: 100%;
-}
-.q-divider--vertical.q-divider--labeled .q-divider__label {
-  writing-mode: vertical-rl;
-  text-orientation: mixed;
-  padding: 12px 0;
-  white-space: nowrap;
-}
-.q-divider--vertical.q-divider--inset {
-  margin-bottom: 8px;
-  margin-top: 8px;
-  max-height: calc(100% - 16px);
+  
+  &--horizontal {
+    width: 100%;
+    flex-direction: row;
+    margin: 8px 0;
+  }
+  &--horizontal:not(.q-divider--labeled)::before {
+    content: '';
+    flex: 1;
+    border-top-width: var(--q-divider-thickness);
+    border-color: var(--q-divider-color);
+  }
+  
+  &--horizontal.q-divider--labeled .q-divider__line {
+    flex: 1;
+    border-top-width: var(--q-divider-thickness);
+    border-color: var(--q-divider-color);
+  }
+  &--horizontal.q-divider--labeled .q-divider__label {
+    padding: 0 12px;
+    white-space: nowrap;
+  }
+  
+  &--horizontal.q-divider--inset {
+    max-width: calc(100% - 72px);
+    margin-inline-start: 72px;
+  }
+  
+  &--vertical {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    height: 100%;
+    min-height: 100%; 
+    margin: 0 8px;
+  }
+  &--vertical:not(.q-divider--labeled)::before {
+    content: '';
+    flex: 1;
+    border-left-width: var(--q-divider-thickness);
+    border-color: var(--q-divider-color);
+  }
+  
+  &--vertical.q-divider--labeled .q-divider__line {
+    border-left-width: var(--q-divider-thickness);
+    border-color: var(--q-divider-color);
+    height: 100%;
+  }
+  &--vertical.q-divider--labeled .q-divider__label {
+    writing-mode: vertical-rl;
+    text-orientation: mixed;
+    padding: 12px 0;
+    white-space: nowrap;
+  }
+  
+  &--vertical.q-divider--inset {
+    margin-bottom: 8px;
+    margin-top: 8px;
+    max-height: calc(100% - 16px);
+  }
 }
 .q-dropdown-menu {
   &__body {

package/esm/components/QDivider/QDivider.d.ts

@@ -9,7 +9,9 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<QDividerProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<QDividerProps> & Readonly<{}>, {
+    color: string;
     direction: "horizontal" | "vertical";
+    thickness: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/esm/components/QDivider/QDivider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QDivider.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QDivider/QDivider.vue"],"names":[],"mappings":"AAcA;AAyCC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AA2B7C,iBAAS,cAAc;WAqCT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAWD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;wFAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"QDivider.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QDivider/QDivider.vue"],"names":[],"mappings":"AAeA;AAsEC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAiD7C,iBAAS,cAAc;WAsCT,OAAO,IAA6B;;yBAVrB,GAAG;;;;EAe/B;AAYD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;wFAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/esm/components/QDivider/QDivider.vue.js

@@ -1,42 +1,50 @@
-import { defineComponent as v, computed as t, useSlots as c, createElementBlock as l, openBlock as o, normalizeClass as u, createCommentVNode as p, Fragment as m, createElementVNode as s, renderSlot as _ } from "vue";
-const f = ["id"], q = { class: "q-divider__label" }, b = /* @__PURE__ */ v({
+import { defineComponent as m, computed as i, useSlots as p, toRef as f, createElementBlock as r, openBlock as n, normalizeStyle as _, normalizeClass as q, createCommentVNode as k, Fragment as y, createElementVNode as l, renderSlot as h } from "vue";
+import { useColor as C } from "../../composables/useColor/index.js";
+const $ = ["id"], b = { class: "q-divider__label" }, S = /* @__PURE__ */ m({
   __name: "QDivider",
   props: {
     id: {},
     class: {},
     direction: { default: "horizontal" },
-    inset: { type: Boolean }
+    inset: { type: Boolean },
+    thickness: { default: 1 },
+    color: { default: "neutral" }
   },
-  setup(n) {
-    const e = n, d = t(() => !!c().default), r = t(() => [
+  setup(d) {
+    const e = d, o = i(() => !!p().default), a = i(() => [
       "q-divider",
       `q-divider--${e.direction}`,
       {
         "q-divider--inset": e.inset,
-        "q-divider--labeled": d.value
+        "q-divider--labeled": o.value
       },
       e.class
-    ]);
-    return (a, i) => (o(), l("div", {
+    ]), { isUtilityColor: c, style: u } = C(f(e, "color")), v = i(() => {
+      var s;
+      const t = {};
+      return e.thickness >= 0 && e.thickness !== 1 && (t["--q-divider-thickness"] = `${e.thickness}px`), e.color !== "neutral" && (t["--q-divider-color"] = c.value ? `var(--q-theme-${e.color})` : (s = u.value) == null ? void 0 : s.mainColor), t;
+    });
+    return (t, s) => (n(), r("div", {
       id: e.id,
-      class: u(r.value),
+      class: q(a.value),
+      style: _(v.value),
       role: "separator"
     }, [
-      d.value ? (o(), l(
-        m,
+      o.value ? (n(), r(
+        y,
         { key: 0 },
         [
-          i[0] || (i[0] = s(
+          s[0] || (s[0] = l(
             "div",
             { class: "q-divider__line" },
             null,
             -1
             /* HOISTED */
           )),
-          s("span", q, [
-            _(a.$slots, "default")
+          l("span", b, [
+            h(t.$slots, "default")
           ]),
-          i[1] || (i[1] = s(
+          s[1] || (s[1] = l(
             "div",
             { class: "q-divider__line" },
             null,
@@ -46,10 +54,10 @@ const f = ["id"], q = { class: "q-divider__label" }, b = /* @__PURE__ */ v({
         ],
         64
         /* STABLE_FRAGMENT */
-      )) : p("v-if", !0)
-    ], 10, f));
+      )) : k("v-if", !0)
+    ], 14, $));
   }
 });
 export {
-  b as default
+  S as default
 };

package/esm/components/QDivider/index.d.ts

@@ -1,6 +1,8 @@
 declare const QDivider: {
     new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./types').QDividerProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {
+        color: string;
         direction: "horizontal" | "vertical";
+        thickness: number;
     }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, HTMLDivElement, import('vue').ComponentProvideOptions, {
         P: {};
         B: {};
@@ -9,13 +11,17 @@ declare const QDivider: {
         M: {};
         Defaults: {};
     }, Readonly<import('./types').QDividerProps> & Readonly<{}>, {}, {}, {}, {}, {
+        color: string;
         direction: "horizontal" | "vertical";
+        thickness: number;
     }>;
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
 } & import('vue').ComponentOptionsBase<Readonly<import('./types').QDividerProps> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {
+    color: string;
     direction: "horizontal" | "vertical";
+    thickness: number;
 }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
     $slots: {
         default?(_: {}): any;

package/esm/components/QDivider/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QDivider/index.ts"],"names":[],"mappings":"AAMA,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;EAA6B,CAAA;AAG3C,OAAO,EAAE,QAAQ,EAAE,CAAA;AAGnB,cAAc,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/QDivider/index.ts"],"names":[],"mappings":"AAMA,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAA6B,CAAA;AAG3C,OAAO,EAAE,QAAQ,EAAE,CAAA;AAGnB,cAAc,SAAS,CAAA"}

package/esm/components/QDivider/types.d.ts

@@ -12,5 +12,19 @@ export type QDividerProps = QBaseComponentProps & {
      * @category Presentation
      */
     inset?: boolean;
+    /**
+     * The thickness of the divider line in pixels.
+     *
+     * @category Presentation
+     */
+    thickness?: number;
+    /**
+     * The color of the divider line.
+     * Can be chosen from utility colors like 'success' or 'danger',
+     * or specified using CSS color codes.
+     *
+     * @category Presentation
+     */
+    color?: string;
 };
 //# sourceMappingURL=types.d.ts.map

package/esm/components/QDivider/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QDivider/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAEhE,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG;IACjD;;;;OAIG;IACH,SAAS,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAErC;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;CACf,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/QDivider/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAEhE,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG;IACjD;;;;OAIG;IACH,SAAS,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAErC;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAA;IAEf;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;CACd,CAAA"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@quidgest/ui",
   "description": "Quidgest's UI framework",
-  "version": "0.16.42",
+  "version": "0.16.43",
   "private": false,
   "type": "module",
   "author": "Quidgest",