@hug/hospitality 1.0.0-alpha.8 → 1.0.0-alpha.9
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/buttons.mjs +68 -0
- package/fesm2022/buttons.mjs.map +1 -0
- package/material/actions-group/actions-group.scss +1 -2
- package/material/app-bar/app-bar.scss +1 -0
- package/material/column-bar/column-bar.scss +12 -0
- package/material/filters-group/filters-group.scss +25 -0
- package/material/panel-bar/panel-bar.scss +10 -0
- package/package.json +4 -2
- package/types/buttons.d.ts +25 -0
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { input, Directive } from '@angular/core';
|
|
3
|
+
|
|
4
|
+
/* eslint-disable @typescript-eslint/naming-convention */
|
|
5
|
+
class HyButtonAppearanceDirective {
|
|
6
|
+
hyAppearance = input(null, ...(ngDevMode ? [{ debugName: "hyAppearance" }] : []));
|
|
7
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: HyButtonAppearanceDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
8
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: HyButtonAppearanceDirective, isStandalone: true, selector: "button[matButton]:not([matButton=\"outlined\"]):not([matButton=\"tonal\"]):not([matButton=\"elevated\"])", inputs: { hyAppearance: { classPropertyName: "hyAppearance", publicName: "hyAppearance", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.hyAppearance": "hyAppearance()" } }, ngImport: i0 });
|
|
9
|
+
}
|
|
10
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: HyButtonAppearanceDirective, decorators: [{
|
|
11
|
+
type: Directive,
|
|
12
|
+
args: [{
|
|
13
|
+
selector: 'button[matButton]:not([matButton="outlined"]):not([matButton="tonal"]):not([matButton="elevated"])',
|
|
14
|
+
standalone: true,
|
|
15
|
+
host: {
|
|
16
|
+
'[attr.hyAppearance]': 'hyAppearance()'
|
|
17
|
+
}
|
|
18
|
+
}]
|
|
19
|
+
}], propDecorators: { hyAppearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "hyAppearance", required: false }] }] } });
|
|
20
|
+
|
|
21
|
+
/* eslint-disable @typescript-eslint/naming-convention */
|
|
22
|
+
class HyButtonSizeDirective {
|
|
23
|
+
hySize = input(null, ...(ngDevMode ? [{ debugName: "hySize" }] : []));
|
|
24
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: HyButtonSizeDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
25
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: HyButtonSizeDirective, isStandalone: true, selector: "button[hySize]", inputs: { hySize: { classPropertyName: "hySize", publicName: "hySize", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.hySize": "hySize()" } }, ngImport: i0 });
|
|
26
|
+
}
|
|
27
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: HyButtonSizeDirective, decorators: [{
|
|
28
|
+
type: Directive,
|
|
29
|
+
args: [{
|
|
30
|
+
selector: 'button[hySize]',
|
|
31
|
+
standalone: true,
|
|
32
|
+
host: {
|
|
33
|
+
'[attr.hySize]': 'hySize()'
|
|
34
|
+
}
|
|
35
|
+
}]
|
|
36
|
+
}], propDecorators: { hySize: [{ type: i0.Input, args: [{ isSignal: true, alias: "hySize", required: false }] }] } });
|
|
37
|
+
|
|
38
|
+
/* eslint-disable @typescript-eslint/naming-convention */
|
|
39
|
+
class HyIconButtonAppearanceDirective {
|
|
40
|
+
hyAppearance = input(null, ...(ngDevMode ? [{ debugName: "hyAppearance" }] : []));
|
|
41
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: HyIconButtonAppearanceDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
42
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.0", type: HyIconButtonAppearanceDirective, isStandalone: true, selector: "\n button[matIconButton][hyAppearance]\n ", inputs: { hyAppearance: { classPropertyName: "hyAppearance", publicName: "hyAppearance", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.hyAppearance": "hyAppearance()" } }, ngImport: i0 });
|
|
43
|
+
}
|
|
44
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: HyIconButtonAppearanceDirective, decorators: [{
|
|
45
|
+
type: Directive,
|
|
46
|
+
args: [{
|
|
47
|
+
selector: `
|
|
48
|
+
button[matIconButton][hyAppearance]
|
|
49
|
+
`,
|
|
50
|
+
standalone: true,
|
|
51
|
+
host: {
|
|
52
|
+
'[attr.hyAppearance]': 'hyAppearance()'
|
|
53
|
+
}
|
|
54
|
+
}]
|
|
55
|
+
}], propDecorators: { hyAppearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "hyAppearance", required: false }] }] } });
|
|
56
|
+
|
|
57
|
+
const BUTTON_DIRECTIVES = [
|
|
58
|
+
HyButtonSizeDirective,
|
|
59
|
+
HyButtonAppearanceDirective,
|
|
60
|
+
HyIconButtonAppearanceDirective
|
|
61
|
+
];
|
|
62
|
+
|
|
63
|
+
/**
|
|
64
|
+
* Generated bundle index. Do not edit.
|
|
65
|
+
*/
|
|
66
|
+
|
|
67
|
+
export { BUTTON_DIRECTIVES, HyButtonAppearanceDirective, HyButtonSizeDirective, HyIconButtonAppearanceDirective };
|
|
68
|
+
//# sourceMappingURL=buttons.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"buttons.mjs","sources":["../../material/button/directives/button-appearance.directive.ts","../../material/button/directives/button-size.directive.ts","../../material/button/directives/icon-button-appearance.directive.ts","../../material/button/directives/button-styling.directives.ts","../../material/button/buttons.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\nimport { Directive, input } from '@angular/core';\n\nexport type HyAppearanceType = 'warning';\n\n@Directive({\n selector: 'button[matButton]:not([matButton=\"outlined\"]):not([matButton=\"tonal\"]):not([matButton=\"elevated\"])',\n standalone: true,\n host: {\n '[attr.hyAppearance]': 'hyAppearance()'\n }\n})\nexport class HyButtonAppearanceDirective {\n public hyAppearance = input<HyAppearanceType | null>(null);\n}\n","/* eslint-disable @typescript-eslint/naming-convention */\nimport { Directive, input } from '@angular/core';\n\nexport type HySizeType = 'small' | 'medium' | 'x-large';\n\n@Directive({\n selector: 'button[hySize]',\n standalone: true,\n host: {\n '[attr.hySize]': 'hySize()'\n }\n})\nexport class HyButtonSizeDirective {\n public hySize = input<HySizeType | null>(null);\n}\n","/* eslint-disable @typescript-eslint/naming-convention */\nimport { Directive, input } from '@angular/core';\n\nexport type HyAppearanceIconType = 'warning' | 'warning-filled' | 'tonal' | 'filled';\n\n@Directive({\n selector: `\n button[matIconButton][hyAppearance]\n `,\n standalone: true,\n host: {\n '[attr.hyAppearance]': 'hyAppearance()'\n }\n})\nexport class HyIconButtonAppearanceDirective {\n public hyAppearance = input<HyAppearanceIconType | null>(null);\n}\n","import { HyButtonAppearanceDirective } from './button-appearance.directive';\nimport { HyButtonSizeDirective } from './button-size.directive';\nimport { HyIconButtonAppearanceDirective } from './icon-button-appearance.directive';\n\nexport const BUTTON_DIRECTIVES = [\n HyButtonSizeDirective,\n HyButtonAppearanceDirective,\n HyIconButtonAppearanceDirective\n] as const;\n\nexport {\n HyButtonAppearanceDirective, HyButtonSizeDirective, HyIconButtonAppearanceDirective\n};\n\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAAA;MAYa,2BAA2B,CAAA;AAC7B,IAAA,YAAY,GAAG,KAAK,CAA0B,IAAI,wDAAC;uGADjD,2BAA2B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAA3B,2BAA2B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,0GAAA,EAAA,MAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,mBAAA,EAAA,gBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAA3B,2BAA2B,EAAA,UAAA,EAAA,CAAA;kBAPvC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,oGAAoG;AAC9G,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACF,wBAAA,qBAAqB,EAAE;AAC1B;AACJ,iBAAA;;;ACXD;MAYa,qBAAqB,CAAA;AACvB,IAAA,MAAM,GAAG,KAAK,CAAoB,IAAI,kDAAC;uGADrC,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAArB,qBAAqB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,aAAA,EAAA,UAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAArB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAPjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,gBAAgB;AAC1B,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACF,wBAAA,eAAe,EAAE;AACpB;AACJ,iBAAA;;;ACXD;MAca,+BAA+B,CAAA;AACjC,IAAA,YAAY,GAAG,KAAK,CAA8B,IAAI,wDAAC;uGADrD,+BAA+B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAA/B,+BAA+B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qDAAA,EAAA,MAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,mBAAA,EAAA,gBAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAA/B,+BAA+B,EAAA,UAAA,EAAA,CAAA;kBAT3C,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE;;AAET,IAAA,CAAA;AACD,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACF,wBAAA,qBAAqB,EAAE;AAC1B;AACJ,iBAAA;;;ACTM,MAAM,iBAAiB,GAAG;IAC7B,qBAAqB;IACrB,2BAA2B;IAC3B;;;ACPJ;;AAEG;;;;"}
|
|
@@ -3,8 +3,7 @@ html {
|
|
|
3
3
|
|
|
4
4
|
ngx-actions-group {
|
|
5
5
|
--ngx-actions-group-gap: var(--hy-spacing-medium-small);
|
|
6
|
-
--ngx-actions-group-padding: var(--hy-spacing-small);
|
|
7
|
-
|
|
6
|
+
--ngx-actions-group-padding: var(--hy-spacing-x-small);
|
|
8
7
|
--ngx-actions-group-radius: var(--hy-radius-x-large);
|
|
9
8
|
}
|
|
10
9
|
}
|
|
@@ -3,6 +3,7 @@ ngx-app-bar {
|
|
|
3
3
|
--ngx-app-bar-gap: var(--hy-spacing-x-small);
|
|
4
4
|
--ngx-app-bar-condensed-gap: var(--hy-spacing-small);
|
|
5
5
|
--ngx-app-bar-actions-gap: var(--hy-spacing-small);
|
|
6
|
+
--ngx-app-bar-with-subtitle-padding-block: var(--hy-spacing-x-small);
|
|
6
7
|
|
|
7
8
|
--ngx-app-bar-title-font: var(--hy-typo-headline-medium-emphasized);
|
|
8
9
|
--ngx-app-bar-title-letter-spacing: var(
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
ngx-column-bar {
|
|
2
|
+
--ngx-column-bar-padding: var(--hy-spacing-x-small) var(--hy-spacing-small);
|
|
3
|
+
--ngx-column-bar-title-first-child-padding-inline-start: var(
|
|
4
|
+
--hy-spacing-x-small
|
|
5
|
+
);
|
|
6
|
+
|
|
7
|
+
--ngx-column-bar-gap: var(--hy-spacing-medium);
|
|
8
|
+
--ngx-column-bar-elements-gap: var(--hy-spacing-medium);
|
|
9
|
+
|
|
10
|
+
--ngx-column-bar-actions-group-min-inline-size: 3rem;
|
|
11
|
+
--ngx-column-bar-title-min-width: 6ch;
|
|
12
|
+
}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
ngx-filters-group {
|
|
2
|
+
--ngx-filters-group-selected-label-max-width: 27ch;
|
|
3
|
+
--ngx-filters-group-title-overlay-max-width: 27ch;
|
|
4
|
+
|
|
5
|
+
--ngx-filters-group-gap: var(--hy-spacing-small);
|
|
6
|
+
--ngx-filters-group-static-gap: var(--hy-spacing-small);
|
|
7
|
+
--ngx-filters-group-overlay-content-gap: var(--hy-spacing-small);
|
|
8
|
+
--ngx-filters-group-overlay-content-filter-gap: var(--hy-spacing-small);
|
|
9
|
+
|
|
10
|
+
--ngx-filters-group-block-size: 3rem;
|
|
11
|
+
--ngx-filters-group-border-radius: var(--hy-border-radius-x-large);
|
|
12
|
+
--ngx-filters-group-first-chip-option-shape-radius: var(
|
|
13
|
+
--hy-border-radius-medium
|
|
14
|
+
)
|
|
15
|
+
var(--hy-border-radius-small) var(--hy-border-radius-small)
|
|
16
|
+
var(--hy-border-radius-medium);
|
|
17
|
+
--ngx-filters-group-overlay-border-radius: var(--hy-border-radius-small);
|
|
18
|
+
--ngx-filters-group-first-chip-shape-radius: var(--hy-border-radius-small);
|
|
19
|
+
|
|
20
|
+
--ngx-filters-group-overlay-filter-padding: var(--hy-spacing-medium);
|
|
21
|
+
--ngx-filters-group-padding-inline: var(--hy-spacing-small);
|
|
22
|
+
--ngx-filters-group-overlay-title-padding-inline: var(--hy-spacing-medium);
|
|
23
|
+
--ngx-filters-group-folded-padding-inline: var(--hy-spacing-x-small);
|
|
24
|
+
--ngx-filters-group-overlay-title-padding-block: var(--hy-spacing-medium);
|
|
25
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
ngx-panel-bar {
|
|
2
|
+
--ngx-panel-bar-min-height: 3rem;
|
|
3
|
+
--ngx-panel-bar-actions-group-min-inline-size: 3rem;
|
|
4
|
+
--ngx-panel-bar-title-min-width: 6ch;
|
|
5
|
+
|
|
6
|
+
--ngx-panel-bar-padding: var(--hy-spacing-x-small) var(--hy-spacing-small);
|
|
7
|
+
--ngx-panel-bar-gap: var(--hy-spacing-medium-small);
|
|
8
|
+
--ngx-panel-bar-title-first-child-padding-start: var(--hy-spacing-x-small);
|
|
9
|
+
--ngx-panel-bar-elements-gap: var(--hy-spacing-medium-small);
|
|
10
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hug/hospitality",
|
|
3
|
-
"version": "1.0.0-alpha.
|
|
3
|
+
"version": "1.0.0-alpha.9",
|
|
4
4
|
"description": "Hospitality Design System",
|
|
5
5
|
"homepage": "https://github.com/dsi-hug/hospitality",
|
|
6
6
|
"license": "GPL-3.0-only",
|
|
@@ -27,7 +27,9 @@
|
|
|
27
27
|
"sass": "./material/app-bar/app-bar.scss"
|
|
28
28
|
},
|
|
29
29
|
"./material/button": {
|
|
30
|
-
"sass": "./material/button/button.scss"
|
|
30
|
+
"sass": "./material/button/button.scss",
|
|
31
|
+
"types": "./types/buttons.d.ts",
|
|
32
|
+
"default": "./fesm2022/buttons.mjs"
|
|
31
33
|
},
|
|
32
34
|
"./material/dialog": {
|
|
33
35
|
"sass": "./material/dialog/dialog.scss"
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
|
|
3
|
+
declare class HyButtonAppearanceDirective {
|
|
4
|
+
hyAppearance: i0.InputSignal<"warning" | null>;
|
|
5
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<HyButtonAppearanceDirective, never>;
|
|
6
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<HyButtonAppearanceDirective, "button[matButton]:not([matButton=\"outlined\"]):not([matButton=\"tonal\"]):not([matButton=\"elevated\"])", never, { "hyAppearance": { "alias": "hyAppearance"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
type HySizeType = 'small' | 'medium' | 'x-large';
|
|
10
|
+
declare class HyButtonSizeDirective {
|
|
11
|
+
hySize: i0.InputSignal<HySizeType | null>;
|
|
12
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<HyButtonSizeDirective, never>;
|
|
13
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<HyButtonSizeDirective, "button[hySize]", never, { "hySize": { "alias": "hySize"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
type HyAppearanceIconType = 'warning' | 'warning-filled' | 'tonal' | 'filled';
|
|
17
|
+
declare class HyIconButtonAppearanceDirective {
|
|
18
|
+
hyAppearance: i0.InputSignal<HyAppearanceIconType | null>;
|
|
19
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<HyIconButtonAppearanceDirective, never>;
|
|
20
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<HyIconButtonAppearanceDirective, " button[matIconButton][hyAppearance] ", never, { "hyAppearance": { "alias": "hyAppearance"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
declare const BUTTON_DIRECTIVES: readonly [typeof HyButtonSizeDirective, typeof HyButtonAppearanceDirective, typeof HyIconButtonAppearanceDirective];
|
|
24
|
+
|
|
25
|
+
export { BUTTON_DIRECTIVES, HyButtonAppearanceDirective, HyButtonSizeDirective, HyIconButtonAppearanceDirective };
|