@txstate-mws/svelte-components 0.0.67 → 1.0.3

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 (120) hide show
  1. package/README.md +39 -4
  2. package/{dist/ts/actions/a11y.d.ts → actions/buttonify.d.ts} +0 -0
  3. package/{dist/actions/a11y.js → actions/buttonify.js} +1 -6
  4. package/{dist/ts/actions → actions}/glue.d.ts +2 -2
  5. package/{dist/actions → actions}/glue.js +9 -16
  6. package/actions/index.d.ts +7 -0
  7. package/actions/index.js +7 -0
  8. package/actions/offset.d.ts +15 -0
  9. package/actions/offset.js +35 -0
  10. package/{dist/ts/actions → actions}/portal.d.ts +0 -0
  11. package/actions/portal.js +13 -0
  12. package/{dist/ts/actions → actions}/resize.d.ts +6 -2
  13. package/actions/resize.js +45 -0
  14. package/{dist/ts/actions → actions}/sticky.d.ts +2 -2
  15. package/{dist/actions → actions}/sticky.js +10 -18
  16. package/{dist/ts/actions → actions}/stickyfixed.d.ts +7 -7
  17. package/{dist/actions → actions}/stickyfixed.js +19 -28
  18. package/{dist/components → components}/CollapsingTable.svelte +13 -14
  19. package/components/CollapsingTable.svelte.d.ts +59 -0
  20. package/{dist/ts/components → components}/ConditionalWrapper.svelte +6 -7
  21. package/components/ConditionalWrapper.svelte.d.ts +23 -0
  22. package/{dist/components → components}/FocusLock.svelte +21 -19
  23. package/components/FocusLock.svelte.d.ts +26 -0
  24. package/components/Modal.svelte +53 -0
  25. package/components/Modal.svelte.d.ts +27 -0
  26. package/{dist/components → components}/PopupMenu.svelte +28 -30
  27. package/components/PopupMenu.svelte.d.ts +44 -0
  28. package/{dist/ts/components → components}/ScreenReaderOnly.svelte +4 -5
  29. package/components/ScreenReaderOnly.svelte.d.ts +20 -0
  30. package/{dist/ts/components → components}/index.d.ts +0 -0
  31. package/components/index.js +6 -0
  32. package/index.d.ts +4 -0
  33. package/index.js +4 -0
  34. package/package.json +47 -68
  35. package/{dist/ts/types → types}/CollapsingTable.d.ts +0 -0
  36. package/{dist/ts/tests/Actions/Actions.stories.d.ts → types/CollapsingTable.js} +0 -0
  37. package/{dist/ts/types → types}/PopupMenu.d.ts +0 -0
  38. package/{dist/ts/tests/CollapsingTable/CollapsingTable.stories.d.ts → types/PopupMenu.js} +0 -0
  39. package/types/index.d.ts +2 -0
  40. package/types/index.js +2 -0
  41. package/{dist/ts/lib → util}/bodyoffset.d.ts +2 -1
  42. package/{dist/lib → util}/bodyoffset.js +10 -14
  43. package/util/index.d.ts +3 -0
  44. package/util/index.js +3 -0
  45. package/{dist/ts/lib → util}/repositioned.d.ts +1 -2
  46. package/{dist/lib → util}/repositioned.js +14 -24
  47. package/{dist/ts/lib → util}/util.d.ts +0 -0
  48. package/util/util.js +10 -0
  49. package/LICENSE +0 -21
  50. package/dist/actions/a11y.js.map +0 -1
  51. package/dist/actions/glue.js.map +0 -1
  52. package/dist/actions/index.js +0 -20
  53. package/dist/actions/index.js.map +0 -1
  54. package/dist/actions/offset.js +0 -35
  55. package/dist/actions/offset.js.map +0 -1
  56. package/dist/actions/portal.js +0 -23
  57. package/dist/actions/portal.js.map +0 -1
  58. package/dist/actions/resize.js +0 -48
  59. package/dist/actions/resize.js.map +0 -1
  60. package/dist/actions/sticky.js.map +0 -1
  61. package/dist/actions/stickyfixed.js.map +0 -1
  62. package/dist/components/ConditionalWrapper.svelte +0 -38
  63. package/dist/components/Modal.svelte +0 -44
  64. package/dist/components/ScreenReaderOnly.svelte +0 -26
  65. package/dist/components/index.js +0 -19
  66. package/dist/components/index.js.map +0 -1
  67. package/dist/index.js +0 -17
  68. package/dist/index.js.map +0 -1
  69. package/dist/lib/bodyoffset.js.map +0 -1
  70. package/dist/lib/deepstore.js +0 -80
  71. package/dist/lib/deepstore.js.map +0 -1
  72. package/dist/lib/derivedstore.js +0 -53
  73. package/dist/lib/derivedstore.js.map +0 -1
  74. package/dist/lib/index.js +0 -20
  75. package/dist/lib/index.js.map +0 -1
  76. package/dist/lib/repositioned.js.map +0 -1
  77. package/dist/lib/safestore.js +0 -16
  78. package/dist/lib/safestore.js.map +0 -1
  79. package/dist/lib/substore.js +0 -46
  80. package/dist/lib/substore.js.map +0 -1
  81. package/dist/lib/util.js +0 -16
  82. package/dist/lib/util.js.map +0 -1
  83. package/dist/ts/actions/index.d.ts +0 -7
  84. package/dist/ts/actions/offset.d.ts +0 -15
  85. package/dist/ts/components/CollapsingTable.svelte +0 -147
  86. package/dist/ts/components/FocusLock.svelte +0 -100
  87. package/dist/ts/components/Modal.svelte +0 -45
  88. package/dist/ts/components/PopupMenu.svelte +0 -278
  89. package/dist/ts/index.d.ts +0 -4
  90. package/dist/ts/lib/deepstore.d.ts +0 -42
  91. package/dist/ts/lib/derivedstore.d.ts +0 -16
  92. package/dist/ts/lib/index.d.ts +0 -7
  93. package/dist/ts/lib/safestore.d.ts +0 -4
  94. package/dist/ts/lib/substore.d.ts +0 -23
  95. package/dist/ts/tests/Actions/Offset.svelte +0 -34
  96. package/dist/ts/tests/Actions/Resize.svelte +0 -31
  97. package/dist/ts/tests/Actions/Sticky.svelte +0 -65
  98. package/dist/ts/tests/CollapsingTable/CollapsingTable.test.d.ts +0 -1
  99. package/dist/ts/tests/CollapsingTable/CollapsingTableTest.svelte +0 -36
  100. package/dist/ts/tests/Modal/Modal.stories.d.ts +0 -1
  101. package/dist/ts/tests/Modal/Modal.test.d.ts +0 -1
  102. package/dist/ts/tests/Modal/ModalTest.svelte +0 -58
  103. package/dist/ts/tests/PopupMenu/PopupMenu.stories.d.ts +0 -1
  104. package/dist/ts/tests/PopupMenu/PopupMenu.test.d.ts +0 -1
  105. package/dist/ts/tests/PopupMenu/PopupMenuBody.svelte +0 -34
  106. package/dist/ts/tests/PopupMenu/PopupMenuButtonIsParent.svelte +0 -36
  107. package/dist/ts/tests/PopupMenu/PopupMenuComplex.svelte +0 -34
  108. package/dist/ts/tests/PopupMenu/PopupMenuSimple.svelte +0 -30
  109. package/dist/ts/tests/stores/deepstore.test.d.ts +0 -1
  110. package/dist/ts/types/index.d.ts +0 -2
  111. package/dist/types/CollapsingTable.js +0 -3
  112. package/dist/types/CollapsingTable.js.map +0 -1
  113. package/dist/types/PopupMenu.js +0 -3
  114. package/dist/types/PopupMenu.js.map +0 -1
  115. package/dist/types/index.js +0 -15
  116. package/dist/types/index.js.map +0 -1
  117. package/docs/CollapsingTable.md +0 -80
  118. package/docs/actions.md +0 -10
  119. package/esm/index.js +0 -1
  120. package/esm/package.json +0 -3
@@ -1,26 +0,0 @@
1
- <script>
2
- export let id = ''
3
- export let arialive = ''
4
- export let ariaatomic = ''
5
- </script>
6
-
7
- <style>
8
- .sr-only {
9
- border: 0 !important;
10
- clip: rect(1px, 1px, 1px, 1px) !important;
11
- -webkit-clip-path: inset(50%) !important;
12
- clip-path: inset(50%) !important;
13
- height: 1px !important;
14
- margin: -1px !important;
15
- overflow: hidden !important;
16
- padding: 0 !important;
17
- position: absolute !important;
18
- width: 1px !important;
19
- white-space: nowrap !important;
20
- font-size: 20px !important;
21
- background: white !important;
22
- color: black !important;
23
- }
24
- </style>
25
-
26
- <span id={id} class="sr-only" aria-live={arialive} aria-atomic={ariaatomic}><slot/></span>
@@ -1,19 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.ScreenReaderOnly = exports.PopupMenu = exports.Modal = exports.ConditionalWrapper = exports.FocusLock = exports.CollapsingTable = void 0;
7
- var CollapsingTable_svelte_1 = require("./CollapsingTable.svelte");
8
- Object.defineProperty(exports, "CollapsingTable", { enumerable: true, get: function () { return __importDefault(CollapsingTable_svelte_1).default; } });
9
- var FocusLock_svelte_1 = require("./FocusLock.svelte");
10
- Object.defineProperty(exports, "FocusLock", { enumerable: true, get: function () { return __importDefault(FocusLock_svelte_1).default; } });
11
- var ConditionalWrapper_svelte_1 = require("./ConditionalWrapper.svelte");
12
- Object.defineProperty(exports, "ConditionalWrapper", { enumerable: true, get: function () { return __importDefault(ConditionalWrapper_svelte_1).default; } });
13
- var Modal_svelte_1 = require("./Modal.svelte");
14
- Object.defineProperty(exports, "Modal", { enumerable: true, get: function () { return __importDefault(Modal_svelte_1).default; } });
15
- var PopupMenu_svelte_1 = require("./PopupMenu.svelte");
16
- Object.defineProperty(exports, "PopupMenu", { enumerable: true, get: function () { return __importDefault(PopupMenu_svelte_1).default; } });
17
- var ScreenReaderOnly_svelte_1 = require("./ScreenReaderOnly.svelte");
18
- Object.defineProperty(exports, "ScreenReaderOnly", { enumerable: true, get: function () { return __importDefault(ScreenReaderOnly_svelte_1).default; } });
19
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":";;;;;;AAAA,mEAAqE;AAA5D,0IAAA,OAAO,OAAmB;AACnC,uDAAyD;AAAhD,8HAAA,OAAO,OAAa;AAC7B,yEAA2E;AAAlE,gJAAA,OAAO,OAAsB;AACtC,+CAAiD;AAAxC,sHAAA,OAAO,OAAS;AACzB,uDAAyD;AAAhD,8HAAA,OAAO,OAAa;AAC7B,qEAAuE;AAA9D,4IAAA,OAAO,OAAoB"}
package/dist/index.js DELETED
@@ -1,17 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
5
- }) : (function(o, m, k, k2) {
6
- if (k2 === undefined) k2 = k;
7
- o[k2] = m[k];
8
- }));
9
- var __exportStar = (this && this.__exportStar) || function(m, exports) {
10
- for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
11
- };
12
- Object.defineProperty(exports, "__esModule", { value: true });
13
- __exportStar(require("./components"), exports);
14
- __exportStar(require("./actions"), exports);
15
- __exportStar(require("./lib"), exports);
16
- __exportStar(require("./types"), exports);
17
- //# sourceMappingURL=index.js.map
package/dist/index.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,+CAA4B;AAC5B,4CAAyB;AACzB,wCAAqB;AACrB,0CAAuB"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"bodyoffset.js","sourceRoot":"","sources":["../../src/lib/bodyoffset.ts"],"names":[],"mappings":"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"}
@@ -1,80 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.DeepStore = void 0;
7
- const fast_deep_equal_1 = __importDefault(require("fast-deep-equal"));
8
- function isWritable(value) {
9
- return !!value.subscribe;
10
- }
11
- /**
12
- * An alternative to svelte's "writable" that also checks deep equality (fast-deep-equal) before
13
- * notifying subscribers. A writable will notify subscribers every time it is
14
- * updated, even if nothing has changed.
15
- *
16
- * Note that this strategy is weak against mutable state updates:
17
- * store.update(v => { v.someprop = 'newvalue'; return v })
18
- *
19
- * This line would NOT notify subscribers because the state will be compared against
20
- * itself and always found to be equal. If you are making updates in a mutable fashion,
21
- * use a SafeStore instead.
22
- *
23
- * You can also pass in a writable as your initial state. This will subscribe to the writable
24
- * but add the deep equality checks.
25
- *
26
- * If you pass in a writable while in a component, be sure to call .complete() in your
27
- * onDestroy to free memory.
28
- */
29
- class DeepStore {
30
- constructor(value) {
31
- this.cleanups = [];
32
- this.pause = false;
33
- this.subscribers = new Map();
34
- if (isWritable(value)) {
35
- this.valueStore = value;
36
- this.cleanup(this.valueStore.subscribe(v => this.set(v)));
37
- }
38
- else {
39
- this.value = this.clone(value);
40
- }
41
- }
42
- clone(value) {
43
- return value;
44
- }
45
- set(value) {
46
- if (this.pause)
47
- return;
48
- if (!(0, fast_deep_equal_1.default)(value, this.value)) {
49
- this.value = this.clone(value);
50
- for (const [id, run] of this.subscribers) {
51
- run(value);
52
- }
53
- if (this.valueStore) {
54
- this.pause = true;
55
- this.valueStore.set(value);
56
- this.pause = false;
57
- }
58
- }
59
- }
60
- update(updater) {
61
- this.set(this.clone(updater(this.value)));
62
- }
63
- subscribe(run) {
64
- const id = Math.random().toString(32);
65
- this.subscribers.set(id, run);
66
- run(this.value);
67
- return () => { this.subscribers.delete(id); };
68
- }
69
- cleanup(fn) {
70
- this.cleanups.push(fn);
71
- }
72
- complete() {
73
- for (const fn of this.cleanups)
74
- fn();
75
- this.cleanups = [];
76
- this.subscribers.clear();
77
- }
78
- }
79
- exports.DeepStore = DeepStore;
80
- //# sourceMappingURL=deepstore.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"deepstore.js","sourceRoot":"","sources":["../../src/lib/deepstore.ts"],"names":[],"mappings":";;;;;;AACA,sEAAuC;AAcvC,SAAS,UAAU,CAAM,KAAoB;IAC3C,OAAO,CAAC,CAAE,KAAqB,CAAC,SAAS,CAAA;AAC3C,CAAC;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAa,SAAS;IAOpB,YAAa,KAAoB;QAJvB,aAAQ,GAAmB,EAAE,CAAA;QAE/B,UAAK,GAAG,KAAK,CAAA;QAGnB,IAAI,CAAC,WAAW,GAAG,IAAI,GAAG,EAAE,CAAA;QAC5B,IAAI,UAAU,CAAC,KAAK,CAAC,EAAE;YACrB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAA;YACvB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;SAC1D;aAAM;YACL,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;SAC/B;IACH,CAAC;IAED,KAAK,CAAE,KAAQ;QACb,OAAO,KAAK,CAAA;IACd,CAAC;IAED,GAAG,CAAE,KAAQ;QACX,IAAI,IAAI,CAAC,KAAK;YAAE,OAAM;QACtB,IAAI,CAAC,IAAA,yBAAS,EAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE;YACjC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;YAC9B,KAAK,MAAM,CAAC,EAAE,EAAE,GAAG,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE;gBACxC,GAAG,CAAC,KAAK,CAAC,CAAA;aACX;YACD,IAAI,IAAI,CAAC,UAAU,EAAE;gBACnB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAA;gBACjB,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,KAAK,CAAC,CAAA;gBAC1B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;aACnB;SACF;IACH,CAAC;IAED,MAAM,CAAE,OAAwB;QAC9B,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;IAC3C,CAAC;IAED,SAAS,CAAE,GAAkB;QAC3B,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAA;QACrC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,EAAE,EAAE,GAAG,CAAC,CAAA;QAC7B,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACf,OAAO,GAAG,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA,CAAC,CAAC,CAAA;IAC9C,CAAC;IAES,OAAO,CAAE,EAAc;QAC/B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;IACxB,CAAC;IAED,QAAQ;QACN,KAAK,MAAM,EAAE,IAAI,IAAI,CAAC,QAAQ;YAAE,EAAE,EAAE,CAAA;QACpC,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAA;QAClB,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,CAAA;IAC1B,CAAC;CACF;AAxDD,8BAwDC"}
@@ -1,53 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.DerivedStore = void 0;
4
- const deepstore_1 = require("./deepstore");
5
- const txstate_utils_1 = require("txstate-utils");
6
- const store_1 = require("svelte/store");
7
- /**
8
- * Watch one or more parent stores for changes. Each time, run a function to derive
9
- * a new state from the parent state(s). Subscribers will only be notified if the
10
- * derived state has changed (uses fast-deep-equal).
11
- *
12
- * If only one parent store, it's possible to use a dot-prop string as the getter.
13
- *
14
- * If you create one of these in a component, be sure to call .complete() in onDestroy
15
- * to free up memory.
16
- */
17
- class DerivedStore extends deepstore_1.DeepStore {
18
- constructor(store, getter) {
19
- if (typeof getter === 'string') {
20
- const accessor = getter;
21
- getter = (parentValue) => (0, txstate_utils_1.get)(parentValue, accessor);
22
- }
23
- super({});
24
- if (Array.isArray(store)) {
25
- const values = store.map(store_1.get);
26
- for (let i = 0; i < store.length; i++) {
27
- let unsubscribe;
28
- if (store instanceof deepstore_1.DeepStore) {
29
- unsubscribe = store[i].subscribe(v => {
30
- values[i] = store.clone(v);
31
- super.set(getter(values));
32
- });
33
- }
34
- else {
35
- unsubscribe = store[i].subscribe(v => {
36
- values[i] = v;
37
- super.set(getter(values));
38
- });
39
- }
40
- this.cleanup(unsubscribe);
41
- }
42
- super.set(getter(values));
43
- }
44
- else {
45
- const unsubscribe = store.subscribe(v => {
46
- super.set(getter(v));
47
- });
48
- this.cleanup(unsubscribe);
49
- }
50
- }
51
- }
52
- exports.DerivedStore = DerivedStore;
53
- //# sourceMappingURL=derivedstore.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"derivedstore.js","sourceRoot":"","sources":["../../src/lib/derivedstore.ts"],"names":[],"mappings":";;;AAAA,2CAAsD;AACtD,iDAAmC;AACnC,wCAA4C;AAE5C;;;;;;;;;GASG;AACH,MAAa,YAA4C,SAAQ,qBAAsB;IAIrF,YAAa,KAA8C,EAAE,MAA6E;QACxI,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE;YAC9B,MAAM,QAAQ,GAAG,MAAM,CAAA;YACvB,MAAM,GAAG,CAAC,WAAgB,EAAE,EAAE,CAAC,IAAA,mBAAG,EAAC,WAAW,EAAE,QAAQ,CAAC,CAAA;SAC1D;QACD,KAAK,CAAC,EAAS,CAAC,CAAA;QAChB,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACxB,MAAM,MAAM,GAAG,KAAK,CAAC,GAAG,CAAC,WAAM,CAAC,CAAA;YAChC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBACrC,IAAI,WAAW,CAAA;gBACf,IAAI,KAAK,YAAY,qBAAS,EAAE;oBAC9B,WAAW,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;wBACnC,MAAM,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;wBAC1B,KAAK,CAAC,GAAG,CAAE,MAAyC,CAAC,MAAM,CAAC,CAAC,CAAA;oBAC/D,CAAC,CAAC,CAAA;iBACH;qBAAM;oBACL,WAAW,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;wBACnC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAA;wBACb,KAAK,CAAC,GAAG,CAAE,MAAyC,CAAC,MAAM,CAAC,CAAC,CAAA;oBAC/D,CAAC,CAAC,CAAA;iBACH;gBACD,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAA;aAC1B;YACD,KAAK,CAAC,GAAG,CAAE,MAAyC,CAAC,MAAM,CAAC,CAAC,CAAA;SAC9D;aAAM;YACL,MAAM,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;gBACtC,KAAK,CAAC,GAAG,CAAE,MAAsC,CAAC,CAAC,CAAC,CAAC,CAAA;YACvD,CAAC,CAAC,CAAA;YACF,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAA;SAC1B;IACH,CAAC;CACF;AAnCD,oCAmCC"}
package/dist/lib/index.js DELETED
@@ -1,20 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
5
- }) : (function(o, m, k, k2) {
6
- if (k2 === undefined) k2 = k;
7
- o[k2] = m[k];
8
- }));
9
- var __exportStar = (this && this.__exportStar) || function(m, exports) {
10
- for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
11
- };
12
- Object.defineProperty(exports, "__esModule", { value: true });
13
- __exportStar(require("./bodyoffset"), exports);
14
- __exportStar(require("./deepstore"), exports);
15
- __exportStar(require("./derivedstore"), exports);
16
- __exportStar(require("./repositioned"), exports);
17
- __exportStar(require("./safestore"), exports);
18
- __exportStar(require("./substore"), exports);
19
- __exportStar(require("./util"), exports);
20
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/lib/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,+CAA4B;AAC5B,8CAA2B;AAC3B,iDAA8B;AAC9B,iDAA8B;AAC9B,8CAA2B;AAC3B,6CAA0B;AAC1B,yCAAsB"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"repositioned.js","sourceRoot":"","sources":["../../src/lib/repositioned.ts"],"names":[],"mappings":"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"}
@@ -1,16 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.SafeStore = void 0;
7
- const deepstore_1 = require("./deepstore");
8
- const rfdc_1 = __importDefault(require("rfdc"));
9
- const cloneDeep = (0, rfdc_1.default)();
10
- class SafeStore extends deepstore_1.DeepStore {
11
- clone(value) {
12
- return cloneDeep(value);
13
- }
14
- }
15
- exports.SafeStore = SafeStore;
16
- //# sourceMappingURL=safestore.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"safestore.js","sourceRoot":"","sources":["../../src/lib/safestore.ts"],"names":[],"mappings":";;;;;;AAAA,2CAAuC;AACvC,gDAAuB;AACvB,MAAM,SAAS,GAAG,IAAA,cAAI,GAAE,CAAA;AAExB,MAAa,SAAa,SAAQ,qBAAY;IAC5C,KAAK,CAAE,KAAQ;QACb,OAAO,SAAS,CAAC,KAAK,CAAC,CAAA;IACzB,CAAC;CACF;AAJD,8BAIC"}
@@ -1,46 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.SubStore = void 0;
4
- const txstate_utils_1 = require("txstate-utils");
5
- const deepstore_1 = require("./deepstore");
6
- /**
7
- * Create a store that represents a part of a larger store. Updates to the parent store will propagate
8
- * down to the SubStore as appropriate, and updates to the SubStore will propagate
9
- * back up to the parent store. This requires both a getter and setter function to handle each
10
- * direction. The setter is given the new SubStore state and the existing parent store state and
11
- * should return a new state for the parent store.
12
- *
13
- * Alternatively, a dot-prop string can be provided and both the getter and setter will be automatically
14
- * generated. For example, a parent store containing state { deep: { value: 'here' }, hello: 'world' }
15
- * could be used with the getter string "deep.value". The SubStore's initial state would be "here", and
16
- * updating it to "there" would update the parent store state to { deep: { value: 'there' }, hello: 'world' }
17
- *
18
- * If you create one of these in a component, be sure to call .complete() in onDestroy to free up memory.
19
- */
20
- class SubStore extends deepstore_1.DeepStore {
21
- constructor(store, getter, setter) {
22
- if (typeof getter === 'string') {
23
- const accessor = getter;
24
- getter = parentValue => (0, txstate_utils_1.get)(parentValue, accessor);
25
- setter = (newValue, parentValue) => (0, txstate_utils_1.set)(parentValue, accessor, newValue);
26
- }
27
- super({});
28
- this.parentStore = store;
29
- this.setter = setter;
30
- const unsubscribe = store.subscribe(v => {
31
- super.set(getter(v));
32
- });
33
- this.cleanup(unsubscribe);
34
- }
35
- set(value) {
36
- this.parentStore.update(parentValue => this.setter(value, parentValue));
37
- }
38
- clone(state) {
39
- var _a, _b, _c;
40
- // parent store could be a SafeStore - if so we should use its clone function
41
- // so that the substore is also safe against mutations
42
- return (_c = (_b = (_a = this.parentStore) === null || _a === void 0 ? void 0 : _a.clone) === null || _b === void 0 ? void 0 : _b.call(_a, state)) !== null && _c !== void 0 ? _c : state;
43
- }
44
- }
45
- exports.SubStore = SubStore;
46
- //# sourceMappingURL=substore.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"substore.js","sourceRoot":"","sources":["../../src/lib/substore.ts"],"names":[],"mappings":";;;AAAA,iDAAwC;AACxC,2CAAwD;AAExD;;;;;;;;;;;;;GAaG;AACH,MAAa,QAAoC,SAAQ,qBAAkB;IAMzE,YAAa,KAAkC,EAAE,MAA+C,EAAE,MAA0D;QAC1J,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE;YAC9B,MAAM,QAAQ,GAAG,MAAM,CAAA;YACvB,MAAM,GAAG,WAAW,CAAC,EAAE,CAAC,IAAA,mBAAG,EAAC,WAAW,EAAE,QAAQ,CAAC,CAAA;YAClD,MAAM,GAAG,CAAC,QAAQ,EAAE,WAAW,EAAE,EAAE,CAAC,IAAA,mBAAG,EAAC,WAAW,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAA;SACzE;QACD,KAAK,CAAC,EAAS,CAAC,CAAA;QAChB,IAAI,CAAC,WAAW,GAAG,KAAK,CAAA;QACxB,IAAI,CAAC,MAAM,GAAG,MAAO,CAAA;QACrB,MAAM,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;YACtC,KAAK,CAAC,GAAG,CAAE,MAAc,CAAC,CAAC,CAAC,CAAC,CAAA;QAC/B,CAAC,CAAC,CAAA;QACF,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CAAA;IAC3B,CAAC;IAED,GAAG,CAAE,KAAc;QACjB,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC,CAAA;IACzE,CAAC;IAED,KAAK,CAAE,KAAc;;QACnB,6EAA6E;QAC7E,sDAAsD;QACtD,OAAO,MAAA,MAAA,MAAC,IAAI,CAAC,WAA8B,0CAAE,KAAK,mDAAG,KAAK,CAAC,mCAAI,KAAK,CAAA;IACtE,CAAC;CACF;AA9BD,4BA8BC"}
package/dist/lib/util.js DELETED
@@ -1,16 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.debounced = exports.classes = void 0;
4
- function classes(...classNames) {
5
- return classNames.filter(Boolean).join(' ');
6
- }
7
- exports.classes = classes;
8
- function debounced(fn, timeout) {
9
- let timer;
10
- return (...args) => {
11
- clearTimeout(timer);
12
- timer = setTimeout(() => fn(...args), timeout);
13
- };
14
- }
15
- exports.debounced = debounced;
16
- //# sourceMappingURL=util.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"util.js","sourceRoot":"","sources":["../../src/lib/util.ts"],"names":[],"mappings":";;;AAAA,SAAgB,OAAO,CAAE,GAAG,UAAkC;IAC5D,OAAO,UAAU,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;AAC7C,CAAC;AAFD,0BAEC;AAED,SAAgB,SAAS,CAAE,EAAY,EAAE,OAAe;IACtD,IAAI,KAAqB,CAAA;IACzB,OAAO,CAAC,GAAG,IAAW,EAAE,EAAE;QACxB,YAAY,CAAC,KAAK,CAAC,CAAA;QACnB,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,EAAE,OAAO,CAAC,CAAA;IAChD,CAAC,CAAA;AACH,CAAC;AAND,8BAMC"}
@@ -1,7 +0,0 @@
1
- export * from './a11y';
2
- export * from './glue';
3
- export * from './offset';
4
- export * from './portal';
5
- export * from './resize';
6
- export * from './sticky';
7
- export * from './stickyfixed';
@@ -1,15 +0,0 @@
1
- import { WritableSubject, ElementOffsets } from '../lib';
2
- interface OffsetConfig<T extends ElementOffsets = ElementOffsets> {
3
- debounce?: boolean | number;
4
- store?: WritableSubject<T>;
5
- }
6
- export declare function offset(el: HTMLElement, config?: OffsetConfig): {
7
- update(newConfig?: OffsetConfig<Partial<{
8
- right: number;
9
- bottom: number;
10
- top: number;
11
- left: number;
12
- }>> | undefined): void;
13
- destroy: () => void;
14
- };
15
- export {};
@@ -1,147 +0,0 @@
1
- <script lang="ts">
2
- import { DeepStore, classes } from '../lib'
3
- import type { CollapsingTableColumn, PopupMenuItem } from '../types'
4
- import { derived } from 'svelte/store'
5
- import DefaultPopupMenu from './PopupMenu.svelte'
6
- import ScreenReaderOnly from './ScreenReaderOnly.svelte'
7
-
8
- export let tableClass = ''
9
- export let bodyRowClass = ''
10
- export let bodyCellClass = ''
11
- export let headerRowClass = ''
12
- export let headerCellClass = ''
13
- export let menuContainerClass = ''
14
- export let menuClass = ''
15
- export let menuItemClass = ''
16
- export let menuItemHilitedClass = ''
17
- export let items: any[]
18
- export let config: CollapsingTableColumn[]|undefined = undefined
19
- export let defaultCellWidth = 150
20
- export let PopupMenu = DefaultPopupMenu
21
- export let slots: Record<string, boolean> = $$slots
22
- export let stickyheader: boolean = false
23
- let columns: CollapsingTableColumn[]
24
- let width: number = 320
25
- let selected: PopupMenuItem | undefined
26
- let identifyingkeys: string[] = []
27
- $: firstrow = items?.[0] ?? {}
28
- $: columns = config ?? Object.keys(firstrow).map(key => ({ key }))
29
- function reactToColumns (columns: CollapsingTableColumn[]) {
30
- if (!columns.some(c => c.neverhide)) {
31
- columns[0].neverhide = true
32
- }
33
- const sortedcolumns = columns // stable sort
34
- .map((c, i) => ({ col: c, idx: i}))
35
- .sort((a, b) => ((a.col.neverhide ? 0 : 1) - (b.col.neverhide ? 0 : 1)) || a.idx - b.idx)
36
- .map(o => o.col)
37
- if (!selected) {
38
- const firstcol = sortedcolumns.find(c => !c.neverhide)
39
- selected = firstcol ? { value: firstcol.key } : undefined
40
- }
41
- identifyingkeys = sortedcolumns.filter(c => c.neverhide).map(c => c.key)
42
- return sortedcolumns
43
- }
44
- $: sortedcolumns = reactToColumns(columns)
45
-
46
- $: itemkeys = items.map(item => item.id ?? item._id ?? identifyingkeys.map(k => item[k]).join('.'))
47
-
48
- const state = new DeepStore({
49
- keepcolumns: [] as (CollapsingTableColumn & { widthPercent?: number })[],
50
- hiddencolumns: [] as CollapsingTableColumn[],
51
- dropdowncolumn: undefined as (CollapsingTableColumn & { widthPercent?: number }) | undefined
52
- })
53
- const menuitems = derived(state, obj => obj.hiddencolumns.map(c => ({ value: c.key, label: c.title })))
54
- function react (..._: any[]) {
55
- const selectedcol = sortedcolumns.find(c => c.key === selected?.value) ?? columns[1]
56
- const keepcolumns: CollapsingTableColumn[] = []
57
- const hiddencolumns: CollapsingTableColumn[] = []
58
- let used = sortedcolumns.filter(c => c.neverhide || c === selectedcol).reduce((sum, col) => sum + (col.width ?? defaultCellWidth), 0)
59
- for (const col of sortedcolumns) {
60
- if (col.neverhide || col === selectedcol || used + (col.width ?? defaultCellWidth) < width) {
61
- keepcolumns.push(col)
62
- if (col !== selectedcol && !col.neverhide) used += col.width ?? defaultCellWidth
63
- } else hiddencolumns.push(col)
64
- }
65
- for (const col of keepcolumns) {
66
- (col as any).widthPercent = 100 * (col.width ?? defaultCellWidth) / used
67
- }
68
- const dropdowncolumn = hiddencolumns.length ? keepcolumns[keepcolumns.length - 1] : undefined
69
- state.set({ keepcolumns, hiddencolumns, dropdowncolumn })
70
- }
71
- $: react(width, selected)
72
- let headers: HTMLElement[] = []
73
- $: menubuttonelement = headers[$state.keepcolumns.length - 1]
74
- </script>
75
-
76
- <div bind:clientWidth={width}>
77
- <table class={tableClass}>
78
- <thead class:stickyheader><tr class={headerRowClass}>
79
- {#each $state.keepcolumns as column, i (column.key)}
80
- <th
81
- class={classes(column.headerCellClass, headerCellClass)}
82
- class:defaultIcon={!slots.dropicon && $state.dropdowncolumn === column}
83
- bind:this={headers[i]}
84
- role={$state.dropdowncolumn === column ? 'button' : undefined }
85
- tabindex={$state.dropdowncolumn === column ? 0 : undefined }
86
- >
87
- <slot name="headercell" {column} key={column.key} title={column.title || column.key} item={undefined} value={undefined}>
88
- {column.title || column.key}
89
- </slot>
90
- {#if $state.dropdowncolumn === column}
91
- <ScreenReaderOnly>, click to choose another column to show</ScreenReaderOnly>
92
- <slot name="dropicon" {column} item={undefined} value={undefined}>
93
- <i aria-hidden="true"></i>
94
- </slot>
95
- {/if}
96
- </th>
97
- {/each}
98
- </tr></thead>
99
- <tbody>
100
- {#each items as item, i (itemkeys[i])}
101
- <tr class={bodyRowClass}>
102
- {#each $state.keepcolumns as column (column.key)}
103
- <td class={classes(column.bodyCellClass, bodyCellClass)}>
104
- <slot key={column.key} value={item[column.key]} {item}>
105
- {item[column.key]}
106
- </slot>
107
- </td>
108
- {/each}
109
- </tr>
110
- {/each}
111
- </tbody>
112
- {#if slots.footer}<tfoot><slot name="footer" item={undefined} key={undefined} value={undefined}></slot></tfoot>{/if}
113
- </table>
114
- </div>
115
- {#if $menuitems.length > 0}
116
- <svelte:component this={PopupMenu} {menuContainerClass} {menuClass} {menuItemClass} {menuItemHilitedClass} items={$menuitems} buttonelement={menubuttonelement} bind:selected></svelte:component>
117
- {/if}
118
-
119
- <style>
120
- table { width: 100%; }
121
- th {
122
- position: relative;
123
- box-sizing: border-box;
124
- }
125
- th[role="button"] {
126
- cursor: pointer !important;
127
- }
128
- th.defaultIcon :global([role="button"]) {
129
- padding-right: 1.3em;
130
- }
131
- th.defaultIcon :global(i) {
132
- transform: translateY(-50%) rotate(45deg);
133
- border: solid black;
134
- border-width: 0 .2em .2em 0;
135
- padding: .15em;
136
- }
137
- th :global(i) {
138
- position: absolute;
139
- right: 0.4em;
140
- top: calc(50% - 0.08em);
141
- }
142
- .stickyheader th {
143
- position: sticky;
144
- top: 0;
145
- z-index: 1;
146
- }
147
- </style>
@@ -1,100 +0,0 @@
1
- <script context="module" lang="ts">
2
- const FocusLockStack: { pause: () => void, unpause: () => void }[] = []
3
- </script>
4
-
5
- <script lang="ts">
6
- export let returnfocusto: HTMLElement|null|undefined = undefined
7
- export let initialfocus: string|undefined = undefined
8
- export let hidefocus = true
9
- export let hidefocuslabel = "focus is above modal dialog, start tabbing"
10
- export let escapable = true
11
- let className = ''
12
- export { className as class }
13
-
14
- import { onMount, onDestroy, createEventDispatcher, tick } from 'svelte'
15
- import { tabbable } from 'tabbable'
16
- import { sleep } from 'txstate-utils'
17
- import { buttonify } from '../actions'
18
- import ScreenReaderOnly from './ScreenReaderOnly.svelte'
19
- const dispatch = createEventDispatcher()
20
- let lockelement: HTMLElement
21
- let abovelockelement: HTMLElement
22
- let active = true
23
- if (initialfocus) hidefocus = false
24
- onMount(async () => {
25
- const prevFocusLock = FocusLockStack.slice(-1)[0]
26
- if (prevFocusLock) prevFocusLock.pause()
27
- FocusLockStack.push({
28
- pause: () => { active = false },
29
- unpause: () => { active = true }
30
- })
31
- if (typeof returnfocusto === 'undefined') {
32
- returnfocusto = document.querySelector(':focus') as HTMLElement
33
- }
34
- await sleep(1)
35
- if (initialfocus) {
36
- const focusEl = lockelement.querySelector(initialfocus)
37
- if (focusEl instanceof HTMLElement) focusEl.focus()
38
- } else {
39
- setInitialFocus()
40
- }
41
- })
42
- onDestroy(async () => {
43
- const wasactive = active
44
- let focuswasinside
45
- try {
46
- focuswasinside = lockelement.matches(':focus-within')
47
- } catch (e: any) {
48
- // browser doesn't support :focus-within
49
- focuswasinside = true
50
- }
51
- active = false
52
- await tick()
53
- if (returnfocusto && wasactive && focuswasinside) {
54
- returnfocusto.focus()
55
- }
56
- FocusLockStack.pop()
57
- const prevFocusLock = FocusLockStack.slice(-1)[0]
58
- if (prevFocusLock) prevFocusLock.unpause()
59
- })
60
- const setInitialFocus = () => {
61
- const firstfocus = tabbable(lockelement)[0]
62
- if (firstfocus && firstfocus.focus) {
63
- firstfocus.focus()
64
- }
65
- }
66
- const setLastFocus = () => {
67
- const lastfocus = tabbable(lockelement).slice(-1)[0]
68
- if (lastfocus && lastfocus.focus) {
69
- lastfocus.focus()
70
- }
71
- }
72
- const keydown = (e: KeyboardEvent) => {
73
- if (active && e.key === "Escape" && escapable) {
74
- e.preventDefault()
75
- dispatch('escape')
76
- }
77
- }
78
- const focusin = (e: FocusEvent) => {
79
- if (active && e.target instanceof HTMLElement && !lockelement?.contains(e.target)) {
80
- if (e.target === abovelockelement) setLastFocus()
81
- else setInitialFocus()
82
- }
83
- }
84
- </script>
85
-
86
- <div class={className} role="alertdialog" aria-modal="true" on:click|stopPropagation on:keydown|stopPropagation={keydown} on:focusin={focusin}>
87
- <div bind:this={abovelockelement} tabindex="0"></div>
88
- <div bind:this={lockelement} on:keydown={keydown}>
89
- {#if hidefocus}<div class="hiddenfocus" use:buttonify on:blur={() =>{ hidefocus = false }} on:click={() => escapable && dispatch('escape')}><ScreenReaderOnly>{hidefocuslabel}{#if escapable}, click to escape or use escape key at any time{/if}</ScreenReaderOnly></div>{/if}
90
- <slot></slot>
91
- </div>
92
- <div tabindex="0"></div>
93
- </div>
94
-
95
- <style>
96
- .hiddenfocus {
97
- opacity: 0;
98
- outline: 0;
99
- }
100
- </style>