@area8975/ui 0.2.2-dev.46 → 0.2.2-dev.47
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/fesm2022/area8975-ui.mjs
CHANGED
|
@@ -1036,7 +1036,7 @@ var UiChartLegendComponent = class UiChartLegendComponent {
|
|
|
1036
1036
|
},
|
|
1037
1037
|
ngImport: i0,
|
|
1038
1038
|
template: "<ul class=\"ui-chart-legend\" role=\"list\">\n @for (item of shownItems(); track item.name) {\n <li\n (mouseenter)=\"hover(item.name)\"\n (mouseleave)=\"hover(null)\"\n (focusin)=\"focus(item.name, $event)\"\n (focusout)=\"focus(null)\"\n >\n @if (toggleable()) {\n <button\n type=\"button\"\n class=\"ui-chart-legend-item ui-chart-legend-item--button ui-text-body-alt\"\n [attr.aria-pressed]=\"!isHidden(item)\"\n [attr.aria-disabled]=\"isLocked(item) || null\"\n [attr.data-hidden]=\"isHidden(item) ? '' : null\"\n (click)=\"toggle(item)\"\n >\n <span\n class=\"ui-chart-legend-key\"\n [class.ui-chart-legend-key--dashed]=\"item.dashed\"\n [style.--ui-chart-legend-colour]=\"item.colour\"\n ></span>\n {{ item.label ?? item.name }}\n </button>\n } @else {\n <span class=\"ui-chart-legend-item ui-text-body-alt\">\n <span\n class=\"ui-chart-legend-key\"\n [class.ui-chart-legend-key--dashed]=\"item.dashed\"\n [style.--ui-chart-legend-colour]=\"item.colour\"\n ></span>\n {{ item.label ?? item.name }}\n </span>\n }\n </li>\n }\n</ul>\n\n@if (shownNote()) {\n <span class=\"text-muted-foreground-1 ui-text-caption\">{{ shownNote() }}</span>\n}\n",
|
|
1039
|
-
styles: ["@layer properties;:host{display:flex;flex-wrap:wrap;align-items:center;column-gap:calc(var(--spacing, .25rem) * 4);row-gap:var(--spacing, .25rem)}.ui-chart-legend{display:flex;flex-wrap:wrap;column-gap:calc(var(--spacing, .25rem) * 4);row-gap:var(--spacing, .25rem)}.ui-chart-legend-item{display:
|
|
1039
|
+
styles: ["@layer properties;:host{display:flex;flex-wrap:wrap;align-items:center;column-gap:calc(var(--spacing, .25rem) * 4);row-gap:var(--spacing, .25rem)}.ui-chart-legend{display:flex;flex-wrap:wrap;column-gap:calc(var(--spacing, .25rem) * 4);row-gap:var(--spacing, .25rem)}.ui-chart-legend-item{display:flex;align-items:center;column-gap:calc(var(--spacing, .25rem) * 1.5);color:var(--foreground)}.ui-chart-legend-item--button{margin-inline:calc(var(--spacing, .25rem) * -1.5);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.ui-chart-legend-item--button:focus{--tw-outline-style: none;outline-style:none}.ui-chart-legend-item--button:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-chart-legend-item--button:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-chart-legend-item--button:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-chart-legend-item--button:hover,.ui-chart-legend-item--button:focus-visible{background-color:var(--surface)}.ui-chart-legend-item--button[aria-disabled]{cursor:default}.ui-chart-legend-item--button[aria-disabled]:hover{background-color:transparent}.ui-chart-legend-key{width:calc(var(--spacing, .25rem) * 2);height:calc(var(--spacing, .25rem) * 2);flex-shrink:0;border-radius:var(--radius-full, calc(infinity * 1px));border-style:var(--tw-border-style);border-width:2px;border-color:var(--ui-chart-legend-colour);background-color:var(--ui-chart-legend-colour)}.ui-chart-legend-key--dashed{height:0px;width:calc(var(--spacing, .25rem) * 4);border-radius:0;border-style:var(--tw-border-style);border-width:0px;border-top-style:var(--tw-border-style);border-top-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:transparent}.ui-chart-legend-item[data-hidden]{color:var(--muted-foreground-1)}.ui-chart-legend-item[data-hidden] .ui-chart-legend-key{background-color:transparent}.ui-chart-legend-item[data-hidden] .ui-chart-legend-key--dashed{opacity:40%}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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-duration: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
|
|
1040
1040
|
});
|
|
1041
1041
|
};
|
|
1042
1042
|
i0.ɵɵngDeclareClassMetadata({
|
|
@@ -1049,7 +1049,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
1049
1049
|
args: [{
|
|
1050
1050
|
selector: "ui-chart-legend",
|
|
1051
1051
|
template: "<ul class=\"ui-chart-legend\" role=\"list\">\n @for (item of shownItems(); track item.name) {\n <li\n (mouseenter)=\"hover(item.name)\"\n (mouseleave)=\"hover(null)\"\n (focusin)=\"focus(item.name, $event)\"\n (focusout)=\"focus(null)\"\n >\n @if (toggleable()) {\n <button\n type=\"button\"\n class=\"ui-chart-legend-item ui-chart-legend-item--button ui-text-body-alt\"\n [attr.aria-pressed]=\"!isHidden(item)\"\n [attr.aria-disabled]=\"isLocked(item) || null\"\n [attr.data-hidden]=\"isHidden(item) ? '' : null\"\n (click)=\"toggle(item)\"\n >\n <span\n class=\"ui-chart-legend-key\"\n [class.ui-chart-legend-key--dashed]=\"item.dashed\"\n [style.--ui-chart-legend-colour]=\"item.colour\"\n ></span>\n {{ item.label ?? item.name }}\n </button>\n } @else {\n <span class=\"ui-chart-legend-item ui-text-body-alt\">\n <span\n class=\"ui-chart-legend-key\"\n [class.ui-chart-legend-key--dashed]=\"item.dashed\"\n [style.--ui-chart-legend-colour]=\"item.colour\"\n ></span>\n {{ item.label ?? item.name }}\n </span>\n }\n </li>\n }\n</ul>\n\n@if (shownNote()) {\n <span class=\"text-muted-foreground-1 ui-text-caption\">{{ shownNote() }}</span>\n}\n",
|
|
1052
|
-
styles: ["@layer properties;:host{display:flex;flex-wrap:wrap;align-items:center;column-gap:calc(var(--spacing, .25rem) * 4);row-gap:var(--spacing, .25rem)}.ui-chart-legend{display:flex;flex-wrap:wrap;column-gap:calc(var(--spacing, .25rem) * 4);row-gap:var(--spacing, .25rem)}.ui-chart-legend-item{display:
|
|
1052
|
+
styles: ["@layer properties;:host{display:flex;flex-wrap:wrap;align-items:center;column-gap:calc(var(--spacing, .25rem) * 4);row-gap:var(--spacing, .25rem)}.ui-chart-legend{display:flex;flex-wrap:wrap;column-gap:calc(var(--spacing, .25rem) * 4);row-gap:var(--spacing, .25rem)}.ui-chart-legend-item{display:flex;align-items:center;column-gap:calc(var(--spacing, .25rem) * 1.5);color:var(--foreground)}.ui-chart-legend-item--button{margin-inline:calc(var(--spacing, .25rem) * -1.5);border-radius:var(--radius-md, .375rem);padding-inline:calc(var(--spacing, .25rem) * 1.5);padding-block:calc(var(--spacing, .25rem) * .5);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));transition-duration:var(--tw-duration, var(--default-transition-duration, .15s));--tw-duration: .15s;transition-duration:.15s}.ui-chart-legend-item--button:focus{--tw-outline-style: none;outline-style:none}.ui-chart-legend-item--button:focus-visible{--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ui-chart-legend-item--button:focus-visible{--tw-ring-color: color-mix(in srgb, oklch(88.2% .059 254.128) 50%, transparent)}@supports (color: color-mix(in lab,red,red)){.ui-chart-legend-item--button:focus-visible{--tw-ring-color: color-mix(in oklab, var(--color-primary-200, var(--color-blue-200)) 50%, transparent)}}.ui-chart-legend-item--button:hover,.ui-chart-legend-item--button:focus-visible{background-color:var(--surface)}.ui-chart-legend-item--button[aria-disabled]{cursor:default}.ui-chart-legend-item--button[aria-disabled]:hover{background-color:transparent}.ui-chart-legend-key{width:calc(var(--spacing, .25rem) * 2);height:calc(var(--spacing, .25rem) * 2);flex-shrink:0;border-radius:var(--radius-full, calc(infinity * 1px));border-style:var(--tw-border-style);border-width:2px;border-color:var(--ui-chart-legend-colour);background-color:var(--ui-chart-legend-colour)}.ui-chart-legend-key--dashed{height:0px;width:calc(var(--spacing, .25rem) * 4);border-radius:0;border-style:var(--tw-border-style);border-width:0px;border-top-style:var(--tw-border-style);border-top-width:2px;--tw-border-style: dashed;border-style:dashed;background-color:transparent}.ui-chart-legend-item[data-hidden]{color:var(--muted-foreground-1)}.ui-chart-legend-item[data-hidden] .ui-chart-legend-key{background-color:transparent}.ui-chart-legend-item[data-hidden] .ui-chart-legend-key--dashed{opacity:40%}@property --tw-duration{syntax: \"*\"; inherits: false;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@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-duration: initial;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-border-style: solid}}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"]
|
|
1053
1053
|
}]
|
|
1054
1054
|
}],
|
|
1055
1055
|
ctorParameters: () => [],
|