@universityofmaryland/web-elements-library 1.6.2 → 1.6.4
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 +1 -1
- package/dist/atomic/text-lockup/small.d.ts.map +1 -1
- package/dist/atomic/text-lockup/small.js +2 -2
- package/dist/atomic/text-lockup/small.js.map +1 -1
- package/dist/atomic.js +4 -4
- package/dist/composite/person/hero.d.ts +2 -2
- package/dist/composite/person/hero.d.ts.map +1 -1
- package/dist/composite/person/hero.js +6 -6
- package/dist/composite/person/hero.js.map +1 -1
- package/dist/composite.js +4 -4
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# University of Maryland Web Elements Library
|
|
2
2
|
|
|
3
|
-
[](https://www.npmjs.com/package/@universityofmaryland/web-elements-library)
|
|
4
4
|
|
|
5
5
|
Foundational UI building blocks for the UMD Design System, providing atomic elements that combine to create complex, accessible, and brand-compliant University of Maryland digital experiences.
|
|
6
6
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"small.d.ts","sourceRoot":"","sources":["../../../source/atomic/text-lockup/small.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,KAAK,SAAS,GAAG;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,KAAK,WAAW,GAAG,SAAS,GAAG;IAC7B,OAAO,EAAE,WAAW,CAAC;CACtB,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,OAAO,EAAE,WAAW,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG;IAC5C,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,OAAO,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,IAAI,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,IAAI,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B,CAAC;AAkBF,eAAO,MAAM,aAAa;;;;;;;;;;CAWzB,CAAC;AAEF,eAAO,MAAM,YAAY;;;;CAIxB,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;CAiB1B,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,cAAc,OAAO;;;;;;;;;;CAc9C,CAAC;AAEH,eAAO,MAAM,UAAU,GAAI,cAAc,OAAO;;;;;;;;;;;CAc9C,CAAC;AAEH,eAAO,MAAM,aAAa,GAAI,0BAA0B,WAAW,kFAQvD,CAAC;AAEb,eAAO,MAAM,mBAAmB,GAAI,aAAa,WAAW,kFAIhD,CAAC;AAEb,eAAO,MAAM,aAAa,GAAI,aAAa,WAAW,kFAQ1C,CAAC;AAEb,eAAO,MAAM,qBAAqB,GAAI,qEAQnC,mBAAmB,
|
|
1
|
+
{"version":3,"file":"small.d.ts","sourceRoot":"","sources":["../../../source/atomic/text-lockup/small.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,KAAK,SAAS,GAAG;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,KAAK,WAAW,GAAG,SAAS,GAAG;IAC7B,OAAO,EAAE,WAAW,CAAC;CACtB,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,OAAO,EAAE,WAAW,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG;IAC5C,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,OAAO,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,IAAI,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,IAAI,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B,CAAC;AAkBF,eAAO,MAAM,aAAa;;;;;;;;;;CAWzB,CAAC;AAEF,eAAO,MAAM,YAAY;;;;CAIxB,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;CAiB1B,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,cAAc,OAAO;;;;;;;;;;CAc9C,CAAC;AAEH,eAAO,MAAM,UAAU,GAAI,cAAc,OAAO;;;;;;;;;;;CAc9C,CAAC;AAEH,eAAO,MAAM,aAAa,GAAI,0BAA0B,WAAW,kFAQvD,CAAC;AAEb,eAAO,MAAM,mBAAmB,GAAI,aAAa,WAAW,kFAIhD,CAAC;AAEb,eAAO,MAAM,aAAa,GAAI,aAAa,WAAW,kFAQ1C,CAAC;AAEb,eAAO,MAAM,qBAAqB,GAAI,qEAQnC,mBAAmB,kFAwErB,CAAC"}
|
|
@@ -133,11 +133,11 @@ const createTextLockupSmall = ({
|
|
|
133
133
|
container.withChild(textElement);
|
|
134
134
|
}
|
|
135
135
|
if (date) {
|
|
136
|
-
const dateElement = new ElementBuilder(
|
|
136
|
+
const dateElement = new ElementBuilder(date).withClassName("umd-headline-sans-min").styled(
|
|
137
137
|
typography.sans.compose("min", {
|
|
138
138
|
theme: theme.fontColor(isThemeDark)
|
|
139
139
|
})
|
|
140
|
-
).withAnimation("slideUnder").
|
|
140
|
+
).withAnimation("slideUnder").withStyles(dateStyles(isThemeDark)).build();
|
|
141
141
|
container.withChild(dateElement);
|
|
142
142
|
}
|
|
143
143
|
if (actions) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"small.js","sources":["../../../source/atomic/text-lockup/small.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport * as elementStyles from '@universityofmaryland/web-styles-library/element';\nimport * as typography from '@universityofmaryland/web-styles-library/typography';\nimport * as layout from '@universityofmaryland/web-styles-library/layout';\nimport * as animationStyles from '@universityofmaryland/web-styles-library/animation';\nimport { wrapTextNodeInSpan } from '@universityofmaryland/web-utilities-library/dom';\nimport { theme } from '@universityofmaryland/web-utilities-library/theme';\nimport { type UMDElement } from '../../_types';\n\ntype TypeTheme = {\n isThemeDark?: boolean;\n};\n\ntype TypeEyebrow = TypeTheme & {\n eyebrow: HTMLElement;\n};\n\ntype TypeActions = {\n actions: HTMLElement;\n};\n\nexport type TypeTextLockupSmall = TypeTheme & {\n headline: HTMLElement | null;\n eyebrow?: HTMLElement | null;\n text?: HTMLElement | null;\n date?: HTMLElement | null;\n actions?: HTMLElement | null;\n eventMeta?: UMDElement;\n hasEyebrowRibbon?: boolean;\n};\n\nconst ELEMENT_TEXT_LOCKUP_SMALL_CONTAINER = 'text-lockup-small-container';\nconst metaContainer = elementStyles?.event?.meta?.container;\nconst metaClass: string = (() => {\n if (!metaContainer?.className) return '';\n\n if (Array.isArray(metaContainer.className)) {\n return metaContainer.className[0] || '';\n }\n\n if (typeof metaContainer.className === 'string') {\n return metaContainer.className;\n }\n\n return '';\n})();\n\nexport const eyebrowStyles = {\n element: {\n display: 'block',\n\n ['*']: {\n color: 'currentColor',\n },\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n },\n};\n\nexport const ribbonStyles = {\n siblingAfter: {\n marginTop: token.spacing.sm,\n },\n};\n\nexport const headlineStyles = {\n element: {\n fontWeight: '700',\n\n [`& + *`]: {\n marginTop: token.spacing.sm,\n },\n\n [`& + .${metaClass}`]: {\n [`@media (max-width: 479px)`]: {\n marginTop: token.spacing.min,\n },\n },\n },\n subElement: {\n color: 'currentColor',\n },\n};\n\nexport const textStyles = (isThemeDark?: boolean) => ({\n element: {\n ...(!isThemeDark && {\n color: `${token.color.gray.dark}`,\n }),\n },\n child: {\n ...(!isThemeDark && {\n color: `${token.color.gray.dark}`,\n }),\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n },\n});\n\nexport const dateStyles = (isThemeDark?: boolean) => ({\n element: {\n display: 'block',\n\n ...(!isThemeDark && {\n color: `${token.color.gray.mediumAA}`,\n }),\n },\n child: {\n color: 'currentColor',\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n },\n});\n\nexport const createEyebrow = ({ eyebrow, isThemeDark }: TypeEyebrow) =>\n new ElementBuilder(eyebrow)\n .styled(\n typography.elements.compose('eyebrow', {\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withStyles(eyebrowStyles)\n .build();\n\nexport const createRibbonEyebrow = ({ eyebrow }: TypeEyebrow) =>\n new ElementBuilder(eyebrow)\n .styled(elementStyles.text.decoration.ribbon)\n .withStyles(ribbonStyles)\n .build();\n\nexport const createActions = ({ actions }: TypeActions) =>\n new ElementBuilder(actions)\n .styled(layout.grid.inline.tabletRows)\n .withStyles({\n element: {\n marginTop: token.spacing.sm,\n },\n })\n .build();\n\nexport const createTextLockupSmall = ({\n eyebrow,\n headline,\n text,\n actions,\n date,\n eventMeta,\n isThemeDark,\n}: TypeTextLockupSmall) => {\n const container = new ElementBuilder()\n .withClassName(ELEMENT_TEXT_LOCKUP_SMALL_CONTAINER)\n .withStyles({\n element: {\n zIndex: '9',\n position: 'relative',\n },\n });\n\n if (eyebrow) {\n const eyebrowElement = createEyebrow({ eyebrow, isThemeDark });\n container.withChild(eyebrowElement);\n }\n\n if (headline) {\n const composeHeadlineStyles = {\n ...animationStyles.line.composeSlideUnder({\n color: theme.foreground(isThemeDark),\n }),\n ...typography.sans.compose('larger', {\n theme: theme.fontColor(isThemeDark),\n }),\n };\n\n const headlineElement = new ElementBuilder(headline)\n .styled(composeHeadlineStyles)\n .withStyles(headlineStyles)\n .withModifier((el) => wrapTextNodeInSpan(el))\n .build();\n\n container.withChild(headlineElement);\n }\n\n if (eventMeta) {\n container.withChild(eventMeta);\n }\n\n if (text) {\n const textElement = new ElementBuilder(text)\n .styled(\n elementStyles.text.rich.composeSimple({\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withStyles(textStyles(isThemeDark))\n .build();\n\n container.withChild(textElement);\n }\n\n if (date) {\n const dateElement = new ElementBuilder(
|
|
1
|
+
{"version":3,"file":"small.js","sources":["../../../source/atomic/text-lockup/small.ts"],"sourcesContent":["import { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport * as token from '@universityofmaryland/web-token-library';\nimport * as elementStyles from '@universityofmaryland/web-styles-library/element';\nimport * as typography from '@universityofmaryland/web-styles-library/typography';\nimport * as layout from '@universityofmaryland/web-styles-library/layout';\nimport * as animationStyles from '@universityofmaryland/web-styles-library/animation';\nimport { wrapTextNodeInSpan } from '@universityofmaryland/web-utilities-library/dom';\nimport { theme } from '@universityofmaryland/web-utilities-library/theme';\nimport { type UMDElement } from '../../_types';\n\ntype TypeTheme = {\n isThemeDark?: boolean;\n};\n\ntype TypeEyebrow = TypeTheme & {\n eyebrow: HTMLElement;\n};\n\ntype TypeActions = {\n actions: HTMLElement;\n};\n\nexport type TypeTextLockupSmall = TypeTheme & {\n headline: HTMLElement | null;\n eyebrow?: HTMLElement | null;\n text?: HTMLElement | null;\n date?: HTMLElement | null;\n actions?: HTMLElement | null;\n eventMeta?: UMDElement;\n hasEyebrowRibbon?: boolean;\n};\n\nconst ELEMENT_TEXT_LOCKUP_SMALL_CONTAINER = 'text-lockup-small-container';\nconst metaContainer = elementStyles?.event?.meta?.container;\nconst metaClass: string = (() => {\n if (!metaContainer?.className) return '';\n\n if (Array.isArray(metaContainer.className)) {\n return metaContainer.className[0] || '';\n }\n\n if (typeof metaContainer.className === 'string') {\n return metaContainer.className;\n }\n\n return '';\n})();\n\nexport const eyebrowStyles = {\n element: {\n display: 'block',\n\n ['*']: {\n color: 'currentColor',\n },\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n },\n};\n\nexport const ribbonStyles = {\n siblingAfter: {\n marginTop: token.spacing.sm,\n },\n};\n\nexport const headlineStyles = {\n element: {\n fontWeight: '700',\n\n [`& + *`]: {\n marginTop: token.spacing.sm,\n },\n\n [`& + .${metaClass}`]: {\n [`@media (max-width: 479px)`]: {\n marginTop: token.spacing.min,\n },\n },\n },\n subElement: {\n color: 'currentColor',\n },\n};\n\nexport const textStyles = (isThemeDark?: boolean) => ({\n element: {\n ...(!isThemeDark && {\n color: `${token.color.gray.dark}`,\n }),\n },\n child: {\n ...(!isThemeDark && {\n color: `${token.color.gray.dark}`,\n }),\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n },\n});\n\nexport const dateStyles = (isThemeDark?: boolean) => ({\n element: {\n display: 'block',\n\n ...(!isThemeDark && {\n color: `${token.color.gray.mediumAA}`,\n }),\n },\n child: {\n color: 'currentColor',\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n },\n});\n\nexport const createEyebrow = ({ eyebrow, isThemeDark }: TypeEyebrow) =>\n new ElementBuilder(eyebrow)\n .styled(\n typography.elements.compose('eyebrow', {\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withStyles(eyebrowStyles)\n .build();\n\nexport const createRibbonEyebrow = ({ eyebrow }: TypeEyebrow) =>\n new ElementBuilder(eyebrow)\n .styled(elementStyles.text.decoration.ribbon)\n .withStyles(ribbonStyles)\n .build();\n\nexport const createActions = ({ actions }: TypeActions) =>\n new ElementBuilder(actions)\n .styled(layout.grid.inline.tabletRows)\n .withStyles({\n element: {\n marginTop: token.spacing.sm,\n },\n })\n .build();\n\nexport const createTextLockupSmall = ({\n eyebrow,\n headline,\n text,\n actions,\n date,\n eventMeta,\n isThemeDark,\n}: TypeTextLockupSmall) => {\n const container = new ElementBuilder()\n .withClassName(ELEMENT_TEXT_LOCKUP_SMALL_CONTAINER)\n .withStyles({\n element: {\n zIndex: '9',\n position: 'relative',\n },\n });\n\n if (eyebrow) {\n const eyebrowElement = createEyebrow({ eyebrow, isThemeDark });\n container.withChild(eyebrowElement);\n }\n\n if (headline) {\n const composeHeadlineStyles = {\n ...animationStyles.line.composeSlideUnder({\n color: theme.foreground(isThemeDark),\n }),\n ...typography.sans.compose('larger', {\n theme: theme.fontColor(isThemeDark),\n }),\n };\n\n const headlineElement = new ElementBuilder(headline)\n .styled(composeHeadlineStyles)\n .withStyles(headlineStyles)\n .withModifier((el) => wrapTextNodeInSpan(el))\n .build();\n\n container.withChild(headlineElement);\n }\n\n if (eventMeta) {\n container.withChild(eventMeta);\n }\n\n if (text) {\n const textElement = new ElementBuilder(text)\n .styled(\n elementStyles.text.rich.composeSimple({\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withStyles(textStyles(isThemeDark))\n .build();\n\n container.withChild(textElement);\n }\n\n if (date) {\n const dateElement = new ElementBuilder(date)\n .withClassName('umd-headline-sans-min')\n .styled(\n typography.sans.compose('min', {\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withAnimation('slideUnder')\n .withStyles(dateStyles(isThemeDark))\n .build();\n\n container.withChild(dateElement);\n }\n\n if (actions) {\n const actionsElement = createActions({ actions });\n container.withChild(actionsElement);\n }\n\n return container.build();\n};\n"],"names":["animationStyles"],"mappings":"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"}
|
package/dist/atomic.js
CHANGED
|
@@ -4,8 +4,8 @@ import * as index$2 from "./atomic/assets/index.js";
|
|
|
4
4
|
import * as index$3 from "./atomic/buttons/index.js";
|
|
5
5
|
import * as index$4 from "./atomic/events/index.js";
|
|
6
6
|
import * as index$5 from "./atomic/layout/index.js";
|
|
7
|
-
import * as index$
|
|
8
|
-
import * as index$
|
|
7
|
+
import * as index$7 from "./atomic/text-lockup/index.js";
|
|
8
|
+
import * as index$6 from "./atomic/text/index.js";
|
|
9
9
|
export {
|
|
10
10
|
index as actions,
|
|
11
11
|
index$1 as animations,
|
|
@@ -13,7 +13,7 @@ export {
|
|
|
13
13
|
index$3 as buttons,
|
|
14
14
|
index$4 as events,
|
|
15
15
|
index$5 as layout,
|
|
16
|
-
index$
|
|
17
|
-
index$
|
|
16
|
+
index$6 as text,
|
|
17
|
+
index$7 as textLockup
|
|
18
18
|
};
|
|
19
19
|
//# sourceMappingURL=atomic.js.map
|
|
@@ -5,8 +5,8 @@ interface Theme {
|
|
|
5
5
|
}
|
|
6
6
|
interface PersonText extends Theme {
|
|
7
7
|
name: HTMLElement | null;
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
slotOne?: HTMLElement | null;
|
|
9
|
+
slotFour?: HTMLElement | null;
|
|
10
10
|
}
|
|
11
11
|
interface PersonInfo extends PersonContact, Theme {
|
|
12
12
|
image?: HTMLImageElement | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hero.d.ts","sourceRoot":"","sources":["../../../source/composite/person/hero.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAEjD,UAAU,KAAK;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,UAAU,UAAW,SAAQ,KAAK;IAChC,IAAI,EAAE,WAAW,GAAG,IAAI,CAAC;IACzB,
|
|
1
|
+
{"version":3,"file":"hero.d.ts","sourceRoot":"","sources":["../../../source/composite/person/hero.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAEjD,UAAU,KAAK;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,UAAU,UAAW,SAAQ,KAAK;IAChC,IAAI,EAAE,WAAW,GAAG,IAAI,CAAC;IACzB,OAAO,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC7B,QAAQ,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CAC/B;AAED,UAAU,UAAW,SAAQ,aAAa,EAAE,KAAK;IAC/C,KAAK,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAChC,WAAW,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CAC/B;AAED,UAAU,UAAW,SAAQ,UAAU,EAAE,UAAU;IACjD,gBAAgB,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACtC,iBAAiB,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CACxC;AA0VD,eAAO,MAAM,yBAAyB,UA9F7B,UAAU,KAChB,YAAY,CAAC,WAAW,CA6FqC,CAAC"}
|
|
@@ -114,8 +114,8 @@ const CreateImageBlock = (props) => {
|
|
|
114
114
|
};
|
|
115
115
|
const CreateTextContainer = ({
|
|
116
116
|
name,
|
|
117
|
-
|
|
118
|
-
|
|
117
|
+
slotOne,
|
|
118
|
+
slotFour,
|
|
119
119
|
isThemeDark
|
|
120
120
|
}) => {
|
|
121
121
|
const lineWrapper = new ElementBuilder().styled(Styles.element.text.line.adjustentInset).withStyles({
|
|
@@ -123,9 +123,9 @@ const CreateTextContainer = ({
|
|
|
123
123
|
backgroundColor: `${isThemeDark ? token.color.gold : token.color.red}`
|
|
124
124
|
}
|
|
125
125
|
});
|
|
126
|
-
if (
|
|
126
|
+
if (slotFour) {
|
|
127
127
|
lineWrapper.withChild(
|
|
128
|
-
new ElementBuilder(
|
|
128
|
+
new ElementBuilder(slotFour).styled(
|
|
129
129
|
Styles.typography.sans.compose("small", {
|
|
130
130
|
theme: theme.fontColor(isThemeDark)
|
|
131
131
|
})
|
|
@@ -166,9 +166,9 @@ const CreateTextContainer = ({
|
|
|
166
166
|
}).build()
|
|
167
167
|
);
|
|
168
168
|
}
|
|
169
|
-
if (
|
|
169
|
+
if (slotOne) {
|
|
170
170
|
lineWrapper.withChild(
|
|
171
|
-
new ElementBuilder(
|
|
171
|
+
new ElementBuilder(slotOne).styled(
|
|
172
172
|
Styles.typography.sans.compose("medium", {
|
|
173
173
|
theme: theme.fontColor(isThemeDark)
|
|
174
174
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hero.js","sources":["../../../source/composite/person/hero.ts"],"sourcesContent":["import * as token from '@universityofmaryland/web-token-library';\nimport * as Styles from '@universityofmaryland/web-styles-library';\nimport { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport { theme } from '@universityofmaryland/web-utilities-library/theme';\nimport { assets, textLockup } from 'atomic';\nimport { PersonContact } from './_types';\nimport { type ElementModel } from '../../_types';\n\ninterface Theme {\n isThemeDark?: boolean;\n}\n\ninterface PersonText extends Theme {\n name: HTMLElement | null;\n job?: HTMLElement | null;\n subText?: HTMLElement | null;\n}\n\ninterface PersonInfo extends PersonContact, Theme {\n image?: HTMLImageElement | null;\n association?: HTMLElement | null;\n pronouns?: HTMLElement | null;\n}\n\ninterface PersonHero extends PersonText, PersonInfo {\n breadcrumbMobile?: HTMLElement | null;\n breadcrumbDesktop?: HTMLElement | null;\n}\n\nconst CreateImageBlock = (props: PersonInfo): ElementModel<HTMLElement> => {\n const { image, association, pronouns, isThemeDark } = props;\n\n const wrapper = new ElementBuilder().withClassName(\n 'umd-person-hero-image-wrapper',\n );\n\n const contactContainer = textLockup.contact({\n ...props,\n isThemeDark: !isThemeDark,\n });\n\n if (image) {\n const imageBlock = assets.image.background({\n element: image,\n isScaled: false,\n imageLoading: 'eager',\n imageFetchPriority: 'high',\n });\n\n const imageContainer = new ElementBuilder()\n .withClassName('umd-person-hero-image')\n .withChild(imageBlock)\n .withStyles({\n element: {\n backgroundColor: `${\n isThemeDark ? token.color.gray.lightest : token.color.gray.darker\n }`,\n display: 'flex',\n justifyContent: 'center',\n marginBottom: token.spacing.md,\n\n ['& img']: {\n [`@container (max-width: ${token.media.breakpoints.large.max})`]: {\n maxHeight: '160px',\n },\n },\n },\n })\n .build();\n\n wrapper.withChild(imageContainer);\n }\n\n if (association) {\n wrapper.withChild(\n new ElementBuilder(association)\n .styled(\n Styles.typography.sans.compose('large', {\n theme: theme.fontColor(!isThemeDark),\n }),\n )\n .withStyles({\n element: {\n display: 'block',\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n },\n })\n .build(),\n );\n }\n\n if (pronouns) {\n wrapper.withChild(\n new ElementBuilder(document.createElement('div'))\n .withClassName('umd-person-hero-pronouns')\n .withStyles({\n element: {\n color: `${isThemeDark ? token.color.black : token.color.white}`,\n fontStyle: 'italic',\n\n ['*']: {\n color: 'currentColor',\n },\n },\n siblingAfter: {\n display: 'block',\n marginTop: token.spacing.min,\n },\n })\n .withChild(pronouns)\n .build(),\n );\n }\n\n if (contactContainer) {\n wrapper.withChild(contactContainer);\n }\n\n const wrapperBuilt = wrapper.build();\n\n return new ElementBuilder()\n .withClassName('umd-person-hero-image-container')\n .withChild(wrapperBuilt)\n .withStyles({\n element: {\n paddingTop: `${token.spacing.lg}`,\n paddingBottom: `${token.spacing.lg}`,\n backgroundColor: `${\n isThemeDark ? token.color.gray.lightest : token.color.black\n }`,\n position: 'relative',\n\n [`@container (max-width: ${token.media.breakpoints.large.max})`]: {\n paddingLeft: `${token.spacing.md}`,\n paddingRight: `${token.spacing.md}`,\n },\n\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n padding: `${token.spacing.md}`,\n width: '30%',\n maxWidth: '320px',\n },\n },\n })\n .build();\n};\n\nconst CreateTextContainer = ({\n name,\n job,\n subText,\n isThemeDark,\n}: PersonText): ElementModel<HTMLElement> => {\n const lineWrapper = new ElementBuilder()\n .styled(Styles.element.text.line.adjustentInset)\n .withStyles({\n pseudoBefore: {\n backgroundColor: `${isThemeDark ? token.color.gold : token.color.red}`,\n },\n });\n\n if (subText) {\n lineWrapper.withChild(\n new ElementBuilder(subText)\n .styled(\n Styles.typography.sans.compose('small', {\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withStyles({\n element: {\n display: 'block',\n textTransform: 'uppercase',\n fontWeight: '700',\n maxWidth: '650px',\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n marginTop: token.spacing.sm,\n },\n },\n })\n .build(),\n );\n }\n\n if (name) {\n lineWrapper.withChild(\n new ElementBuilder(name)\n .styled(\n Styles.typography.campaign.compose('large', {\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withStyles({\n element: {\n textTransform: 'uppercase',\n fontWeight: '700',\n display: 'block',\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n marginTop: token.spacing.md,\n },\n },\n })\n .build(),\n );\n }\n\n if (job) {\n lineWrapper.withChild(\n new ElementBuilder(job)\n .styled(\n Styles.typography.sans.compose('medium', {\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withStyles({\n element: {\n display: 'block',\n\n ...(!isThemeDark && {\n color: token.color.gray.dark,\n }),\n },\n })\n .build(),\n );\n }\n\n const lineWrapperBuilt = lineWrapper.build();\n\n return new ElementBuilder()\n .withClassName('person-hero-text')\n .withChild(lineWrapperBuilt)\n .withStyles({\n element: {\n backgroundColor: `${\n isThemeDark ? token.color.black : token.color.gray.lightest\n }`,\n paddingTop: `${token.spacing['3xl']}`,\n paddingBottom: `${token.spacing['3xl']}`,\n position: 'relative',\n\n [`@container (max-width: ${token.media.breakpoints.large.max})`]: {\n paddingLeft: `${token.spacing.md}`,\n paddingRight: `${token.spacing.md}`,\n },\n\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n paddingTop: `0`,\n paddingBottom: `${token.spacing['7xl']}`,\n alignSelf: 'flex-start',\n },\n },\n pseudoBefore: {\n content: '\"\"',\n position: 'absolute',\n top: '-100px',\n left: '0',\n bottom: '0',\n width: '200vw',\n transform: 'translateX(-20%)',\n backgroundColor: `${\n isThemeDark ? token.color.black : token.color.gray.lightest\n }`,\n },\n })\n .build();\n};\n\nconst CreatePersonHeroElement = (\n props: PersonHero,\n): ElementModel<HTMLElement> => {\n const { breadcrumbMobile, breadcrumbDesktop } = props;\n const textContainer = CreateTextContainer(props);\n\n const textColumns = new ElementBuilder()\n .withClassName('umd-person-hero-columns')\n .withChild(textContainer)\n .withStyles({\n element: {\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n width: '70%',\n },\n },\n });\n\n if (breadcrumbDesktop) {\n const textColumnBreadcrumb = new ElementBuilder()\n .withClassName('umd-person-hero-breadcrumb-desktop')\n .withChild(breadcrumbDesktop)\n .withStyles({\n element: {\n [`@container (max-width: ${token.media.breakpoints.large.max})`]: {\n display: 'none',\n },\n },\n })\n .build();\n\n textColumns.withChild(textColumnBreadcrumb);\n }\n\n const textColumnsBuilt = textColumns.build();\n const imageBlock = CreateImageBlock(props);\n\n const elementWrapper = new ElementBuilder()\n .withClassName('umd-person-hero-wrapper')\n .withChild(textColumnsBuilt)\n .withChild(imageBlock)\n .withStyles({\n element: {\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n display: 'flex',\n justifyContent: 'space-between',\n paddingTop: `${token.spacing['7xl']}`,\n },\n },\n })\n .build();\n\n const elementLock = new ElementBuilder()\n .styled(Styles.layout.space.horizontal.larger)\n .withChild(elementWrapper)\n .withStyles({\n element: {\n [`@container (max-width: ${token.media.breakpoints.large.max})`]: {\n padding: '0',\n },\n },\n });\n\n if (breadcrumbMobile) {\n const mainBreadcrumb = new ElementBuilder()\n .withClassName('umd-person-hero-breadcrumb-mobile')\n .withChild(breadcrumbMobile)\n .withStyles({\n element: {\n paddingLeft: `${token.spacing.md}`,\n paddingRight: `${token.spacing.md}`,\n\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n display: 'none',\n },\n },\n })\n .build();\n\n elementLock.withChild(mainBreadcrumb);\n }\n\n const elementLockBuilt = elementLock.build();\n\n return new ElementBuilder()\n .withClassName('umd-person-hero')\n .withChild(elementLockBuilt)\n .withStyles({\n element: {\n overflow: 'hidden',\n containerType: 'inline-size',\n },\n })\n .build();\n};\n\nexport const createCompositePersonHero = CreatePersonHeroElement;\n"],"names":["textLockup.contact","assets.image.background"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"hero.js","sources":["../../../source/composite/person/hero.ts"],"sourcesContent":["import * as token from '@universityofmaryland/web-token-library';\nimport * as Styles from '@universityofmaryland/web-styles-library';\nimport { ElementBuilder } from '@universityofmaryland/web-builder-library';\nimport { theme } from '@universityofmaryland/web-utilities-library/theme';\nimport { assets, textLockup } from 'atomic';\nimport { PersonContact } from './_types';\nimport { type ElementModel } from '../../_types';\n\ninterface Theme {\n isThemeDark?: boolean;\n}\n\ninterface PersonText extends Theme {\n name: HTMLElement | null;\n slotOne?: HTMLElement | null;\n slotFour?: HTMLElement | null;\n}\n\ninterface PersonInfo extends PersonContact, Theme {\n image?: HTMLImageElement | null;\n association?: HTMLElement | null;\n pronouns?: HTMLElement | null;\n}\n\ninterface PersonHero extends PersonText, PersonInfo {\n breadcrumbMobile?: HTMLElement | null;\n breadcrumbDesktop?: HTMLElement | null;\n}\n\nconst CreateImageBlock = (props: PersonInfo): ElementModel<HTMLElement> => {\n const { image, association, pronouns, isThemeDark } = props;\n\n const wrapper = new ElementBuilder().withClassName(\n 'umd-person-hero-image-wrapper',\n );\n\n const contactContainer = textLockup.contact({\n ...props,\n isThemeDark: !isThemeDark,\n });\n\n if (image) {\n const imageBlock = assets.image.background({\n element: image,\n isScaled: false,\n imageLoading: 'eager',\n imageFetchPriority: 'high',\n });\n\n const imageContainer = new ElementBuilder()\n .withClassName('umd-person-hero-image')\n .withChild(imageBlock)\n .withStyles({\n element: {\n backgroundColor: `${\n isThemeDark ? token.color.gray.lightest : token.color.gray.darker\n }`,\n display: 'flex',\n justifyContent: 'center',\n marginBottom: token.spacing.md,\n\n ['& img']: {\n [`@container (max-width: ${token.media.breakpoints.large.max})`]: {\n maxHeight: '160px',\n },\n },\n },\n })\n .build();\n\n wrapper.withChild(imageContainer);\n }\n\n if (association) {\n wrapper.withChild(\n new ElementBuilder(association)\n .styled(\n Styles.typography.sans.compose('large', {\n theme: theme.fontColor(!isThemeDark),\n }),\n )\n .withStyles({\n element: {\n display: 'block',\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n },\n })\n .build(),\n );\n }\n\n if (pronouns) {\n wrapper.withChild(\n new ElementBuilder(document.createElement('div'))\n .withClassName('umd-person-hero-pronouns')\n .withStyles({\n element: {\n color: `${isThemeDark ? token.color.black : token.color.white}`,\n fontStyle: 'italic',\n\n ['*']: {\n color: 'currentColor',\n },\n },\n siblingAfter: {\n display: 'block',\n marginTop: token.spacing.min,\n },\n })\n .withChild(pronouns)\n .build(),\n );\n }\n\n if (contactContainer) {\n wrapper.withChild(contactContainer);\n }\n\n const wrapperBuilt = wrapper.build();\n\n return new ElementBuilder()\n .withClassName('umd-person-hero-image-container')\n .withChild(wrapperBuilt)\n .withStyles({\n element: {\n paddingTop: `${token.spacing.lg}`,\n paddingBottom: `${token.spacing.lg}`,\n backgroundColor: `${\n isThemeDark ? token.color.gray.lightest : token.color.black\n }`,\n position: 'relative',\n\n [`@container (max-width: ${token.media.breakpoints.large.max})`]: {\n paddingLeft: `${token.spacing.md}`,\n paddingRight: `${token.spacing.md}`,\n },\n\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n padding: `${token.spacing.md}`,\n width: '30%',\n maxWidth: '320px',\n },\n },\n })\n .build();\n};\n\nconst CreateTextContainer = ({\n name,\n slotOne,\n slotFour,\n isThemeDark,\n}: PersonText): ElementModel<HTMLElement> => {\n const lineWrapper = new ElementBuilder()\n .styled(Styles.element.text.line.adjustentInset)\n .withStyles({\n pseudoBefore: {\n backgroundColor: `${isThemeDark ? token.color.gold : token.color.red}`,\n },\n });\n\n if (slotFour) {\n lineWrapper.withChild(\n new ElementBuilder(slotFour)\n .styled(\n Styles.typography.sans.compose('small', {\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withStyles({\n element: {\n display: 'block',\n textTransform: 'uppercase',\n fontWeight: '700',\n maxWidth: '650px',\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n marginTop: token.spacing.sm,\n },\n },\n })\n .build(),\n );\n }\n\n if (name) {\n lineWrapper.withChild(\n new ElementBuilder(name)\n .styled(\n Styles.typography.campaign.compose('large', {\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withStyles({\n element: {\n textTransform: 'uppercase',\n fontWeight: '700',\n display: 'block',\n },\n siblingAfter: {\n marginTop: token.spacing.min,\n\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n marginTop: token.spacing.md,\n },\n },\n })\n .build(),\n );\n }\n\n if (slotOne) {\n lineWrapper.withChild(\n new ElementBuilder(slotOne)\n .styled(\n Styles.typography.sans.compose('medium', {\n theme: theme.fontColor(isThemeDark),\n }),\n )\n .withStyles({\n element: {\n display: 'block',\n\n ...(!isThemeDark && {\n color: token.color.gray.dark,\n }),\n },\n })\n .build(),\n );\n }\n\n const lineWrapperBuilt = lineWrapper.build();\n\n return new ElementBuilder()\n .withClassName('person-hero-text')\n .withChild(lineWrapperBuilt)\n .withStyles({\n element: {\n backgroundColor: `${\n isThemeDark ? token.color.black : token.color.gray.lightest\n }`,\n paddingTop: `${token.spacing['3xl']}`,\n paddingBottom: `${token.spacing['3xl']}`,\n position: 'relative',\n\n [`@container (max-width: ${token.media.breakpoints.large.max})`]: {\n paddingLeft: `${token.spacing.md}`,\n paddingRight: `${token.spacing.md}`,\n },\n\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n paddingTop: `0`,\n paddingBottom: `${token.spacing['7xl']}`,\n alignSelf: 'flex-start',\n },\n },\n pseudoBefore: {\n content: '\"\"',\n position: 'absolute',\n top: '-100px',\n left: '0',\n bottom: '0',\n width: '200vw',\n transform: 'translateX(-20%)',\n backgroundColor: `${\n isThemeDark ? token.color.black : token.color.gray.lightest\n }`,\n },\n })\n .build();\n};\n\nconst CreatePersonHeroElement = (\n props: PersonHero,\n): ElementModel<HTMLElement> => {\n const { breadcrumbMobile, breadcrumbDesktop } = props;\n const textContainer = CreateTextContainer(props);\n\n const textColumns = new ElementBuilder()\n .withClassName('umd-person-hero-columns')\n .withChild(textContainer)\n .withStyles({\n element: {\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n width: '70%',\n },\n },\n });\n\n if (breadcrumbDesktop) {\n const textColumnBreadcrumb = new ElementBuilder()\n .withClassName('umd-person-hero-breadcrumb-desktop')\n .withChild(breadcrumbDesktop)\n .withStyles({\n element: {\n [`@container (max-width: ${token.media.breakpoints.large.max})`]: {\n display: 'none',\n },\n },\n })\n .build();\n\n textColumns.withChild(textColumnBreadcrumb);\n }\n\n const textColumnsBuilt = textColumns.build();\n const imageBlock = CreateImageBlock(props);\n\n const elementWrapper = new ElementBuilder()\n .withClassName('umd-person-hero-wrapper')\n .withChild(textColumnsBuilt)\n .withChild(imageBlock)\n .withStyles({\n element: {\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n display: 'flex',\n justifyContent: 'space-between',\n paddingTop: `${token.spacing['7xl']}`,\n },\n },\n })\n .build();\n\n const elementLock = new ElementBuilder()\n .styled(Styles.layout.space.horizontal.larger)\n .withChild(elementWrapper)\n .withStyles({\n element: {\n [`@container (max-width: ${token.media.breakpoints.large.max})`]: {\n padding: '0',\n },\n },\n });\n\n if (breadcrumbMobile) {\n const mainBreadcrumb = new ElementBuilder()\n .withClassName('umd-person-hero-breadcrumb-mobile')\n .withChild(breadcrumbMobile)\n .withStyles({\n element: {\n paddingLeft: `${token.spacing.md}`,\n paddingRight: `${token.spacing.md}`,\n\n [`@container (min-width: ${token.media.breakpoints.tablet.min})`]: {\n display: 'none',\n },\n },\n })\n .build();\n\n elementLock.withChild(mainBreadcrumb);\n }\n\n const elementLockBuilt = elementLock.build();\n\n return new ElementBuilder()\n .withClassName('umd-person-hero')\n .withChild(elementLockBuilt)\n .withStyles({\n element: {\n overflow: 'hidden',\n containerType: 'inline-size',\n },\n })\n .build();\n};\n\nexport const createCompositePersonHero = CreatePersonHeroElement;\n"],"names":["textLockup.contact","assets.image.background"],"mappings":"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"}
|
package/dist/composite.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as index from "./composite/accordion/index.js";
|
|
2
|
-
import * as index$
|
|
3
|
-
import * as index$
|
|
2
|
+
import * as index$2 from "./composite/banner/index.js";
|
|
3
|
+
import * as index$1 from "./composite/alert/index.js";
|
|
4
4
|
import * as index$3 from "./composite/card/index.js";
|
|
5
5
|
import * as index$4 from "./composite/carousel/index.js";
|
|
6
6
|
import * as index$5 from "./composite/footer/index.js";
|
|
@@ -16,8 +16,8 @@ import * as index$e from "./composite/social/index.js";
|
|
|
16
16
|
import * as index$f from "./composite/tabs/index.js";
|
|
17
17
|
export {
|
|
18
18
|
index as accordion,
|
|
19
|
-
index$
|
|
20
|
-
index$
|
|
19
|
+
index$1 as alert,
|
|
20
|
+
index$2 as banner,
|
|
21
21
|
index$3 as card,
|
|
22
22
|
index$4 as carousel,
|
|
23
23
|
index$5 as footer,
|