@openmrs/esm-styleguide 8.0.1-pre.3705 → 8.0.1-pre.3717

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.
Files changed (10) hide show
  1. package/.turbo/turbo-build.log +2 -2
  2. package/dist/openmrs-esm-styleguide.css +1 -1
  3. package/dist/openmrs-esm-styleguide.css.map +1 -1
  4. package/dist/workspaces2/action-menu2/action-menu2.component.d.ts.map +1 -1
  5. package/dist/workspaces2/workspace2.component.d.ts.map +1 -1
  6. package/package.json +12 -12
  7. package/src/components/_general.scss +1 -5
  8. package/src/workspaces2/action-menu2/action-menu2.component.tsx +0 -10
  9. package/src/workspaces2/workspace2.component.tsx +53 -43
  10. package/src/workspaces2/workspace2.module.scss +20 -2
package/dist/workspaces2/action-menu2/action-menu2.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"action-menu2.component.d.ts","sourceRoot":"","sources":["../../../src/workspaces2/action-menu2/action-menu2.component.tsx"],"names":[],"mappings":"AAAA,kCAAkC;AAClC,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,KAAK,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAOtE,MAAM,WAAW,eAAe;IAC9B,cAAc,EAAE,yBAAyB,GAAG;QAAE,UAAU,EAAE,MAAM,CAAA;KAAE,CAAC;IACnE,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,IAAI,CAAC;CACxC;AAED;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,EAAE,cAAc,EAAE,UAAU,EAAE,EAAE,eAAe,4BAgDzE;AAED,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"action-menu2.component.d.ts","sourceRoot":"","sources":["../../../src/workspaces2/action-menu2/action-menu2.component.tsx"],"names":[],"mappings":"AAAA,kCAAkC;AAClC,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,KAAK,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAOtE,MAAM,WAAW,eAAe;IAC9B,cAAc,EAAE,yBAAyB,GAAG;QAAE,UAAU,EAAE,MAAM,CAAA;KAAE,CAAC;IACnE,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,IAAI,CAAC;CACxC;AAED;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,EAAE,cAAc,EAAE,UAAU,EAAE,EAAE,eAAe,4BAsCzE;AAED,eAAe,UAAU,CAAC"}
package/dist/workspaces2/workspace2.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"workspace2.component.d.ts","sourceRoot":"","sources":["../../src/workspaces2/workspace2.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAWzD,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;GAEG;AACH,MAAM,WAAW,yBAAyB,CACxC,cAAc,SAAS,MAAM,GAAG,MAAM,EACtC,WAAW,SAAS,MAAM,GAAG,MAAM,EACnC,UAAU,SAAS,MAAM,GAAG,MAAM;IAElC;;;;;;OAMG;IACH,oBAAoB,CAAC,KAAK,SAAS,MAAM,EAAE,aAAa,EAAE,MAAM,EAAE,cAAc,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IAEhG;;;;;OAKG;IACH,cAAc,CAAC,OAAO,CAAC,EAAE;QAAE,WAAW,CAAC,EAAE,OAAO,CAAC;QAAC,qBAAqB,CAAC,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;IAEvG,cAAc,EAAE,cAAc,GAAG,IAAI,CAAC;IACtC,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;IAChC,UAAU,EAAE,UAAU,GAAG,IAAI,CAAC;IAC9B,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED;;GAEG;AACH,MAAM,MAAM,oBAAoB,CAC9B,cAAc,SAAS,MAAM,EAC7B,WAAW,SAAS,MAAM,EAC1B,UAAU,SAAS,MAAM,IACvB,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAAC,cAAc,EAAE,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC;AAEjF;;;;;;GAMG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAgJhD,CAAC"}
1
+ {"version":3,"file":"workspace2.component.d.ts","sourceRoot":"","sources":["../../src/workspaces2/workspace2.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAWzD,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;GAEG;AACH,MAAM,WAAW,yBAAyB,CACxC,cAAc,SAAS,MAAM,GAAG,MAAM,EACtC,WAAW,SAAS,MAAM,GAAG,MAAM,EACnC,UAAU,SAAS,MAAM,GAAG,MAAM;IAElC;;;;;;OAMG;IACH,oBAAoB,CAAC,KAAK,SAAS,MAAM,EAAE,aAAa,EAAE,MAAM,EAAE,cAAc,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IAEhG;;;;;OAKG;IACH,cAAc,CAAC,OAAO,CAAC,EAAE;QAAE,WAAW,CAAC,EAAE,OAAO,CAAC;QAAC,qBAAqB,CAAC,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;IAEvG,cAAc,EAAE,cAAc,GAAG,IAAI,CAAC;IACtC,WAAW,EAAE,WAAW,GAAG,IAAI,CAAC;IAChC,UAAU,EAAE,UAAU,GAAG,IAAI,CAAC;IAC9B,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED;;GAEG;AACH,MAAM,MAAM,oBAAoB,CAC9B,cAAc,SAAS,MAAM,EAC7B,WAAW,SAAS,MAAM,EAC1B,UAAU,SAAS,MAAM,IACvB,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAAC,cAAc,EAAE,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC;AAEjF;;;;;;GAMG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA0JhD,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@openmrs/esm-styleguide",
3
- "version": "8.0.1-pre.3705",
3
+ "version": "8.0.1-pre.3717",
4
4
  "license": "MPL-2.0",
5
5
  "description": "The styleguide for OpenMRS SPA",
6
6
  "main": "dist/openmrs-esm-styleguide.js",
@@ -98,17 +98,17 @@
98
98
  "swr": "2.x"
99
99
  },
100
100
  "devDependencies": {
101
- "@openmrs/esm-api": "8.0.1-pre.3705",
102
- "@openmrs/esm-config": "8.0.1-pre.3705",
103
- "@openmrs/esm-emr-api": "8.0.1-pre.3705",
104
- "@openmrs/esm-error-handling": "8.0.1-pre.3705",
105
- "@openmrs/esm-extensions": "8.0.1-pre.3705",
106
- "@openmrs/esm-globals": "8.0.1-pre.3705",
107
- "@openmrs/esm-navigation": "8.0.1-pre.3705",
108
- "@openmrs/esm-react-utils": "8.0.1-pre.3705",
109
- "@openmrs/esm-state": "8.0.1-pre.3705",
110
- "@openmrs/esm-translations": "8.0.1-pre.3705",
111
- "@openmrs/esm-utils": "8.0.1-pre.3705",
101
+ "@openmrs/esm-api": "8.0.1-pre.3717",
102
+ "@openmrs/esm-config": "8.0.1-pre.3717",
103
+ "@openmrs/esm-emr-api": "8.0.1-pre.3717",
104
+ "@openmrs/esm-error-handling": "8.0.1-pre.3717",
105
+ "@openmrs/esm-extensions": "8.0.1-pre.3717",
106
+ "@openmrs/esm-globals": "8.0.1-pre.3717",
107
+ "@openmrs/esm-navigation": "8.0.1-pre.3717",
108
+ "@openmrs/esm-react-utils": "8.0.1-pre.3717",
109
+ "@openmrs/esm-state": "8.0.1-pre.3717",
110
+ "@openmrs/esm-translations": "8.0.1-pre.3717",
111
+ "@openmrs/esm-utils": "8.0.1-pre.3717",
112
112
  "@rspack/cli": "^1.3.11",
113
113
  "@rspack/core": "^1.3.11",
114
114
  "@types/geopattern": "^1.2.9",
package/src/components/_general.scss CHANGED
@@ -5,11 +5,6 @@ html {
5
5
  scroll-behavior: smooth;
6
6
  }
7
7
 
8
- body {
9
- display: flex;
10
- flex-direction: column;
11
- }
12
-
13
8
  .omrs-app-error {
14
9
  padding: layout.$spacing-11;
15
10
  width: 100%;
@@ -61,4 +56,5 @@ body {
61
56
  'topNav topNav topNav'
62
57
  'leftNav appRoots workspace';
63
58
  grid-template-columns: min-content 1fr min-content;
59
+ container-type: inline-size;
64
60
  }
package/src/workspaces2/action-menu2/action-menu2.component.tsx CHANGED
@@ -58,16 +58,6 @@ export function ActionMenu({ workspaceGroup, groupProps }: ActionMenuProps) {
58
58
  <ExtensionSlot className={styles.container} name={workspaceGroup.name} state={{ groupProps }} />
59
59
  </ComponentContext.Provider>
60
60
  </div>
61
- {isClosable && !isDesktop(layout) && (
62
- <IconButton
63
- align="left"
64
- onClick={() => closeWorkspaceGroup2()}
65
- label={getCoreTranslation('close')}
66
- kind="ghost"
67
- >
68
- <CloseIcon />
69
- </IconButton>
70
- )}
71
61
  </aside>
72
62
  );
73
63
  }
package/src/workspaces2/workspace2.component.tsx CHANGED
@@ -6,7 +6,7 @@ import { isDesktop, useLayoutType } from '@openmrs/esm-react-utils';
6
6
  import { getCoreTranslation } from '@openmrs/esm-translations';
7
7
  import { getOpenedWindowIndexByWorkspace } from '@openmrs/esm-extensions';
8
8
  import { ArrowRightIcon, CloseIcon } from '../icons';
9
- import { useWorkspace2Store, useWorkspace2Context } from './workspace2';
9
+ import { useWorkspace2Store, useWorkspace2Context, closeWorkspaceGroup2 } from './workspace2';
10
10
  import styles from './workspace2.module.scss';
11
11
 
12
12
  interface Workspace2Props {
@@ -154,56 +154,66 @@ export const Workspace2: React.FC<Workspace2Props> = ({ title, children, hasUnsa
154
154
  [styles.isRootWorkspace]: isRootWorkspace,
155
155
  })}
156
156
  >
157
- <>
158
- <Header aria-label={getCoreTranslation('workspaceHeader')} className={styles.header}>
159
- <HeaderName prefix="">{title}</HeaderName>
160
- <div className={styles.overlayHeaderSpacer} />
161
- <HeaderGlobalBar className={styles.headerButtons}>
162
- {isDesktop(layout) ? (
163
- <>
164
- {(canMaximize || maximized) && (
157
+ <Header aria-label={getCoreTranslation('workspaceHeader')} className={styles.header}>
158
+ <HeaderName prefix="">{title}</HeaderName>
159
+ <div className={styles.overlayHeaderSpacer} />
160
+ <HeaderGlobalBar className={styles.headerButtons}>
161
+ {isDesktop(layout) ? (
162
+ <>
163
+ {(canMaximize || maximized) && (
164
+ <HeaderGlobalAction
165
+ aria-label={maximized ? getCoreTranslation('minimize') : getCoreTranslation('maximize')}
166
+ onClick={() => setWindowMaximized(windowName, !maximized)}
167
+ >
168
+ {maximized ? <Minimize /> : <Maximize />}
169
+ </HeaderGlobalAction>
170
+ )}
171
+ {canHide ? (
172
+ <HeaderGlobalAction aria-label={getCoreTranslation('hide')} onClick={() => hideWindow()}>
173
+ <ArrowRightIcon />
174
+ </HeaderGlobalAction>
175
+ ) : (
176
+ // in desktop mode, if the group is closeable, the close button
177
+ // is rendered in the side nav, not in the workspace
178
+ !canCloseGroup && (
165
179
  <HeaderGlobalAction
166
- aria-label={maximized ? getCoreTranslation('minimize') : getCoreTranslation('maximize')}
167
- onClick={() => setWindowMaximized(windowName, !maximized)}
180
+ aria-label={getCoreTranslation('close')}
181
+ onClick={() => closeWorkspace({ closeWindow: true })}
168
182
  >
169
- {maximized ? <Minimize /> : <Maximize />}
183
+ <CloseIcon />
170
184
  </HeaderGlobalAction>
171
- )}
172
- {canHide ? (
173
- <HeaderGlobalAction aria-label={getCoreTranslation('hide')} onClick={() => hideWindow()}>
174
- <ArrowRightIcon />
175
- </HeaderGlobalAction>
176
- ) : (
177
- !canCloseGroup && (
178
- <HeaderGlobalAction
179
- aria-label={getCoreTranslation('close')}
180
- onClick={() => closeWorkspace({ closeWindow: true })}
181
- >
182
- <CloseIcon />
183
- </HeaderGlobalAction>
184
- )
185
- )}
186
- </>
187
- ) : (
188
- <>
189
- {canHide && (
190
- <HeaderGlobalAction aria-label={getCoreTranslation('hide')} onClick={() => hideWindow()}>
191
- <DownToBottom />
192
- </HeaderGlobalAction>
193
- )}
194
-
185
+ )
186
+ )}
187
+ </>
188
+ ) : (
189
+ <>
190
+ {canHide ? (
191
+ <HeaderGlobalAction aria-label={getCoreTranslation('hide')} onClick={() => hideWindow()}>
192
+ <DownToBottom />
193
+ </HeaderGlobalAction>
194
+ ) : (
195
+ // in tablet mode, the close button is rendered regardless of
196
+ // whether the group is closeable. The close button closes
197
+ // the workspace group (and the side nav) if group is closeable;
198
+ // otherwise it only closes the workspace window.
195
199
  <HeaderGlobalAction
196
200
  aria-label={getCoreTranslation('close')}
197
- onClick={() => closeWorkspace({ closeWindow: true })}
201
+ onClick={() => {
202
+ if (canCloseGroup) {
203
+ closeWorkspaceGroup2();
204
+ } else {
205
+ closeWorkspace({ closeWindow: true });
206
+ }
207
+ }}
198
208
  >
199
209
  <CloseIcon />
200
210
  </HeaderGlobalAction>
201
- </>
202
- )}
203
- </HeaderGlobalBar>
204
- </Header>
205
- <div className={classNames(styles.workspaceContent)}>{children}</div>
206
- </>
211
+ )}
212
+ </>
213
+ )}
214
+ </HeaderGlobalBar>
215
+ </Header>
216
+ <div className={classNames(styles.workspaceContent)}>{children}</div>
207
217
  </div>
208
218
  </div>
209
219
  </div>
package/src/workspaces2/workspace2.module.scss CHANGED
@@ -166,8 +166,18 @@ $extraWideWorkspaceWidth: 48.25rem;
166
166
  }
167
167
  }
168
168
 
169
+ // fallback for browsers that don't support the container CSS feature,
170
+ // the width is slightly off if <body> has a vertical scrollbar
169
171
  .workspaceOuterContainer {
170
- width: 100vw !important;
172
+ width: 100vw;
173
+ }
174
+
175
+ // using the container CSS feature, for browser that support it
176
+ // get the container query width (i.e. width of <body>, without the scrollbars)
177
+ @supports (width: 100cqw) {
178
+ .workspaceOuterContainer {
179
+ width: 100cqw;
180
+ }
171
181
  }
172
182
 
173
183
  .workspaceMiddleContainer {
@@ -175,15 +185,23 @@ $extraWideWorkspaceWidth: 48.25rem;
175
185
  &.hidden {
176
186
  display: none;
177
187
  }
188
+
189
+ // in tablet mode, reduce the height to of the workspace window to accommodate the workspace menu (bottom nav)
190
+ height: calc(100% - layout.$spacing-10);
178
191
  }
179
192
 
180
193
  .workspaceInnerContainer {
181
- width: 100vw !important;
194
+ width: 100% !important;
182
195
  }
183
196
 
184
197
  .marginWorkspaceContent {
185
198
  margin-bottom: var(--bottom-nav-height);
186
199
  }
200
+
201
+ .workspaceContent {
202
+ overflow-y: auto;
203
+ height: 100%;
204
+ }
187
205
  }
188
206
 
189
207
  // Overriding styles for RTL support