@nascentdigital/funnel-editor 4.5.6 → 4.6.0
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/dist/collection/hooks/CollectionController.d.ts +1 -1
- package/dist/core/components/ColorModeToggle.js +6 -4
- package/dist/core/components/Header.js +3 -2
- package/dist/core/components/UserEditor.d.ts +2 -2
- package/dist/core/components/feedback/Badge.d.ts +2 -1
- package/dist/core/components/feedback/Badge.js +4 -3
- package/dist/core/components/fields/DynamicPagesEditor.js +7 -6
- package/dist/core/components/fields/EmptyFieldCard.js +4 -4
- package/dist/core/components/fields/FieldCardLayout.js +5 -5
- package/dist/core/components/fields/FieldHeader.js +3 -2
- package/dist/core/components/fields/FieldsPanel.js +4 -4
- package/dist/core/components/fields/FormEditor.js +5 -4
- package/dist/core/components/fields/asset/AssetEditor.d.ts +3 -2
- package/dist/core/components/fields/asset/AssetEditor.js +1 -1
- package/dist/core/components/fields/asset/AssetUploader.d.ts +3 -2
- package/dist/core/components/fields/asset/AssetUploader.js +1 -1
- package/dist/core/components/fields/collection/CollectionCard.js +1 -11
- package/dist/core/components/fields/collection/CollectionPicker.js +3 -2
- package/dist/core/components/fields/collection/previews/index.d.ts +0 -1
- package/dist/core/components/fields/collection/previews/index.js +0 -1
- package/dist/core/components/fields/embed/EmbeddedVideoEditor.d.ts +2 -2
- package/dist/core/components/fields/factories/AssetFactory.d.ts +1 -1
- package/dist/core/components/fields/factories/CollectionFactory.d.ts +1 -1
- package/dist/core/components/fields/factories/EmbeddedVideoFactory.d.ts +2 -2
- package/dist/core/components/fields/factories/FieldValueFactory.d.ts +1 -1
- package/dist/core/components/fields/factories/FieldValueFactory.js +1 -1
- package/dist/core/components/fields/factories/LinkFactory.d.ts +2 -2
- package/dist/core/components/fields/factories/TextFactory.d.ts +2 -2
- package/dist/core/components/fields/form/FormFieldEditor.d.ts +3 -2
- package/dist/core/components/fields/index.d.ts +1 -0
- package/dist/core/components/fields/index.js +1 -0
- package/dist/core/components/fields/link/LinkEditor.d.ts +2 -2
- package/dist/core/components/fields/link/LinkEditor.js +4 -0
- package/dist/core/components/fields/list/CreateFieldButton.d.ts +1 -1
- package/dist/core/components/fields/list/CreateFieldButton.js +4 -5
- package/dist/core/components/fields/list/CreateFieldCard.js +4 -4
- package/dist/core/components/fields/page/PagePicker.js +4 -2
- package/dist/core/components/fields/richtext/FloatingToolbarPlugin.js +3 -2
- package/dist/core/components/fields/richtext/LinkEditor.js +17 -4
- package/dist/core/components/fields/richtext/LinkPopup.js +11 -7
- package/dist/core/components/interaction/AvatarButton.d.ts +2 -1
- package/dist/core/components/interaction/AvatarButton.js +3 -2
- package/dist/core/components/interaction/Button.d.ts +2 -0
- package/dist/core/components/interaction/Button.js +3 -2
- package/dist/core/components/interaction/Combobox.js +2 -2
- package/dist/core/components/interaction/IconButton.d.ts +2 -0
- package/dist/core/components/interaction/IconButton.js +3 -2
- package/dist/core/components/interaction/IconLink.d.ts +1 -1
- package/dist/core/components/interaction/MiniEditor.d.ts +3 -2
- package/dist/core/components/interaction/MiniEditor.js +7 -5
- package/dist/core/components/interaction/Popup.d.ts +20 -15
- package/dist/core/components/interaction/Popup.js +63 -66
- package/dist/core/components/interaction/QuickInput.js +2 -0
- package/dist/core/components/interaction/QuickPicker.d.ts +1 -0
- package/dist/core/components/interaction/QuickPicker.js +5 -5
- package/dist/core/components/interaction/Tabs.d.ts +5 -1
- package/dist/core/components/interaction/Tabs.js +18 -8
- package/dist/core/components/interaction/menu/useMenuController.d.ts +2 -2
- package/dist/core/components/interaction/table/TableItem.d.ts +2 -1
- package/dist/core/components/interaction/table/TableItem.js +5 -3
- package/dist/core/components/layout/InfoPanel.js +4 -2
- package/dist/core/components/visuals/Icon.d.ts +1 -1
- package/dist/core/components/visuals/Icon.js +6 -0
- package/dist/core/components/visuals/index.d.ts +0 -1
- package/dist/core/components/visuals/index.js +0 -1
- package/dist/core/domain/Block.d.ts +4 -0
- package/dist/core/domain/Block.js +7 -0
- package/dist/core/domain/BlockConfiguration.d.ts +11 -3
- package/dist/core/domain/BlockConfiguration.js +77 -14
- package/dist/core/domain/CollectionBrowser.d.ts +2 -2
- package/dist/core/domain/CollectionFieldProxy.d.ts +7 -2
- package/dist/core/domain/CollectionFieldProxy.js +55 -66
- package/dist/core/domain/SectionBlock.d.ts +5 -0
- package/dist/core/domain/SectionBlock.js +15 -0
- package/dist/core/hooks/useBlockConfiguration.d.ts +7 -1
- package/dist/core/hooks/useBlockConfiguration.js +8 -1
- package/dist/core/hooks/usePage.d.ts +2 -2
- package/dist/core/hooks/usePage.js +5 -4
- package/dist/core/repository/CollectionRepository.js +1 -1
- package/dist/core/repository/CollectionSerializer.d.ts +3 -2
- package/dist/core/repository/CollectionSerializer.js +12 -7
- package/dist/core/repository/PageRepository.js +2 -2
- package/dist/core/repository/PageSerializer.d.ts +5 -3
- package/dist/core/repository/PageSerializer.js +10 -11
- package/dist/explore/components/CreateCollectionDialog.d.ts +2 -3
- package/dist/explore/components/CreateCollectionDialog.js +1 -1
- package/dist/explore/components/CreatePageDialog.d.ts +3 -3
- package/dist/explore/components/CreatePageDialog.js +2 -2
- package/dist/explore/screens/CollectionExplorer.js +4 -4
- package/dist/explore/screens/PageExplorer.js +4 -4
- package/dist/page/components/BlockEditor.js +10 -2
- package/dist/page/components/config/BlockConfigButton.d.ts +8 -0
- package/dist/page/components/config/BlockConfigButton.js +320 -0
- package/dist/page/components/config/BlockConfigurationProvider.d.ts +8 -0
- package/dist/page/components/config/BlockConfigurationProvider.js +17 -0
- package/dist/page/components/config/LegacyBlockPreview.d.ts +8 -0
- package/dist/page/components/config/{BlockPreview.js → LegacyBlockPreview.js} +30 -40
- package/dist/page/components/config/index.d.ts +3 -1
- package/dist/page/components/config/index.js +3 -1
- package/dist/page/components/index.d.ts +1 -1
- package/dist/page/components/index.js +1 -1
- package/dist/page/components/nav/NavSection.js +4 -3
- package/dist/page/components/panels/BlockConfigPanel.d.ts +1 -0
- package/dist/page/components/panels/BlockConfigPanel.js +25 -0
- package/dist/page/components/{PageStatus.d.ts → panels/PageStatus.d.ts} +3 -3
- package/dist/page/components/{PageStatus.js → panels/PageStatus.js} +10 -14
- package/dist/page/components/panels/index.d.ts +2 -0
- package/dist/page/components/{status → panels}/index.js +2 -1
- package/dist/page/hooks/PageController.d.ts +2 -2
- package/dist/page/screens/PageEditor.js +8 -1
- package/dist/styles/index.css +174 -56
- package/dist/styles/tailwind.js +7 -3
- package/dist/users/screens/UserExplorer.js +7 -6
- package/package.json +3 -2
- package/dist/core/components/fields/collection/previews/ClientPreview.d.ts +0 -10
- package/dist/core/components/fields/collection/previews/ClientPreview.js +0 -29
- package/dist/core/components/visuals/SkeletonLayout.d.ts +0 -9
- package/dist/core/components/visuals/SkeletonLayout.js +0 -429
- package/dist/page/components/config/BlockConfig.d.ts +0 -8
- package/dist/page/components/config/BlockConfig.js +0 -28
- package/dist/page/components/config/BlockConfigEditor.d.ts +0 -9
- package/dist/page/components/config/BlockConfigEditor.js +0 -114
- package/dist/page/components/config/BlockPreview.d.ts +0 -10
- package/dist/page/components/config/BlockView.d.ts +0 -4
- package/dist/page/components/config/BlockView.js +0 -9
- package/dist/page/components/config/LegacyBlockConfigEditor.d.ts +0 -9
- package/dist/page/components/config/LegacyBlockConfigEditor.js +0 -27
- package/dist/page/components/config/ListPanelEditor.d.ts +0 -8
- package/dist/page/components/config/ListPanelEditor.js +0 -89
- package/dist/page/components/config/MessagePanelEditor.d.ts +0 -8
- package/dist/page/components/config/MessagePanelEditor.js +0 -17
- package/dist/page/components/config/VisualPanelEditor.d.ts +0 -8
- package/dist/page/components/config/VisualPanelEditor.js +0 -76
- package/dist/page/components/status/index.d.ts +0 -1
- /package/dist/page/components/{status → panels}/AutoSave.d.ts +0 -0
- /package/dist/page/components/{status → panels}/AutoSave.js +0 -0
package/dist/styles/index.css
CHANGED
|
@@ -499,6 +499,13 @@ video {
|
|
|
499
499
|
[hidden]:where(:not([hidden="until-found"])) {
|
|
500
500
|
display: none;
|
|
501
501
|
}
|
|
502
|
+
|
|
503
|
+
[popover]{
|
|
504
|
+
inset: var(--toolwind-toggle-nEDo9QfADx, 0px);
|
|
505
|
+
background-color: var(--toolwind-toggle-d4U08Ws6b8, canvas);
|
|
506
|
+
color: var(--toolwind-toggle-00SqTQfWhn, canvastext);
|
|
507
|
+
margin: var(--toolwind-toggle-sxV90D1uFT, auto);
|
|
508
|
+
}
|
|
502
509
|
html, body, #__next, .Editor-wrap{
|
|
503
510
|
position: relative;
|
|
504
511
|
height: 100lvh;
|
|
@@ -2730,6 +2737,18 @@ video {
|
|
|
2730
2737
|
--tw-border-opacity: 1;
|
|
2731
2738
|
border-color: rgb(var(--color-ix-primary) / var(--tw-border-opacity, 1));
|
|
2732
2739
|
}
|
|
2740
|
+
.FieldCard-hover.FieldCard{
|
|
2741
|
+
--tw-border-opacity: 1;
|
|
2742
|
+
border-color: rgb(var(--color-ix-primary) / var(--tw-border-opacity, 1));
|
|
2743
|
+
}
|
|
2744
|
+
.FieldCard-press.FieldCard{
|
|
2745
|
+
--tw-scale-x: .97;
|
|
2746
|
+
--tw-scale-y: .97;
|
|
2747
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
2748
|
+
transition-timing-function: cubic-bezier(0.5, 1, 0.89, 1);
|
|
2749
|
+
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
|
|
2750
|
+
transition-duration: 200ms;
|
|
2751
|
+
}
|
|
2733
2752
|
.iconbutton{
|
|
2734
2753
|
flex-shrink: 0;
|
|
2735
2754
|
cursor: pointer;
|
|
@@ -4229,30 +4248,26 @@ video {
|
|
|
4229
4248
|
:root {
|
|
4230
4249
|
--nd-visual-width: unset;
|
|
4231
4250
|
--nd-visual-height: unset;
|
|
4251
|
+
--nd-visual-max-width: unset;
|
|
4252
|
+
--nd-visual-max-height: unset;
|
|
4232
4253
|
--nd-visual-anchor: center;
|
|
4233
|
-
|
|
4234
|
-
|
|
4235
|
-
|
|
4236
|
-
|
|
4237
|
-
|
|
4238
|
-
|
|
4239
|
-
|
|
4240
|
-
|
|
4241
|
-
|
|
4242
|
-
|
|
4243
|
-
|
|
4244
|
-
|
|
4245
|
-
|
|
4246
|
-
|
|
4247
|
-
|
|
4248
|
-
|
|
4249
|
-
|
|
4250
|
-
-o-object-position: var(--nd-visual-anchor);
|
|
4251
|
-
object-position: var(--nd-visual-anchor);
|
|
4252
|
-
}
|
|
4253
|
-
.nd-Visual-video video{
|
|
4254
|
-
-o-object-fit: cover;
|
|
4255
|
-
object-fit: cover;
|
|
4254
|
+
--nd-visual-aspect: unset;
|
|
4255
|
+
--nd-visual-object-fit: unset;
|
|
4256
|
+
}
|
|
4257
|
+
.nd-Visual-image,
|
|
4258
|
+
.nd-Visual-video
|
|
4259
|
+
{
|
|
4260
|
+
aspect-ratio: var(--nd-visual-aspect, var(--_nd-visual-native-width) / var(--_nd-visual-native-height));
|
|
4261
|
+
max-width: var(--nd-visual-max-width, 100%);
|
|
4262
|
+
max-height: var(--nd-visual-max-height, 100%);
|
|
4263
|
+
width: var(--nd-visual-width, calc(var(--_nd-visual-native-width) * 1px));
|
|
4264
|
+
height: var(--nd-visual-height, calc(var(--_nd-visual-native-height) * 1px));
|
|
4265
|
+
}
|
|
4266
|
+
.nd-Visual-image img, .nd-Visual-image video, .nd-Visual-video img, .nd-Visual-video video{
|
|
4267
|
+
width: 100%;
|
|
4268
|
+
height: 100%;
|
|
4269
|
+
-o-object-fit: var(--nd-visual-object-fit, cover);
|
|
4270
|
+
object-fit: var(--nd-visual-object-fit, cover);
|
|
4256
4271
|
-o-object-position: var(--nd-visual-anchor);
|
|
4257
4272
|
object-position: var(--nd-visual-anchor);
|
|
4258
4273
|
}
|
|
@@ -4274,6 +4289,9 @@ video {
|
|
|
4274
4289
|
.static{
|
|
4275
4290
|
position: static;
|
|
4276
4291
|
}
|
|
4292
|
+
.\!fixed{
|
|
4293
|
+
position: fixed !important;
|
|
4294
|
+
}
|
|
4277
4295
|
.fixed{
|
|
4278
4296
|
position: fixed;
|
|
4279
4297
|
}
|
|
@@ -4367,9 +4385,6 @@ video {
|
|
|
4367
4385
|
.col-span-10{
|
|
4368
4386
|
grid-column: span 10 / span 10;
|
|
4369
4387
|
}
|
|
4370
|
-
.col-span-2{
|
|
4371
|
-
grid-column: span 2 / span 2;
|
|
4372
|
-
}
|
|
4373
4388
|
.col-span-4{
|
|
4374
4389
|
grid-column: span 4 / span 4;
|
|
4375
4390
|
}
|
|
@@ -4409,6 +4424,12 @@ video {
|
|
|
4409
4424
|
.row-start-2{
|
|
4410
4425
|
grid-row-start: 2;
|
|
4411
4426
|
}
|
|
4427
|
+
.row-start-3{
|
|
4428
|
+
grid-row-start: 3;
|
|
4429
|
+
}
|
|
4430
|
+
.m-l2{
|
|
4431
|
+
margin: 4px;
|
|
4432
|
+
}
|
|
4412
4433
|
.m-l6{
|
|
4413
4434
|
margin: 16px;
|
|
4414
4435
|
}
|
|
@@ -4566,6 +4587,9 @@ video {
|
|
|
4566
4587
|
.h-10{
|
|
4567
4588
|
height: 10px;
|
|
4568
4589
|
}
|
|
4590
|
+
.h-12{
|
|
4591
|
+
height: 12px;
|
|
4592
|
+
}
|
|
4569
4593
|
.h-14{
|
|
4570
4594
|
height: 14px;
|
|
4571
4595
|
}
|
|
@@ -4635,9 +4659,6 @@ video {
|
|
|
4635
4659
|
.h-\[55px\]{
|
|
4636
4660
|
height: 55px;
|
|
4637
4661
|
}
|
|
4638
|
-
.h-\[60\%\]{
|
|
4639
|
-
height: 60%;
|
|
4640
|
-
}
|
|
4641
4662
|
.h-\[80px\]{
|
|
4642
4663
|
height: 80px;
|
|
4643
4664
|
}
|
|
@@ -4725,6 +4746,9 @@ video {
|
|
|
4725
4746
|
.w-11\/12{
|
|
4726
4747
|
width: 91.666667%;
|
|
4727
4748
|
}
|
|
4749
|
+
.w-12{
|
|
4750
|
+
width: 12px;
|
|
4751
|
+
}
|
|
4728
4752
|
.w-14{
|
|
4729
4753
|
width: 14px;
|
|
4730
4754
|
}
|
|
@@ -4764,15 +4788,12 @@ video {
|
|
|
4764
4788
|
.w-6{
|
|
4765
4789
|
width: 6px;
|
|
4766
4790
|
}
|
|
4767
|
-
.w-
|
|
4768
|
-
width:
|
|
4791
|
+
.w-8{
|
|
4792
|
+
width: 8px;
|
|
4769
4793
|
}
|
|
4770
4794
|
.w-8\/12{
|
|
4771
4795
|
width: 66.666667%;
|
|
4772
4796
|
}
|
|
4773
|
-
.w-\[100px\]{
|
|
4774
|
-
width: 100px;
|
|
4775
|
-
}
|
|
4776
4797
|
.w-\[120px\]{
|
|
4777
4798
|
width: 120px;
|
|
4778
4799
|
}
|
|
@@ -5140,9 +5161,6 @@ video {
|
|
|
5140
5161
|
.rounded-\[2px\]{
|
|
5141
5162
|
border-radius: 2px;
|
|
5142
5163
|
}
|
|
5143
|
-
.rounded-\[3px\]{
|
|
5144
|
-
border-radius: 3px;
|
|
5145
|
-
}
|
|
5146
5164
|
.rounded-full{
|
|
5147
5165
|
border-radius: 9999px;
|
|
5148
5166
|
}
|
|
@@ -5167,6 +5185,14 @@ video {
|
|
|
5167
5185
|
.rounded-xxs{
|
|
5168
5186
|
border-radius: 2px;
|
|
5169
5187
|
}
|
|
5188
|
+
.rounded-l-\[2px\]{
|
|
5189
|
+
border-top-left-radius: 2px;
|
|
5190
|
+
border-bottom-left-radius: 2px;
|
|
5191
|
+
}
|
|
5192
|
+
.rounded-r-\[2px\]{
|
|
5193
|
+
border-top-right-radius: 2px;
|
|
5194
|
+
border-bottom-right-radius: 2px;
|
|
5195
|
+
}
|
|
5170
5196
|
.rounded-t-lg{
|
|
5171
5197
|
border-top-left-radius: 18px;
|
|
5172
5198
|
border-top-right-radius: 18px;
|
|
@@ -5500,6 +5526,9 @@ video {
|
|
|
5500
5526
|
.p-3{
|
|
5501
5527
|
padding: 3px;
|
|
5502
5528
|
}
|
|
5529
|
+
.p-l1{
|
|
5530
|
+
padding: 2px;
|
|
5531
|
+
}
|
|
5503
5532
|
.p-l2{
|
|
5504
5533
|
padding: 4px;
|
|
5505
5534
|
}
|
|
@@ -5601,6 +5630,12 @@ video {
|
|
|
5601
5630
|
padding-top: 24px;
|
|
5602
5631
|
padding-bottom: 24px;
|
|
5603
5632
|
}
|
|
5633
|
+
.pb-l10{
|
|
5634
|
+
padding-bottom: 40px;
|
|
5635
|
+
}
|
|
5636
|
+
.pb-l3{
|
|
5637
|
+
padding-bottom: 6px;
|
|
5638
|
+
}
|
|
5604
5639
|
.pb-l4{
|
|
5605
5640
|
padding-bottom: 8px;
|
|
5606
5641
|
}
|
|
@@ -5640,6 +5675,9 @@ video {
|
|
|
5640
5675
|
.pt-10{
|
|
5641
5676
|
padding-top: 10px;
|
|
5642
5677
|
}
|
|
5678
|
+
.pt-l10{
|
|
5679
|
+
padding-top: 40px;
|
|
5680
|
+
}
|
|
5643
5681
|
.pt-l12{
|
|
5644
5682
|
padding-top: 56px;
|
|
5645
5683
|
}
|
|
@@ -5686,9 +5724,6 @@ video {
|
|
|
5686
5724
|
--tw-ordinal: ordinal;
|
|
5687
5725
|
font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
|
|
5688
5726
|
}
|
|
5689
|
-
.leading-\[100\%\]{
|
|
5690
|
-
line-height: 100%;
|
|
5691
|
-
}
|
|
5692
5727
|
.leading-\[20px\]{
|
|
5693
5728
|
line-height: 20px;
|
|
5694
5729
|
}
|
|
@@ -5699,10 +5734,6 @@ video {
|
|
|
5699
5734
|
--tw-text-opacity: 1;
|
|
5700
5735
|
color: rgb(var(--color-background) / var(--tw-text-opacity, 1));
|
|
5701
5736
|
}
|
|
5702
|
-
.text-border-l1{
|
|
5703
|
-
--tw-text-opacity: 1;
|
|
5704
|
-
color: rgb(var(--color-border-l1) / var(--tw-text-opacity, 1));
|
|
5705
|
-
}
|
|
5706
5737
|
.text-content-button{
|
|
5707
5738
|
--tw-text-opacity: 1;
|
|
5708
5739
|
color: rgb(var(--color-content-button) / var(--tw-text-opacity, 1));
|
|
@@ -5888,6 +5919,44 @@ video {
|
|
|
5888
5919
|
.\@container{
|
|
5889
5920
|
container-type: inline-size;
|
|
5890
5921
|
}
|
|
5922
|
+
.\!anchor{
|
|
5923
|
+
}
|
|
5924
|
+
.anchor{
|
|
5925
|
+
}
|
|
5926
|
+
.anchor\/\[--nd-popup-anchor\]{
|
|
5927
|
+
anchor-name: var(--nd-popup-anchor);
|
|
5928
|
+
}
|
|
5929
|
+
.anchored{
|
|
5930
|
+
}
|
|
5931
|
+
.anchored-bottom{
|
|
5932
|
+
position-area: bottom;
|
|
5933
|
+
}
|
|
5934
|
+
.anchored-bottom-span-left{
|
|
5935
|
+
position-area: bottom span-left;
|
|
5936
|
+
}
|
|
5937
|
+
.anchored-left{
|
|
5938
|
+
position-area: left;
|
|
5939
|
+
}
|
|
5940
|
+
.anchored-right{
|
|
5941
|
+
position-area: right;
|
|
5942
|
+
}
|
|
5943
|
+
.anchored-top{
|
|
5944
|
+
position-area: top;
|
|
5945
|
+
}
|
|
5946
|
+
.anchored-top-span-right{
|
|
5947
|
+
position-area: top span-right;
|
|
5948
|
+
}
|
|
5949
|
+
.anchored\/\[--nd-popup-anchor\]{
|
|
5950
|
+
position-anchor: var(--nd-popup-anchor);
|
|
5951
|
+
}
|
|
5952
|
+
.anchored\/\[--nd-popup-anchor\]:where(.anchored\/\[--nd-popup-anchor\]){
|
|
5953
|
+
position: absolute;
|
|
5954
|
+
view-transition-name: --tw-anchor-view-transition-2j1919322s193433343934192p322r2w33362l;
|
|
5955
|
+
--toolwind-toggle-nEDo9QfADx: auto;
|
|
5956
|
+
--toolwind-toggle-d4U08Ws6b8: transparent;
|
|
5957
|
+
--toolwind-toggle-00SqTQfWhn: inherit;
|
|
5958
|
+
--toolwind-toggle-sxV90D1uFT: 0px;
|
|
5959
|
+
}
|
|
5891
5960
|
.counter-l1{
|
|
5892
5961
|
counter-reset: l1;
|
|
5893
5962
|
}
|
|
@@ -5976,6 +6045,43 @@ video {
|
|
|
5976
6045
|
pointer-events: auto;
|
|
5977
6046
|
}
|
|
5978
6047
|
}
|
|
6048
|
+
.scroller-edge{
|
|
6049
|
+
border-top-width: 1px;
|
|
6050
|
+
border-style: solid;
|
|
6051
|
+
border-color: transparent;
|
|
6052
|
+
|
|
6053
|
+
animation: scroller-edge linear both;
|
|
6054
|
+
animation-timeline: scroll(self);
|
|
6055
|
+
animation-range: 0px 20px;
|
|
6056
|
+
}
|
|
6057
|
+
/* animation */
|
|
6058
|
+
@keyframes scroller-edge {
|
|
6059
|
+
from {
|
|
6060
|
+
border-top-color: transparent;
|
|
6061
|
+
}
|
|
6062
|
+
to {
|
|
6063
|
+
border-top-color: #3b82f6;
|
|
6064
|
+
}
|
|
6065
|
+
}
|
|
6066
|
+
.scroller-fade-top{
|
|
6067
|
+
position: relative;
|
|
6068
|
+
}
|
|
6069
|
+
/* overlay */
|
|
6070
|
+
.scroller-fade-top::before{
|
|
6071
|
+
position: sticky;
|
|
6072
|
+
left: 0px;
|
|
6073
|
+
right: 0px;
|
|
6074
|
+
top: 0px;
|
|
6075
|
+
z-index: 2;
|
|
6076
|
+
display: block;
|
|
6077
|
+
height: 16px;
|
|
6078
|
+
width: 100%;
|
|
6079
|
+
background-color: inherit;
|
|
6080
|
+
--tw-content: "\00a0";
|
|
6081
|
+
content: var(--tw-content);
|
|
6082
|
+
-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
|
|
6083
|
+
mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
|
|
6084
|
+
}
|
|
5979
6085
|
.stacked{
|
|
5980
6086
|
display: grid;
|
|
5981
6087
|
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
@@ -6010,13 +6116,22 @@ video {
|
|
|
6010
6116
|
inherits: false;
|
|
6011
6117
|
initial-value: #000;
|
|
6012
6118
|
}
|
|
6013
|
-
.\[--nd-icon-color\:theme\(colors\.content-primary\)\]{
|
|
6014
|
-
--nd-icon-color: rgb(var(--color-content-primary) / 1);
|
|
6015
|
-
}
|
|
6016
6119
|
.focus-within\:field-focused:focus-within.field {
|
|
6017
6120
|
}
|
|
6018
6121
|
.focus-visible\:field-focused:focus-visible.field {
|
|
6019
6122
|
}
|
|
6123
|
+
.group:hover .group-hover\:FieldCard-hover.FieldCard{
|
|
6124
|
+
--tw-border-opacity: 1;
|
|
6125
|
+
border-color: rgb(var(--color-ix-primary) / var(--tw-border-opacity, 1));
|
|
6126
|
+
}
|
|
6127
|
+
.group:active .group-active\:FieldCard-press.FieldCard{
|
|
6128
|
+
--tw-scale-x: .97;
|
|
6129
|
+
--tw-scale-y: .97;
|
|
6130
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
6131
|
+
transition-timing-function: cubic-bezier(0.5, 1, 0.89, 1);
|
|
6132
|
+
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
|
|
6133
|
+
transition-duration: 200ms;
|
|
6134
|
+
}
|
|
6020
6135
|
@media (min-width: 768px){
|
|
6021
6136
|
.md\:display-md{
|
|
6022
6137
|
font-family: var(--font-display), sans-serif;
|
|
@@ -6185,9 +6300,6 @@ video {
|
|
|
6185
6300
|
.hover\:underline:hover{
|
|
6186
6301
|
text-decoration-line: underline;
|
|
6187
6302
|
}
|
|
6188
|
-
.hover\:opacity-full:hover{
|
|
6189
|
-
opacity: 1;
|
|
6190
|
-
}
|
|
6191
6303
|
.hover\:outline-ix-primary\/\[\.35\]:hover{
|
|
6192
6304
|
outline-color: rgb(var(--color-ix-primary) / .35);
|
|
6193
6305
|
}
|
|
@@ -6296,9 +6408,6 @@ video {
|
|
|
6296
6408
|
--tw-bg-opacity: 1;
|
|
6297
6409
|
background-color: rgb(var(--color-ix-primary-hover) / var(--tw-bg-opacity, 1));
|
|
6298
6410
|
}
|
|
6299
|
-
.group:hover .group-hover\:bg-ix-primary\/tint1{
|
|
6300
|
-
background-color: rgb(var(--color-ix-primary) / .1);
|
|
6301
|
-
}
|
|
6302
6411
|
.group:hover .group-hover\:bg-ix-util-hover\/tint1{
|
|
6303
6412
|
background-color: rgb(var(--color-ix-util-hover) / .1);
|
|
6304
6413
|
}
|
|
@@ -6306,6 +6415,10 @@ video {
|
|
|
6306
6415
|
--tw-text-opacity: 1;
|
|
6307
6416
|
color: rgb(var(--color-content-primary) / var(--tw-text-opacity, 1));
|
|
6308
6417
|
}
|
|
6418
|
+
.group:hover .group-hover\:text-content-secondary{
|
|
6419
|
+
--tw-text-opacity: 1;
|
|
6420
|
+
color: rgb(var(--color-content-secondary) / var(--tw-text-opacity, 1));
|
|
6421
|
+
}
|
|
6309
6422
|
.group:focus-visible .group-focus-visible\:outline-ix-primary{
|
|
6310
6423
|
outline-color: rgb(var(--color-ix-primary) / 1);
|
|
6311
6424
|
}
|
|
@@ -6322,12 +6435,13 @@ video {
|
|
|
6322
6435
|
--tw-bg-opacity: 1;
|
|
6323
6436
|
background-color: rgb(var(--color-ix-primary-press) / var(--tw-bg-opacity, 1));
|
|
6324
6437
|
}
|
|
6325
|
-
.group:active .group-active\:bg-ix-primary\/tint3{
|
|
6326
|
-
background-color: rgb(var(--color-ix-primary) / .3);
|
|
6327
|
-
}
|
|
6328
6438
|
.group:active .group-active\:bg-ix-util-press\/tint2{
|
|
6329
6439
|
background-color: rgb(var(--color-ix-util-press) / .2);
|
|
6330
6440
|
}
|
|
6441
|
+
.group:active .group-active\:text-content-primary{
|
|
6442
|
+
--tw-text-opacity: 1;
|
|
6443
|
+
color: rgb(var(--color-content-primary) / var(--tw-text-opacity, 1));
|
|
6444
|
+
}
|
|
6331
6445
|
.group:active .group-active\:text-content-tertiary{
|
|
6332
6446
|
--tw-text-opacity: 1;
|
|
6333
6447
|
color: rgb(var(--color-content-tertiary) / var(--tw-text-opacity, 1));
|
|
@@ -6481,6 +6595,10 @@ video {
|
|
|
6481
6595
|
display: block;
|
|
6482
6596
|
}
|
|
6483
6597
|
|
|
6598
|
+
.lg\:flex{
|
|
6599
|
+
display: flex;
|
|
6600
|
+
}
|
|
6601
|
+
|
|
6484
6602
|
.lg\:w-\[240px\]{
|
|
6485
6603
|
width: 240px;
|
|
6486
6604
|
}
|
package/dist/styles/tailwind.js
CHANGED
|
@@ -9,6 +9,7 @@ const plugin_1 = __importDefault(require("tailwindcss/plugin"));
|
|
|
9
9
|
const Tailwind_1 = require("@nascentdigital/funnel-ui/Tailwind");
|
|
10
10
|
const aspect_ratio_1 = __importDefault(require("@tailwindcss/aspect-ratio"));
|
|
11
11
|
const container_queries_1 = __importDefault(require("@tailwindcss/container-queries"));
|
|
12
|
+
const anchors_1 = __importDefault(require("@toolwind/anchors"));
|
|
12
13
|
// tailwind
|
|
13
14
|
exports.EditorTailwindConfig = {
|
|
14
15
|
content: [
|
|
@@ -258,15 +259,16 @@ exports.EditorTailwindConfig = {
|
|
|
258
259
|
'quad-in-out': 'cubic-bezier(0.45, 0, 0.55, 1)',
|
|
259
260
|
'cube-in': 'cubic-bezier(0.32, 0, 0.67, 0)',
|
|
260
261
|
'cube-out': 'cubic-bezier(0.33, 1, 0.68, 1)',
|
|
261
|
-
'cube-in-out': 'cubic-bezier(0.65, 0, 0.35, 1)'
|
|
262
|
+
'cube-in-out': 'cubic-bezier(0.65, 0, 0.35, 1)'
|
|
262
263
|
}
|
|
263
264
|
}
|
|
264
265
|
},
|
|
265
266
|
plugins: [
|
|
266
267
|
aspect_ratio_1.default,
|
|
267
268
|
container_queries_1.default,
|
|
269
|
+
anchors_1.default,
|
|
270
|
+
// counter: provides custom counting control via tailwind
|
|
268
271
|
(0, plugin_1.default)(function ({ matchUtilities, matchVariant, theme }) {
|
|
269
|
-
// counter: provides custom counting control via tailwind
|
|
270
272
|
matchUtilities({
|
|
271
273
|
'counter': (value) => ({
|
|
272
274
|
counterReset: value
|
|
@@ -280,7 +282,9 @@ exports.EditorTailwindConfig = {
|
|
|
280
282
|
}, {
|
|
281
283
|
values: theme('counterName')
|
|
282
284
|
});
|
|
283
|
-
|
|
285
|
+
}),
|
|
286
|
+
// avoid: avoids child component (pass in selector to thing you want to not match)
|
|
287
|
+
(0, plugin_1.default)(function ({ matchUtilities, matchVariant, theme }) {
|
|
284
288
|
matchVariant('avoid', child => `&:not(:has(${child}:hover, ${child}:focus-visible, ${child}:active))`);
|
|
285
289
|
})
|
|
286
290
|
]
|
|
@@ -12,6 +12,7 @@ const core_1 = require("../../core");
|
|
|
12
12
|
// component
|
|
13
13
|
function UserExplorer() {
|
|
14
14
|
// bind hooks
|
|
15
|
+
const anchorId = (0, react_1.useId)();
|
|
15
16
|
const userEditorRef = (0, react_1.useRef)(null);
|
|
16
17
|
const { user } = (0, core_1.useAuthenticator)();
|
|
17
18
|
const browser = (0, core_1.useUserBrowser)();
|
|
@@ -118,7 +119,7 @@ function renderUsers({ user: currentUser, router, browser, menu, userEditorRef,
|
|
|
118
119
|
await browser.sync();
|
|
119
120
|
}
|
|
120
121
|
};
|
|
121
|
-
const onMenuOpen = async (e, user) => {
|
|
122
|
+
const onMenuOpen = async (e, user, anchor) => {
|
|
122
123
|
// consume event
|
|
123
124
|
e.preventDefault();
|
|
124
125
|
e.stopPropagation();
|
|
@@ -145,7 +146,7 @@ function renderUsers({ user: currentUser, router, browser, menu, userEditorRef,
|
|
|
145
146
|
// open menu
|
|
146
147
|
menu.items = menuItems;
|
|
147
148
|
menu.selectedItem = undefined;
|
|
148
|
-
menu.open(
|
|
149
|
+
menu.open(anchor, user);
|
|
149
150
|
};
|
|
150
151
|
const onMenuSelect = async (item) => {
|
|
151
152
|
var _a;
|
|
@@ -173,21 +174,21 @@ function renderUsers({ user: currentUser, router, browser, menu, userEditorRef,
|
|
|
173
174
|
const { users } = browser;
|
|
174
175
|
const canManageUsers = currentUser.hasAny('user.update', 'user.delete', 'user.passwordReset');
|
|
175
176
|
return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex justify-between items-center gap-l8", children: [(0, jsx_runtime_1.jsx)("h2", { className: "heading-lg text-content-primary", children: "Users" }), currentUser.has('user.create') &&
|
|
176
|
-
(0, jsx_runtime_1.jsx)(core_1.Button, { variant: "primary", iconLeft: "Plus", onClick: e => onCreateUser(
|
|
177
|
+
(0, jsx_runtime_1.jsx)(core_1.Button, { anchorId: "user-create", variant: "primary", iconLeft: "Plus", onClick: e => onCreateUser('user-create'), children: "New user" })] }), (0, jsx_runtime_1.jsx)(core_1.Table, { className: "flex-1", children: users.map(user => {
|
|
177
178
|
// bond props
|
|
178
179
|
const isCurrentUser = currentUser.id === user.id;
|
|
179
180
|
const isInferior = currentUser.role.compareTo(user.role) > 0;
|
|
180
181
|
// render
|
|
181
|
-
return ((0, jsx_runtime_1.jsx)(core_1.TableItem, { details: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [user.blocked &&
|
|
182
|
+
return ((0, jsx_runtime_1.jsx)(core_1.TableItem, { anchorId: `user-edit-${user.id}`, details: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [user.blocked &&
|
|
182
183
|
(0, jsx_runtime_1.jsx)(core_1.StatusBadge, { variant: "error", label: "Blocked" }), isCurrentUser &&
|
|
183
184
|
(0, jsx_runtime_1.jsx)(core_1.StatusBadge, { variant: "warn", label: "You" }), user.isAdmin
|
|
184
185
|
? (0, jsx_runtime_1.jsx)(core_1.StatusBadge, { variant: "success", label: user.role.name })
|
|
185
186
|
: user.isEditor
|
|
186
187
|
? (0, jsx_runtime_1.jsx)(core_1.StatusBadge, { variant: "default", label: user.role.name })
|
|
187
188
|
: (0, jsx_runtime_1.jsx)(core_1.StatusBadge, { variant: "warn", label: user.role.name }), canManageUsers &&
|
|
188
|
-
(0, jsx_runtime_1.jsx)(core_1.IconButton, { className: (0, classnames_1.default)('interactive-child ml-l5', {
|
|
189
|
+
(0, jsx_runtime_1.jsx)(core_1.IconButton, { anchorId: `user-menu-${user.id}`, className: (0, classnames_1.default)('interactive-child ml-l5', {
|
|
189
190
|
'opacity-none': isInferior
|
|
190
|
-
}), variant: "util", size: "sm", icon: "EllipsisVertical", onClick: e => onMenuOpen(e, user), disabled: isInferior })] }), onClick: e => onEditUser(user,
|
|
191
|
+
}), variant: "util", size: "sm", icon: "EllipsisVertical", onClick: e => onMenuOpen(e, user, `user-menu-${user.id}`), disabled: isInferior })] }), onClick: e => onEditUser(user, `user-edit-${user.id}`), disabled: isInferior, children: (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 flex items-center gap-l6", children: [(0, jsx_runtime_1.jsx)("h3", { className: "label-md label-strong text-content-primary", children: user.username }), (0, jsx_runtime_1.jsx)("span", { className: "label-xs text-content-secondary", children: user.email })] }) }, user.id));
|
|
191
192
|
}) }), (0, jsx_runtime_1.jsx)(core_1.Menu, { controller: menu, onItemClick: onMenuSelect })] }, "changes"));
|
|
192
193
|
}
|
|
193
194
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nascentdigital/funnel-editor",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.6.0",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"registry": "https://registry.npmjs.org/",
|
|
6
6
|
"access": "restricted"
|
|
@@ -77,6 +77,7 @@
|
|
|
77
77
|
"devDependencies": {
|
|
78
78
|
"@tailwindcss/aspect-ratio": "^0",
|
|
79
79
|
"@tailwindcss/container-queries": "^0",
|
|
80
|
+
"@toolwind/anchors": "^1",
|
|
80
81
|
"@types/node": "^22",
|
|
81
82
|
"@types/url-regex-safe": "^1",
|
|
82
83
|
"autoprefixer": "^10",
|
|
@@ -89,5 +90,5 @@
|
|
|
89
90
|
"ts-jest": "^29",
|
|
90
91
|
"type-fest": "^4"
|
|
91
92
|
},
|
|
92
|
-
"gitHead": "
|
|
93
|
+
"gitHead": "7fba18243bc79f94b3bd665db21f37bc7f3afd4c"
|
|
93
94
|
}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { Schema } from '@nascentdigital/funnel-core';
|
|
2
|
-
import { Client } from '@nascentdigital/funnel-ui';
|
|
3
|
-
export declare function ClientPreview({ className, client }: ClientPreview.Props): import("react/jsx-runtime").JSX.Element;
|
|
4
|
-
export declare namespace ClientPreview {
|
|
5
|
-
type Props = {
|
|
6
|
-
className?: string;
|
|
7
|
-
schema: Schema.CollectionField;
|
|
8
|
-
client: Client.Value;
|
|
9
|
-
};
|
|
10
|
-
}
|
|
@@ -1,29 +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.ClientPreview = ClientPreview;
|
|
7
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
-
const funnel_ui_1 = require("@nascentdigital/funnel-ui");
|
|
9
|
-
const classnames_1 = __importDefault(require("classnames"));
|
|
10
|
-
// components
|
|
11
|
-
function ClientPreview({ className, client }) {
|
|
12
|
-
// bind props
|
|
13
|
-
const { name, fields } = client;
|
|
14
|
-
const { logo: logoRaw, division: divisionRaw, location: locationRaw } = fields !== null && fields !== void 0 ? fields : {};
|
|
15
|
-
const logo = logoRaw === null || logoRaw === void 0 ? void 0 : logoRaw.value;
|
|
16
|
-
const division = divisionRaw === null || divisionRaw === void 0 ? void 0 : divisionRaw.value;
|
|
17
|
-
const location = locationRaw === null || locationRaw === void 0 ? void 0 : locationRaw.value;
|
|
18
|
-
// render
|
|
19
|
-
return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(className, 'h-full flex flex-col justify-center items-center gap-l8 p-l8', '[--nd-icon-color:theme(colors.content-primary)]', '[--nd-icon-color:theme(colors.content-primary)]'), children: [logo
|
|
20
|
-
?
|
|
21
|
-
(0, jsx_runtime_1.jsx)(funnel_ui_1.Icon, { className: "w-[100px] h-40", icon: logo })
|
|
22
|
-
:
|
|
23
|
-
(0, jsx_runtime_1.jsx)("div", { className: "text-border-l1 border border-dashed border-border-l1 rounded-xs p-l6", children: "Logo" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-center text-center", children: [(0, jsx_runtime_1.jsx)("h4", { className: "body-xs body-strong text-content-secondary", children: name }), division && location &&
|
|
24
|
-
(0, jsx_runtime_1.jsx)("span", { className: "label-xs text-content-tertiary", children: division
|
|
25
|
-
? location
|
|
26
|
-
? `${division}, ${location}`
|
|
27
|
-
: division
|
|
28
|
-
: location })] })] }));
|
|
29
|
-
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { BlockLayout } from '@nascentdigital/funnel-core';
|
|
2
|
-
export declare function SkeletonLayout({ variant, layout }: SkeletonLayout.Props): import("react/jsx-runtime").JSX.Element;
|
|
3
|
-
export declare namespace SkeletonLayout {
|
|
4
|
-
type Variant = 'mobile' | 'desktop';
|
|
5
|
-
type Props = {
|
|
6
|
-
variant: Variant;
|
|
7
|
-
layout?: Readonly<BlockLayout>;
|
|
8
|
-
};
|
|
9
|
-
}
|