@kazee-ds/vue 0.10.0 → 0.10.1

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/README.md CHANGED
@@ -1,7 +1,8 @@
1
1
  # @kazee-ds/vue
2
2
 
3
- Workspace additions: bounded selection popovers, Select-compatible Combobox sizing and opt-in focus/nonempty-selection policies, including compound parts. These additions are unpublished; see [Combobox and option-list documentation](https://gitlab.com/kazee.indonesia/kazee-design-system/-/blob/main/docs/select-and-combobox.md).
3
+ Prepared **0.10.1** compacts DateRangePicker: the visible heading, repeated range summary, calendar-side presets and Today shortcut are removed. Period shortcuts belong in a linked Select. Use React **0.10.2** or Vue **0.10.1** with styles **0.10.3**. These versions are unpublished; see [release status](https://gitlab.com/kazee.indonesia/kazee-design-system/-/blob/main/docs/versions.md).
4
4
 
5
+ The prepared styles **0.10.3** bundle tokens **0.6.1**, using `#DBDBDB` for light-theme neutral/default and hover borders. Dark theme and focus/error/selected state colors retain their own roles.
5
6
  Accessible Kazee Vue components, including Toast, built on Reka UI and native controls. Requires Vue 3.4+ and ESM.
6
7
 
7
8
  Version **0.10.0** adds Combobox sizing, focus/search and nonempty-selection policies, full-control popovers, and compact and compound Dialog header/footer dividers and builds on controlled selectable Card actions, Avatar/AvatarGroup, expanded Badge, sized/icon Switch, interactive/compact Card, dense controls, input clearing and composable date/time families with native Vue models and slots. Existing compact APIs remain supported. Verify registry availability before installing; use matching local packed artifacts for checkout testing. See [component expansion](https://gitlab.com/kazee.indonesia/kazee-design-system/-/blob/main/docs/component-expansion.md) and [release status](https://gitlab.com/kazee.indonesia/kazee-design-system/-/blob/main/docs/versions.md).
@@ -11,10 +12,10 @@ Version 0.5.3 ignores Toast shortcut events with missing or non-string keys. Nor
11
12
 
12
13
  ## Install
13
14
 
14
- Public npm installation requires no read token or login. Preserve the application's package manager and lockfile.
15
+ After the prepared versions are published and verified, public npm installation requires no read token or login. Until then use matching local packed artifacts. Preserve the application's package manager and lockfile.
15
16
 
16
17
  ```sh
17
- npm install --save-exact @kazee-ds/vue@0.10.0 @kazee-ds/styles@0.10.0
18
+ npm install --save-exact @kazee-ds/vue@0.10.1 @kazee-ds/styles@0.10.3
18
19
  ```
19
20
 
20
21
  ## Use
package/dist/index.js CHANGED
@@ -6084,7 +6084,7 @@ var _hoisted_6$7 = ["cx", "cy"];
6084
6084
  var _hoisted_7$6 = ["x"];
6085
6085
  var _hoisted_8$5 = { scope: "col" };
6086
6086
  var _hoisted_9$3 = { scope: "col" };
6087
- var _hoisted_10$3 = { scope: "row" };
6087
+ var _hoisted_10$2 = { scope: "row" };
6088
6088
  //#endregion
6089
6089
  //#region src/Chart.vue
6090
6090
  var Chart_default = /* @__PURE__ */ defineComponent({
@@ -6165,7 +6165,7 @@ var Chart_default = /* @__PURE__ */ defineComponent({
6165
6165
  }), 128))
6166
6166
  ], 2)), createVNode(Table_default, { caption: __props.label }, {
6167
6167
  default: withCtx(() => [createElementVNode("thead", null, [createElementVNode("tr", null, [createElementVNode("th", _hoisted_8$5, toDisplayString(__props.categoryLabel), 1), createElementVNode("th", _hoisted_9$3, toDisplayString(__props.valueLabel), 1)])]), createElementVNode("tbody", null, [(openBlock(true), createElementBlock(Fragment, null, renderList(model.value.items, (item) => {
6168
- return openBlock(), createElementBlock("tr", { key: item.id }, [createElementVNode("th", _hoisted_10$3, toDisplayString(item.label), 1), createElementVNode("td", null, toDisplayString(format.value.format(item.value)), 1)]);
6168
+ return openBlock(), createElementBlock("tr", { key: item.id }, [createElementVNode("th", _hoisted_10$2, toDisplayString(item.label), 1), createElementVNode("td", null, toDisplayString(format.value.format(item.value)), 1)]);
6169
6169
  }), 128))])]),
6170
6170
  _: 1
6171
6171
  }, 8, ["caption"])], 64)) : (openBlock(), createBlock(Empty_default, {
@@ -7415,8 +7415,8 @@ var _hoisted_6$6 = {
7415
7415
  var _hoisted_7$5 = { class: "calendar__year-navigation" };
7416
7416
  var _hoisted_8$4 = ["disabled", "aria-label"];
7417
7417
  var _hoisted_9$2 = ["disabled", "aria-label"];
7418
- var _hoisted_10$2 = ["aria-label"];
7419
- var _hoisted_11$1 = [
7418
+ var _hoisted_10$1 = ["aria-label"];
7419
+ var _hoisted_11 = [
7420
7420
  "disabled",
7421
7421
  "aria-pressed",
7422
7422
  "onClick"
@@ -7570,8 +7570,8 @@ var MonthYearNavigation_default = /* @__PURE__ */ defineComponent({
7570
7570
  choose(year, current.value.month);
7571
7571
  if (__props.mode === "header") view.value = "month";
7572
7572
  }
7573
- }, toDisplayString(year), 9, _hoisted_11$1);
7574
- }), 128))], 8, _hoisted_10$2)])), __props.mode === "header" ? (openBlock(), createElementBlock("button", {
7573
+ }, toDisplayString(year), 9, _hoisted_11);
7574
+ }), 128))], 8, _hoisted_10$1)])), __props.mode === "header" ? (openBlock(), createElementBlock("button", {
7575
7575
  key: 2,
7576
7576
  type: "button",
7577
7577
  class: "calendar__back",
@@ -7712,25 +7712,19 @@ function createDateRangePresets(referenceDate = currentDate(), locale = "id-ID",
7712
7712
  //#region src/DateRangePanel.vue?vue&type=script&setup=true&lang.ts
7713
7713
  var _hoisted_1$8 = ["data-readonly"];
7714
7714
  var _hoisted_2$7 = ["id"];
7715
- var _hoisted_3$6 = ["aria-label"];
7716
- var _hoisted_4$5 = [
7717
- "disabled",
7718
- "aria-pressed",
7719
- "onClick"
7720
- ];
7721
- var _hoisted_5$5 = [
7715
+ var _hoisted_3$6 = [
7722
7716
  "aria-label",
7723
7717
  "disabled",
7724
7718
  "value"
7725
7719
  ];
7726
- var _hoisted_6$5 = ["value"];
7727
- var _hoisted_7$4 = [
7720
+ var _hoisted_4$5 = ["value"];
7721
+ var _hoisted_5$5 = [
7728
7722
  "disabled",
7729
7723
  "value",
7730
7724
  "min",
7731
7725
  "max"
7732
7726
  ];
7733
- var _hoisted_8$3 = [
7727
+ var _hoisted_6$5 = [
7734
7728
  "value",
7735
7729
  "min",
7736
7730
  "max",
@@ -7740,10 +7734,9 @@ var _hoisted_8$3 = [
7740
7734
  "aria-describedby",
7741
7735
  "onInput"
7742
7736
  ];
7743
- var _hoisted_9$1 = ["id"];
7744
- var _hoisted_10$1 = ["disabled"];
7745
- var _hoisted_11 = ["disabled"];
7746
- var _hoisted_12 = ["disabled"];
7737
+ var _hoisted_7$4 = ["id"];
7738
+ var _hoisted_8$3 = ["disabled"];
7739
+ var _hoisted_9$1 = ["disabled"];
7747
7740
  //#endregion
7748
7741
  //#region src/DateRangePanel.vue
7749
7742
  var DateRangePanel_default = /* @__PURE__ */ defineComponent({
@@ -7807,25 +7800,11 @@ var DateRangePanel_default = /* @__PURE__ */ defineComponent({
7807
7800
  class: normalizeClass(unref(partClasses)("date-range__content", _ctx.$props.classNames?.content)),
7808
7801
  "data-readonly": __props.readonly || void 0
7809
7802
  }, [
7810
- createElementVNode("header", { class: normalizeClass(unref(partClasses)("date-range__intro", _ctx.$props.classNames?.intro)) }, [createElementVNode("h2", { id: `${__props.id}-title` }, toDisplayString(__props.labels.title), 9, _hoisted_2$7), createElementVNode("p", {
7803
+ createElementVNode("header", { class: normalizeClass(unref(partClasses)("date-range__intro temporal__sr-only", _ctx.$props.classNames?.intro)) }, [createElementVNode("h2", { id: `${__props.id}-title` }, toDisplayString(__props.labels.title), 9, _hoisted_2$7), createElementVNode("p", {
7811
7804
  class: normalizeClass(unref(partClasses)("date-range__summary", _ctx.$props.classNames?.summary)),
7812
7805
  "aria-live": "polite"
7813
7806
  }, toDisplayString(unref(rangeText)(nullable.value, locale.value) || __props.labels.incomplete), 3)], 2),
7814
- createElementVNode("div", { class: normalizeClass(unref(partClasses)("date-range__body", _ctx.$props.classNames?.body)) }, [__props.options.presets?.length ? (openBlock(), createElementBlock("div", {
7815
- key: 0,
7816
- class: normalizeClass(unref(partClasses)("date-range__presets", _ctx.$props.classNames?.presets)),
7817
- role: "group",
7818
- "aria-label": __props.labels.presets
7819
- }, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.options.presets, (preset) => {
7820
- return openBlock(), createElementBlock("button", {
7821
- key: preset.id,
7822
- type: "button",
7823
- class: normalizeClass(unref(partClasses)("date-range__preset", _ctx.$props.classNames?.preset)),
7824
- disabled: __props.disabled || __props.readonly || !!unref(rangeError)(preset.value, __props.options),
7825
- "aria-pressed": __props.draft.start === preset.value.start && __props.draft.end === preset.value.end,
7826
- onClick: ($event) => emit("draft", { ...preset.value })
7827
- }, toDisplayString(preset.label), 11, _hoisted_4$5);
7828
- }), 128))], 10, _hoisted_3$6)) : createCommentVNode("", true), createElementVNode("div", { class: normalizeClass(unref(partClasses)("date-range__main", _ctx.$props.classNames?.main)) }, [
7807
+ createElementVNode("div", { class: normalizeClass(unref(partClasses)("date-range__body", _ctx.$props.classNames?.body)) }, [createElementVNode("div", { class: normalizeClass(unref(partClasses)("date-range__main", _ctx.$props.classNames?.main)) }, [
7829
7808
  __props.options.showMonthYearPicker ? (openBlock(), createElementBlock("div", {
7830
7809
  key: 0,
7831
7810
  class: normalizeClass(unref(partClasses)("date-range__jump", _ctx.$props.classNames?.jump))
@@ -7846,8 +7825,8 @@ var DateRangePanel_default = /* @__PURE__ */ defineComponent({
7846
7825
  }).format(focused.value.set({
7847
7826
  month,
7848
7827
  day: 1
7849
- }).toDate("UTC"))), 9, _hoisted_6$5);
7850
- }), 64))], 40, _hoisted_5$5)]), createElementVNode("label", null, [createElementVNode("span", null, toDisplayString(locale.value.startsWith("id") ? "Tahun" : "Year"), 1), createElementVNode("input", {
7828
+ }).toDate("UTC"))), 9, _hoisted_4$5);
7829
+ }), 64))], 40, _hoisted_3$6)]), createElementVNode("label", null, [createElementVNode("span", null, toDisplayString(locale.value.startsWith("id") ? "Tahun" : "Year"), 1), createElementVNode("input", {
7851
7830
  type: "number",
7852
7831
  form: "",
7853
7832
  disabled: __props.disabled,
@@ -7855,7 +7834,7 @@ var DateRangePanel_default = /* @__PURE__ */ defineComponent({
7855
7834
  min: unref(asDate)(__props.options.minDate)?.year ?? 1,
7856
7835
  max: unref(asDate)(__props.options.maxDate)?.year ?? 9999,
7857
7836
  onChange: jumpYear
7858
- }, null, 40, _hoisted_7$4)])], 2)) : createCommentVNode("", true),
7837
+ }, null, 40, _hoisted_5$5)])], 2)) : createCommentVNode("", true),
7859
7838
  __props.options.showInputs !== false ? (openBlock(), createElementBlock("div", {
7860
7839
  key: 1,
7861
7840
  class: normalizeClass(unref(partClasses)("date-range__inputs", _ctx.$props.classNames?.inputs))
@@ -7874,7 +7853,7 @@ var DateRangePanel_default = /* @__PURE__ */ defineComponent({
7874
7853
  "aria-invalid": !!errorCode.value,
7875
7854
  "aria-describedby": error.value ? `${__props.id}-draft-error` : void 0,
7876
7855
  onInput: ($event) => edit(part, $event)
7877
- }, null, 40, _hoisted_8$3)], 2);
7856
+ }, null, 40, _hoisted_6$5)], 2);
7878
7857
  }), 64))], 2)) : createCommentVNode("", true),
7879
7858
  createVNode(unref(RangeCalendarRoot), {
7880
7859
  placeholder: focused.value,
@@ -7995,7 +7974,7 @@ var DateRangePanel_default = /* @__PURE__ */ defineComponent({
7995
7974
  key: 0,
7996
7975
  id: `${__props.id}-draft-error`,
7997
7976
  role: "alert"
7998
- }, toDisplayString(error.value), 9, _hoisted_9$1)) : createCommentVNode("", true)], 2)
7977
+ }, toDisplayString(error.value), 9, _hoisted_7$4)) : createCommentVNode("", true)], 2)
7999
7978
  ], 2)], 2),
8000
7979
  __props.options.showActions !== false ? (openBlock(), createElementBlock("footer", {
8001
7980
  key: 0,
@@ -8008,32 +7987,17 @@ var DateRangePanel_default = /* @__PURE__ */ defineComponent({
8008
7987
  start: "",
8009
7988
  end: ""
8010
7989
  }))
8011
- }, toDisplayString(__props.labels.clear), 11, _hoisted_10$1), createElementVNode("div", null, [
8012
- createElementVNode("button", {
8013
- type: "button",
8014
- class: "button button--ghost button--sm",
8015
- disabled: __props.disabled || __props.readonly || !!unref(rangeError)({
8016
- start: unref(currentDate)(),
8017
- end: unref(currentDate)()
8018
- }, __props.options),
8019
- onClick: _cache[3] || (_cache[3] = ($event) => emit("draft", {
8020
- start: unref(currentDate)(),
8021
- end: unref(currentDate)()
8022
- }))
8023
- }, toDisplayString(locale.value.startsWith("id") ? "Hari ini" : "Today"), 9, _hoisted_11),
8024
- createElementVNode("button", {
8025
- type: "button",
8026
- class: normalizeClass(unref(partClasses)("button button--secondary button--sm date-range__cancel", _ctx.$props.classNames?.cancel)),
8027
- onClick: _cache[4] || (_cache[4] = ($event) => emit("cancel"))
8028
- }, toDisplayString(__props.labels.cancel), 3),
8029
- __props.options.commitMode !== "immediate" ? (openBlock(), createElementBlock("button", {
8030
- key: 0,
8031
- type: "button",
8032
- class: normalizeClass(unref(partClasses)("button button--primary button--sm date-range__apply", _ctx.$props.classNames?.apply)),
8033
- disabled: __props.disabled || __props.readonly || !!errorCode.value,
8034
- onClick: _cache[5] || (_cache[5] = ($event) => emit("apply"))
8035
- }, toDisplayString(__props.labels.apply), 11, _hoisted_12)) : createCommentVNode("", true)
8036
- ])], 2)) : createCommentVNode("", true)
7990
+ }, toDisplayString(__props.labels.clear), 11, _hoisted_8$3), createElementVNode("div", null, [createElementVNode("button", {
7991
+ type: "button",
7992
+ class: normalizeClass(unref(partClasses)("button button--secondary button--sm date-range__cancel", _ctx.$props.classNames?.cancel)),
7993
+ onClick: _cache[3] || (_cache[3] = ($event) => emit("cancel"))
7994
+ }, toDisplayString(__props.labels.cancel), 3), __props.options.commitMode !== "immediate" ? (openBlock(), createElementBlock("button", {
7995
+ key: 0,
7996
+ type: "button",
7997
+ class: normalizeClass(unref(partClasses)("button button--primary button--sm date-range__apply", _ctx.$props.classNames?.apply)),
7998
+ disabled: __props.disabled || __props.readonly || !!errorCode.value,
7999
+ onClick: _cache[4] || (_cache[4] = ($event) => emit("apply"))
8000
+ }, toDisplayString(__props.labels.apply), 11, _hoisted_9$1)) : createCommentVNode("", true)])], 2)) : createCommentVNode("", true)
8037
8001
  ], 10, _hoisted_1$8);
8038
8002
  };
8039
8003
  }