@ptlm-azulejo/segmented-control 0.1.1-alpha.80 → 0.1.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/dist/{packages/SegmentedControl/index.d.ts → index.d.ts} +1 -1
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +2327 -5365
- package/dist/index.umd.cjs +1 -1
- package/dist/{packages/SegmentedControl/src → src}/index.vue.d.ts +2 -16
- package/dist/src/index.vue.d.ts.map +1 -0
- package/dist/src/types.d.ts +15 -0
- package/dist/src/types.d.ts.map +1 -0
- package/dist/src/useSegmentedControl.d.ts +17 -0
- package/dist/src/useSegmentedControl.d.ts.map +1 -0
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/CHANGELOG.md +0 -68
- package/dist/packages/SegmentedControl/index.d.ts.map +0 -1
- package/dist/packages/SegmentedControl/src/index.vue.d.ts.map +0 -1
|
@@ -1,17 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
value: string;
|
|
4
|
-
disabled?: boolean;
|
|
5
|
-
}
|
|
6
|
-
export type SegmentedControlSize = 's' | 'm';
|
|
7
|
-
export interface SegmentedControlUi {
|
|
8
|
-
root?: string;
|
|
9
|
-
segment?: string;
|
|
10
|
-
segmentSelected?: string;
|
|
11
|
-
label?: string;
|
|
12
|
-
labelSelected?: string;
|
|
13
|
-
indicator?: string;
|
|
14
|
-
}
|
|
1
|
+
import { SegmentedControlItem, SegmentedControlSize, SegmentedControlUi } from './types';
|
|
2
|
+
|
|
15
3
|
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
|
|
16
4
|
/**
|
|
17
5
|
* Segments to display. Each item needs a unique `value` and visible `label`.
|
|
@@ -35,7 +23,6 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
35
23
|
disabled?: boolean;
|
|
36
24
|
/**
|
|
37
25
|
* Tailwind class overrides per structural part (`root`, `segment`, `label`, etc.).
|
|
38
|
-
* Merged with `defaultSegmentedControlUi` via `cn()` — conflicting utilities win.
|
|
39
26
|
*/
|
|
40
27
|
ui?: SegmentedControlUi;
|
|
41
28
|
/**
|
|
@@ -72,7 +59,6 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
72
59
|
disabled?: boolean;
|
|
73
60
|
/**
|
|
74
61
|
* Tailwind class overrides per structural part (`root`, `segment`, `label`, etc.).
|
|
75
|
-
* Merged with `defaultSegmentedControlUi` via `cn()` — conflicting utilities win.
|
|
76
62
|
*/
|
|
77
63
|
ui?: SegmentedControlUi;
|
|
78
64
|
/**
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.vue.d.ts","sourceRoot":"","sources":["../../src/index.vue"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAC7F,OAAO,yBAAyB,CAAA;;IA+P5B;;OAEG;WACI,oBAAoB,EAAE;IAC7B;;OAEG;iBACU,MAAM;IACnB;;OAEG;WACI,oBAAoB;IAC3B;;OAEG;gBACS,OAAO;IACnB;;OAEG;eACQ,OAAO;IAClB;;OAEG;SACE,kBAAkB;IACvB;;OAEG;gBACS,MAAM;;;;;;;;;IA3BlB;;OAEG;WACI,oBAAoB,EAAE;IAC7B;;OAEG;iBACU,MAAM;IACnB;;OAEG;WACI,oBAAoB;IAC3B;;OAEG;gBACS,OAAO;IACnB;;OAEG;eACQ,OAAO;IAClB;;OAEG;SACE,kBAAkB;IACvB;;OAEG;gBACS,MAAM;;;;;;;;;UAhBX,oBAAoB;eAIf,OAAO;cAIR,OAAO;QAIb,kBAAkB;;AA7B3B,wBAoCG;AACH,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAE1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KACb,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACT,CAAC;AACN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export interface SegmentedControlItem {
|
|
2
|
+
label: string;
|
|
3
|
+
value: string;
|
|
4
|
+
disabled?: boolean;
|
|
5
|
+
}
|
|
6
|
+
export type SegmentedControlSize = 's' | 'm';
|
|
7
|
+
export interface SegmentedControlUi {
|
|
8
|
+
root?: string;
|
|
9
|
+
segment?: string;
|
|
10
|
+
segmentSelected?: string;
|
|
11
|
+
label?: string;
|
|
12
|
+
labelSelected?: string;
|
|
13
|
+
indicator?: string;
|
|
14
|
+
}
|
|
15
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,MAAM,oBAAoB,GAAG,GAAG,GAAG,GAAG,CAAA;AAE5C,MAAM,WAAW,kBAAkB;IACjC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { Ref } from 'vue';
|
|
2
|
+
import { SegmentedControlItem } from './types';
|
|
3
|
+
|
|
4
|
+
export declare function useSegmentedControl(options: {
|
|
5
|
+
items: Ref<SegmentedControlItem[]>;
|
|
6
|
+
modelValue: Ref<string | undefined>;
|
|
7
|
+
disabled: Ref<boolean>;
|
|
8
|
+
onSelect: (value: string) => void;
|
|
9
|
+
focusIndex?: (index: number) => void;
|
|
10
|
+
}): {
|
|
11
|
+
isSelected: (item: SegmentedControlItem) => boolean;
|
|
12
|
+
isSegmentDisabled: (item: SegmentedControlItem) => boolean;
|
|
13
|
+
select: (item: SegmentedControlItem) => void;
|
|
14
|
+
getTabIndex: (index: number) => number;
|
|
15
|
+
onKeydown: (event: KeyboardEvent, index: number) => void;
|
|
16
|
+
};
|
|
17
|
+
//# sourceMappingURL=useSegmentedControl.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSegmentedControl.d.ts","sourceRoot":"","sources":["../../src/useSegmentedControl.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,KAAK,CAAA;AAC9B,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEnD,wBAAgB,mBAAmB,CAAC,OAAO,EAAE;IAC3C,KAAK,EAAE,GAAG,CAAC,oBAAoB,EAAE,CAAC,CAAA;IAClC,UAAU,EAAE,GAAG,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IACnC,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC,CAAA;IACtB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACrC;uBAC2B,oBAAoB,KAAG,OAAO;8BAIvB,oBAAoB,KAAG,OAAO;mBAIzC,oBAAoB,KAAG,IAAI;yBAcrB,MAAM,KAAG,MAAM;uBAgBjB,aAAa,SAAS,MAAM,KAAG,IAAI;EA4C9D"}
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-leading:initial
|
|
1
|
+
/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-leading:initial}}}.segmented-control,.segmented-control__segment{font-family:var(--font-family,ui-sans-serif, system-ui, sans-serif)}.segmented-control{isolation:isolate;align-items:stretch;gap:calc(var(--spacing,.25rem) * 1);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-border-primary);background-color:var(--color-background-primary);border-radius:3.40282e38px;grid-template-rows:repeat(1,minmax(0,1fr));display:inline-grid;position:relative;overflow:hidden}.segmented-control--m{height:calc(var(--spacing,.25rem) * 12);padding:calc(var(--spacing,.25rem) * 2)}.segmented-control--s{height:calc(var(--spacing,.25rem) * 8);padding:calc(var(--spacing,.25rem) * 1)}.segmented-control--full-width{width:100%}.segmented-control__indicator{z-index:0;background-color:var(--color-blue-grey-600);border-radius:3.40282e38px;grid-row:1;align-self:stretch}.segmented-control__segment{z-index:1;min-width:calc(var(--spacing,.25rem) * 0);padding-inline:calc(var(--spacing,.25rem) * 4);border-radius:3.40282e38px;grid-row:1;justify-content:center;align-items:center;display:flex;position:relative}.segmented-control__segment:disabled{cursor:not-allowed;opacity:.5}.segmented-control__segment:not(:disabled):not(.segmented-control__segment--selected):hover{background-color:var(--color-text-primary)}@supports (color:color-mix(in lab,red,red)){.segmented-control__segment:not(:disabled):not(.segmented-control__segment--selected):hover{background-color:color-mix(in srgb,var(--color-text-primary) 5%,transparent)}}.segmented-control__segment:focus-visible{outline:var(--border-m) solid var(--color-text-accent);outline-offset:var(--border-m)}.segmented-control__label{font-size:var(--font-size-04);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)));--tw-leading:1.3;white-space:nowrap;color:var(--color-text-tertiary);line-height:1.3;font-weight:var(--font-weight-regular);position:relative}.segmented-control__label--selected{color:var(--color-text-primary-inverse);font-weight:var(--font-weight-semi-bold)}@media (prefers-reduced-motion:reduce){.segmented-control__indicator{transition:none!important}}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}
|
package/package.json
CHANGED
package/CHANGELOG.md
DELETED
|
@@ -1,68 +0,0 @@
|
|
|
1
|
-
# Change Log
|
|
2
|
-
|
|
3
|
-
## 0.1.1
|
|
4
|
-
|
|
5
|
-
### Patch Changes
|
|
6
|
-
|
|
7
|
-
- e5341cd: Documentation. Every package README now spells out both brands end to end instead
|
|
8
|
-
of showing one snippet with an "or" comment: which preset stylesheet to import,
|
|
9
|
-
which `.preset-*` class goes on `<html>` to select the theme at runtime,
|
|
10
|
-
`data-theme` for light/dark, and which font package the project needs (Leroy
|
|
11
|
-
Merlin → `@ptlm-azulejo/fonts-leroy-merlin`, Adeo → `@ptlm-azulejo/fonts-adeo`).
|
|
12
|
-
|
|
13
|
-
No component behaviour, prop or token changed. The patch bump exists because npm
|
|
14
|
-
ships `README.md` inside the tarball and renders it as the package page, so the
|
|
15
|
-
corrected instructions only reach consumers on a release.
|
|
16
|
-
|
|
17
|
-
## 0.1.0
|
|
18
|
-
|
|
19
|
-
### Minor Changes
|
|
20
|
-
|
|
21
|
-
- eb0b0f8: Make components follow the brand typeface, add the medium (500) font weight, and
|
|
22
|
-
expose stable `data-testid` hooks.
|
|
23
|
-
|
|
24
|
-
- Each preset now names its brand's typeface in `--font-family`
|
|
25
|
-
(`presets/leroy-merlin.css` → LeroyMerlin, `presets/adeo.css` → Roboto), with
|
|
26
|
-
`Arial, sans-serif` as the fallback stack.
|
|
27
|
-
- Components apply that typeface on their root, so they follow the active brand
|
|
28
|
-
instead of inheriting the host page's font. Opt out per component by setting
|
|
29
|
-
`--font-family: inherit` on it.
|
|
30
|
-
- `base.css` adds `--font-weight-medium: 500`, alongside the existing regular
|
|
31
|
-
(400), semi-bold (600) and bold (700) weights.
|
|
32
|
-
- Every component now exposes `data-testid` on its root and on meaningful
|
|
33
|
-
sub-parts (`button` / `button-spinner`, `loader` / `loader-text`,
|
|
34
|
-
`datepicker` / `datepicker-clear`, `segmented-control` /
|
|
35
|
-
`segmented-control-segment`), so tests can target them without depending on
|
|
36
|
-
CSS class names.
|
|
37
|
-
|
|
38
|
-
As with upstream Mozaic, the presets **name** the typeface but ship no
|
|
39
|
-
`@font-face` and no font binaries — loading the files stays the app's job, so you
|
|
40
|
-
keep control of hosting, subsetting and preload. Until you load them the fallback
|
|
41
|
-
stack renders and nothing breaks. Install the font package matching your brand
|
|
42
|
-
alongside the preset:
|
|
43
|
-
|
|
44
|
-
```bash
|
|
45
|
-
# Leroy Merlin
|
|
46
|
-
yarn add @ptlm-azulejo/themes @ptlm-azulejo/fonts-leroy-merlin
|
|
47
|
-
# Adeo
|
|
48
|
-
yarn add @ptlm-azulejo/themes @ptlm-azulejo/fonts-adeo
|
|
49
|
-
```
|
|
50
|
-
|
|
51
|
-
See the Fonts section of `packages/themes/README.md` for the full recipe.
|
|
52
|
-
|
|
53
|
-
All notable changes to this project will be documented in this file.
|
|
54
|
-
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
55
|
-
|
|
56
|
-
## [Unreleased]
|
|
57
|
-
|
|
58
|
-
### Features
|
|
59
|
-
|
|
60
|
-
- Add `AzSegmentedControl` — ADS2 segmented control (toggle group) with `v-model`, `items`, `size` (`s` / `m`), `fullWidth`, per-segment `disabled`, typed `:ui` overrides, keyboard navigation (arrows, Home/End), and motion-v `layout` selection indicator (bundled — no extra install).
|
|
61
|
-
|
|
62
|
-
### Bug Fixes
|
|
63
|
-
|
|
64
|
-
- Remove redundant type and pattern comments; keep prop JSDoc for Storybook.
|
|
65
|
-
- Drop Nuxt UI reference from Storybook `ui` argType description.
|
|
66
|
-
- Fix keyboard roving tabindex when the first segment or current selection is disabled.
|
|
67
|
-
- Move focus to the newly selected segment after arrow/Home/End navigation.
|
|
68
|
-
- Guard empty `items` (no invalid grid template, hide sliding indicator).
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AAC/D,YAAY,EACV,oBAAoB,EACpB,oBAAoB,EACpB,kBAAkB,GACnB,MAAM,iBAAiB,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.vue.d.ts","sourceRoot":"","sources":["../../../../src/index.vue"],"names":[],"mappings":"AAMA,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,MAAM,oBAAoB,GAAG,GAAG,GAAG,GAAG,CAAA;AAE5C,MAAM,WAAW,kBAAkB;IACjC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;;IA2WG;;OAEG;WACI,oBAAoB,EAAE;IAC7B;;OAEG;iBACU,MAAM;IACnB;;OAEG;WACI,oBAAoB;IAC3B;;OAEG;gBACS,OAAO;IACnB;;OAEG;eACQ,OAAO;IAClB;;;OAGG;SACE,kBAAkB;IACvB;;OAEG;gBACS,MAAM;;;;;;;;;IA5BlB;;OAEG;WACI,oBAAoB,EAAE;IAC7B;;OAEG;iBACU,MAAM;IACnB;;OAEG;WACI,oBAAoB;IAC3B;;OAEG;gBACS,OAAO;IACnB;;OAEG;eACQ,OAAO;IAClB;;;OAGG;SACE,kBAAkB;IACvB;;OAEG;gBACS,MAAM;;;;;;;;;UAjBX,oBAAoB;eAIf,OAAO;cAIR,OAAO;QAKb,kBAAkB;;AA9B3B,wBAqCG;AACH,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AACjE,KAAK,6BAA6B,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAAG;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CAAE,CAAC;AAC9M,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAE1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KACb,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACT,CAAC;AACN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
|