@adyen/bento-vue2 0.7.1 → 0.8.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.
Files changed (28) hide show
  1. package/dist/@types/components/divider/divider.vue.d.ts +6 -0
  2. package/dist/@types/components/divider/index.d.ts +1 -0
  3. package/dist/@types/components/internal/copy/copy.vue.d.ts +19 -0
  4. package/dist/@types/components/internal/copy/index.d.ts +1 -0
  5. package/dist/@types/components/internal/index.d.ts +1 -0
  6. package/dist/@types/components/popover/popover.vue.d.ts +9 -0
  7. package/dist/@types/components/structured-list/components/structered-list-item/structured-list-item.vue.d.ts +46 -0
  8. package/dist/@types/components/structured-list/index.d.ts +2 -0
  9. package/dist/@types/components/structured-list/structured-list.vue.d.ts +2 -0
  10. package/dist/@types/components/summary-grid/components/grid-layout/grid-layout.types.d.ts +5 -7
  11. package/dist/@types/components/summary-grid/components/grid-layout/grid-layout.vue.d.ts +16 -11
  12. package/dist/@types/components/summary-grid/components/summary-grid-item/index.d.ts +2 -0
  13. package/dist/@types/components/summary-grid/components/summary-grid-item/summary-grid-item.types.d.ts +7 -0
  14. package/dist/@types/components/summary-grid/components/summary-grid-item/summary-grid-item.vue.d.ts +102 -0
  15. package/dist/@types/components/summary-grid/components/summary-grid-item-amount/summary-grid-item-amount.vue.d.ts +89 -0
  16. package/dist/@types/components/summary-grid/components/summary-grid-item-custom/summary-grid-item-custom.vue.d.ts +40 -0
  17. package/dist/@types/components/summary-grid/components/summary-grid-item-numeric/summary-grid-item-numeric.vue.d.ts +80 -0
  18. package/dist/@types/components/summary-grid/components/summary-grid-item-percentage/summary-grid-item-percentage.vue.d.ts +80 -0
  19. package/dist/@types/components/summary-grid/components/summary-grid-item-text/summary-grid-item-text.vue.d.ts +51 -0
  20. package/dist/@types/components/summary-grid/index.d.ts +7 -0
  21. package/dist/@types/components/summary-grid/summary-grid.types.d.ts +16 -0
  22. package/dist/@types/components/summary-grid/summary-grid.vue.d.ts +19 -0
  23. package/dist/@types/components.d.ts +16 -0
  24. package/dist/@types/index.d.ts +3 -0
  25. package/dist/index.js +4099 -3351
  26. package/dist/index.js.map +1 -1
  27. package/dist/web-types.json +607 -5
  28. package/package.json +2 -2
package/dist/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "framework": "vue",
3
3
  "name": "@adyen/bento-vue2",
4
- "version": "0.7.1",
4
+ "version": "0.8.0",
5
5
  "contributions": {
6
6
  "html": {
7
7
  "description-markup": "markdown",
@@ -1703,6 +1703,14 @@
1703
1703
  "symbol": "default"
1704
1704
  }
1705
1705
  },
1706
+ {
1707
+ "name": "bento-divider",
1708
+ "description": "",
1709
+ "source": {
1710
+ "module": "./src/components/divider/divider.vue",
1711
+ "symbol": "default"
1712
+ }
1713
+ },
1706
1714
  {
1707
1715
  "name": "bento-dropdown-avatar",
1708
1716
  "description": "A Avatar Dropdown showing a selectable list of countries.",
@@ -3200,6 +3208,15 @@
3200
3208
  },
3201
3209
  "default": "false"
3202
3210
  },
3211
+ {
3212
+ "name": "open",
3213
+ "description": "Toggles the popover open and closed",
3214
+ "value": {
3215
+ "kind": "expression",
3216
+ "type": "boolean"
3217
+ },
3218
+ "default": "false"
3219
+ },
3203
3220
  {
3204
3221
  "name": "large",
3205
3222
  "description": "Displays the popover in a large size.",
@@ -3694,6 +3711,460 @@
3694
3711
  "symbol": "default"
3695
3712
  }
3696
3713
  },
3714
+ {
3715
+ "name": "bento-structured-list",
3716
+ "description": "This is a list used to display pairs of information in a clear and organized manner.\n`BentoStructureListItem` should be used to pass the label/value pairs to the list.",
3717
+ "slots": [
3718
+ {
3719
+ "name": "default"
3720
+ }
3721
+ ],
3722
+ "source": {
3723
+ "module": "./src/components/structured-list/structured-list.vue",
3724
+ "symbol": "default"
3725
+ }
3726
+ },
3727
+ {
3728
+ "name": "bento-structured-list-item",
3729
+ "description": "This is an item of the `BentoStructuredList` meant to be used only with that component.\nIt consists of a label/value pair, and also the optional copy and search modifiers.",
3730
+ "attributes": [
3731
+ {
3732
+ "name": "label",
3733
+ "required": true,
3734
+ "description": "Label to display for the value",
3735
+ "value": {
3736
+ "kind": "expression",
3737
+ "type": "string"
3738
+ }
3739
+ },
3740
+ {
3741
+ "name": "copy",
3742
+ "description": "Text to copy when the user clicks `Copy` icon",
3743
+ "value": {
3744
+ "kind": "expression",
3745
+ "type": "string"
3746
+ },
3747
+ "default": "undefined"
3748
+ },
3749
+ {
3750
+ "name": "search",
3751
+ "description": "Function to trigger when user clicks `Search` icon",
3752
+ "value": {
3753
+ "kind": "expression",
3754
+ "type": "(event: Event) => void"
3755
+ },
3756
+ "default": "undefined"
3757
+ },
3758
+ {
3759
+ "name": "searchTooltip",
3760
+ "description": "Text to display when the user hovers over `Search` icon",
3761
+ "value": {
3762
+ "kind": "expression",
3763
+ "type": "string"
3764
+ },
3765
+ "default": "undefined"
3766
+ }
3767
+ ],
3768
+ "slots": [
3769
+ {
3770
+ "name": "default"
3771
+ }
3772
+ ],
3773
+ "source": {
3774
+ "module": "./src/components/structured-list/components/structered-list-item/structured-list-item.vue",
3775
+ "symbol": "default"
3776
+ }
3777
+ },
3778
+ {
3779
+ "name": "bento-summary-grid",
3780
+ "description": "A summary grid component that displays a collection items.",
3781
+ "attributes": [
3782
+ {
3783
+ "name": "columnWidth",
3784
+ "description": "Sets the responsive columns widths values for 1 of the 3 rows.",
3785
+ "value": {
3786
+ "kind": "expression",
3787
+ "type": "BentoSummaryGridColumnWidth"
3788
+ },
3789
+ "default": "null"
3790
+ }
3791
+ ],
3792
+ "slots": [
3793
+ {
3794
+ "name": "default"
3795
+ }
3796
+ ],
3797
+ "source": {
3798
+ "module": "./src/components/summary-grid/summary-grid.vue",
3799
+ "symbol": "default"
3800
+ }
3801
+ },
3802
+ {
3803
+ "name": "bento-summary-grid-item-amount",
3804
+ "description": "Summary grid item component used to display financial data, such as currency values and monetary amounts",
3805
+ "attributes": [
3806
+ {
3807
+ "name": "copy",
3808
+ "description": "Text to copy to the clipboard",
3809
+ "value": {
3810
+ "kind": "expression",
3811
+ "type": "string"
3812
+ },
3813
+ "default": "undefined"
3814
+ },
3815
+ {
3816
+ "name": "label",
3817
+ "required": true,
3818
+ "description": "Amount to be shown as the main value",
3819
+ "value": {
3820
+ "kind": "expression",
3821
+ "type": "string"
3822
+ }
3823
+ },
3824
+ {
3825
+ "name": "secondaryLabel",
3826
+ "description": "Adds additional label next to amount content",
3827
+ "value": {
3828
+ "kind": "expression",
3829
+ "type": "string"
3830
+ },
3831
+ "default": "null"
3832
+ },
3833
+ {
3834
+ "name": "title",
3835
+ "required": true,
3836
+ "description": "Text used as a title",
3837
+ "value": {
3838
+ "kind": "expression",
3839
+ "type": "string"
3840
+ }
3841
+ },
3842
+ {
3843
+ "name": "infoIconTooltipText",
3844
+ "description": "Text showed in the info-icon tooltip on hover",
3845
+ "value": {
3846
+ "kind": "expression",
3847
+ "type": "string"
3848
+ },
3849
+ "default": "null"
3850
+ },
3851
+ {
3852
+ "name": "fitContent",
3853
+ "description": "The width of `summary-grid-item` fits its content",
3854
+ "value": {
3855
+ "kind": "expression",
3856
+ "type": "boolean"
3857
+ },
3858
+ "default": "false"
3859
+ },
3860
+ {
3861
+ "name": "trendDirection",
3862
+ "description": "Defines the direction (color) of the trend label",
3863
+ "value": {
3864
+ "kind": "expression",
3865
+ "type": "BentoSummaryGridItemTrendDirection"
3866
+ },
3867
+ "default": "BentoSummaryGridItemTrendDirection.POSITIVE"
3868
+ },
3869
+ {
3870
+ "name": "trend",
3871
+ "description": "Shows colored trend label next to text content",
3872
+ "value": {
3873
+ "kind": "expression",
3874
+ "type": "string"
3875
+ },
3876
+ "default": "null"
3877
+ },
3878
+ {
3879
+ "name": "size",
3880
+ "description": "Defines the size of the `summary-grid-item` text content",
3881
+ "value": {
3882
+ "kind": "expression",
3883
+ "type": "BentoSummaryGridItemSize"
3884
+ },
3885
+ "default": "BentoSummaryGridItemSize.SMALL"
3886
+ }
3887
+ ],
3888
+ "source": {
3889
+ "module": "./src/components/summary-grid/components/summary-grid-item-amount/summary-grid-item-amount.vue",
3890
+ "symbol": "default"
3891
+ }
3892
+ },
3893
+ {
3894
+ "name": "bento-summary-grid-item-custom",
3895
+ "description": "A summary bar item is a piece of information to be displayed in `bento-summary-bar` component",
3896
+ "attributes": [
3897
+ {
3898
+ "name": "copy",
3899
+ "description": "Text to copy to the clipboard",
3900
+ "value": {
3901
+ "kind": "expression",
3902
+ "type": "string"
3903
+ },
3904
+ "default": "undefined"
3905
+ },
3906
+ {
3907
+ "name": "infoIconTooltipText",
3908
+ "description": "Text showed in the info-icon tooltip on hover",
3909
+ "value": {
3910
+ "kind": "expression",
3911
+ "type": "string"
3912
+ },
3913
+ "default": "null"
3914
+ },
3915
+ {
3916
+ "name": "title",
3917
+ "required": true,
3918
+ "description": "Text used as a title",
3919
+ "value": {
3920
+ "kind": "expression",
3921
+ "type": "string"
3922
+ }
3923
+ },
3924
+ {
3925
+ "name": "fitContent",
3926
+ "description": "The width of `summary-grid-item` fits its content",
3927
+ "value": {
3928
+ "kind": "expression",
3929
+ "type": "boolean"
3930
+ },
3931
+ "default": "false"
3932
+ }
3933
+ ],
3934
+ "events": [
3935
+ {
3936
+ "name": "copy-to-clipboard"
3937
+ }
3938
+ ],
3939
+ "slots": [
3940
+ {
3941
+ "name": "default"
3942
+ }
3943
+ ],
3944
+ "source": {
3945
+ "module": "./src/components/summary-grid/components/summary-grid-item-custom/summary-grid-item-custom.vue",
3946
+ "symbol": "default"
3947
+ }
3948
+ },
3949
+ {
3950
+ "name": "bento-summary-grid-item-numeric",
3951
+ "description": "Summary grid item component used to display any numeric information",
3952
+ "attributes": [
3953
+ {
3954
+ "name": "copy",
3955
+ "description": "Text to copy to the clipboard",
3956
+ "value": {
3957
+ "kind": "expression",
3958
+ "type": "string"
3959
+ },
3960
+ "default": "undefined"
3961
+ },
3962
+ {
3963
+ "name": "label",
3964
+ "required": true,
3965
+ "description": "Amount to be shown as the main value",
3966
+ "value": {
3967
+ "kind": "expression",
3968
+ "type": "string"
3969
+ }
3970
+ },
3971
+ {
3972
+ "name": "title",
3973
+ "required": true,
3974
+ "description": "Text used as a title",
3975
+ "value": {
3976
+ "kind": "expression",
3977
+ "type": "string"
3978
+ }
3979
+ },
3980
+ {
3981
+ "name": "infoIconTooltipText",
3982
+ "description": "Text showed in the info-icon tooltip on hover",
3983
+ "value": {
3984
+ "kind": "expression",
3985
+ "type": "string"
3986
+ },
3987
+ "default": "null"
3988
+ },
3989
+ {
3990
+ "name": "fitContent",
3991
+ "description": "The width of `summary-grid-item` fits its content",
3992
+ "value": {
3993
+ "kind": "expression",
3994
+ "type": "boolean"
3995
+ },
3996
+ "default": "false"
3997
+ },
3998
+ {
3999
+ "name": "trendDirection",
4000
+ "description": "Defines the direction (color) of the trend label",
4001
+ "value": {
4002
+ "kind": "expression",
4003
+ "type": "BentoSummaryGridItemTrendDirection"
4004
+ },
4005
+ "default": "BentoSummaryGridItemTrendDirection.POSITIVE"
4006
+ },
4007
+ {
4008
+ "name": "trend",
4009
+ "description": "Shows colored trend label next to text content",
4010
+ "value": {
4011
+ "kind": "expression",
4012
+ "type": "string"
4013
+ },
4014
+ "default": "null"
4015
+ },
4016
+ {
4017
+ "name": "size",
4018
+ "description": "Defines the size of the `summary-grid-item` text content",
4019
+ "value": {
4020
+ "kind": "expression",
4021
+ "type": "BentoSummaryGridItemSize"
4022
+ },
4023
+ "default": "BentoSummaryGridItemSize.SMALL"
4024
+ }
4025
+ ],
4026
+ "source": {
4027
+ "module": "./src/components/summary-grid/components/summary-grid-item-numeric/summary-grid-item-numeric.vue",
4028
+ "symbol": "default"
4029
+ }
4030
+ },
4031
+ {
4032
+ "name": "bento-summary-grid-item-percentage",
4033
+ "description": "Summary grid item component used to display any percentage information",
4034
+ "attributes": [
4035
+ {
4036
+ "name": "label",
4037
+ "required": true,
4038
+ "description": "Amount to be shown as the main value",
4039
+ "value": {
4040
+ "kind": "expression",
4041
+ "type": "string"
4042
+ }
4043
+ },
4044
+ {
4045
+ "name": "title",
4046
+ "required": true,
4047
+ "description": "Text used as a title",
4048
+ "value": {
4049
+ "kind": "expression",
4050
+ "type": "string"
4051
+ }
4052
+ },
4053
+ {
4054
+ "name": "infoIconTooltipText",
4055
+ "description": "Text showed in the info-icon tooltip on hover",
4056
+ "value": {
4057
+ "kind": "expression",
4058
+ "type": "string"
4059
+ },
4060
+ "default": "null"
4061
+ },
4062
+ {
4063
+ "name": "copy",
4064
+ "description": "Text to copy to the clipboard",
4065
+ "value": {
4066
+ "kind": "expression",
4067
+ "type": "string"
4068
+ },
4069
+ "default": "undefined"
4070
+ },
4071
+ {
4072
+ "name": "fitContent",
4073
+ "description": "The width of `summary-grid-item` fits its content",
4074
+ "value": {
4075
+ "kind": "expression",
4076
+ "type": "boolean"
4077
+ },
4078
+ "default": "false"
4079
+ },
4080
+ {
4081
+ "name": "trendDirection",
4082
+ "description": "Defines the direction (color) of the trend label",
4083
+ "value": {
4084
+ "kind": "expression",
4085
+ "type": "BentoSummaryGridItemTrendDirection"
4086
+ },
4087
+ "default": "BentoSummaryGridItemTrendDirection.POSITIVE"
4088
+ },
4089
+ {
4090
+ "name": "trend",
4091
+ "description": "Shows colored trend label next to text content",
4092
+ "value": {
4093
+ "kind": "expression",
4094
+ "type": "string"
4095
+ },
4096
+ "default": "undefined"
4097
+ },
4098
+ {
4099
+ "name": "size",
4100
+ "description": "Defines the size of the `summary-grid-item` text content",
4101
+ "value": {
4102
+ "kind": "expression",
4103
+ "type": "BentoSummaryGridItemSize"
4104
+ },
4105
+ "default": "BentoSummaryGridItemSize.SMALL"
4106
+ }
4107
+ ],
4108
+ "source": {
4109
+ "module": "./src/components/summary-grid/components/summary-grid-item-percentage/summary-grid-item-percentage.vue",
4110
+ "symbol": "default"
4111
+ }
4112
+ },
4113
+ {
4114
+ "name": "bento-summary-grid-item-text",
4115
+ "description": "Summary grid item component used to display text only. Can be used for references, IDs or any other text data.",
4116
+ "attributes": [
4117
+ {
4118
+ "name": "copy",
4119
+ "description": "Text to copy to the clipboard",
4120
+ "value": {
4121
+ "kind": "expression",
4122
+ "type": "string"
4123
+ },
4124
+ "default": "undefined"
4125
+ },
4126
+ {
4127
+ "name": "label",
4128
+ "required": true,
4129
+ "description": "Amount to be shown as the main value",
4130
+ "value": {
4131
+ "kind": "expression",
4132
+ "type": "string"
4133
+ }
4134
+ },
4135
+ {
4136
+ "name": "title",
4137
+ "required": true,
4138
+ "description": "Text used as a title",
4139
+ "value": {
4140
+ "kind": "expression",
4141
+ "type": "string"
4142
+ }
4143
+ },
4144
+ {
4145
+ "name": "infoIconTooltipText",
4146
+ "description": "Text showed in the info-icon tooltip on hover",
4147
+ "value": {
4148
+ "kind": "expression",
4149
+ "type": "string"
4150
+ },
4151
+ "default": "null"
4152
+ },
4153
+ {
4154
+ "name": "fitContent",
4155
+ "description": "The width of `summary-grid-item` fits its content",
4156
+ "value": {
4157
+ "kind": "expression",
4158
+ "type": "boolean"
4159
+ },
4160
+ "default": "false"
4161
+ }
4162
+ ],
4163
+ "source": {
4164
+ "module": "./src/components/summary-grid/components/summary-grid-item-text/summary-grid-item-text.vue",
4165
+ "symbol": "default"
4166
+ }
4167
+ },
3697
4168
  {
3698
4169
  "name": "bento-tag",
3699
4170
  "description": "",
@@ -3997,6 +4468,30 @@
3997
4468
  "symbol": "default"
3998
4469
  }
3999
4470
  },
4471
+ {
4472
+ "name": "copy",
4473
+ "description": "An internal button component that copies text to the user's clipboard.",
4474
+ "attributes": [
4475
+ {
4476
+ "name": "text",
4477
+ "required": true,
4478
+ "description": "Defines the string that will get copied to the clipboard",
4479
+ "value": {
4480
+ "kind": "expression",
4481
+ "type": "string"
4482
+ }
4483
+ }
4484
+ ],
4485
+ "slots": [
4486
+ {
4487
+ "name": "default"
4488
+ }
4489
+ ],
4490
+ "source": {
4491
+ "module": "./src/components/internal/copy/copy.vue",
4492
+ "symbol": "default"
4493
+ }
4494
+ },
4000
4495
  {
4001
4496
  "name": "data-grid-columns",
4002
4497
  "description": "",
@@ -4847,12 +5342,32 @@
4847
5342
  "description": "Component used to render the grid layout in the bento-summary-grid. For internal use only",
4848
5343
  "attributes": [
4849
5344
  {
4850
- "name": "items",
4851
- "required": true,
5345
+ "name": "columnWidth",
4852
5346
  "value": {
4853
5347
  "kind": "expression",
4854
- "type": "GridLayoutItem[]"
4855
- }
5348
+ "type": "GridLayoutColumnWidths"
5349
+ },
5350
+ "default": "null"
5351
+ }
5352
+ ],
5353
+ "slots": [
5354
+ {
5355
+ "name": "col-1"
5356
+ },
5357
+ {
5358
+ "name": "col-2"
5359
+ },
5360
+ {
5361
+ "name": "col-3"
5362
+ },
5363
+ {
5364
+ "name": "col-4"
5365
+ },
5366
+ {
5367
+ "name": "col-5"
5368
+ },
5369
+ {
5370
+ "name": "col-6"
4856
5371
  }
4857
5372
  ],
4858
5373
  "source": {
@@ -5524,6 +6039,93 @@
5524
6039
  "symbol": "default"
5525
6040
  }
5526
6041
  },
6042
+ {
6043
+ "name": "summary-grid-item",
6044
+ "description": "A summary bar item is a piece of information to be displayed in `bento-summary-bar` component",
6045
+ "attributes": [
6046
+ {
6047
+ "name": "copy",
6048
+ "description": "Text to copy to the clipboard",
6049
+ "value": {
6050
+ "kind": "expression",
6051
+ "type": "string"
6052
+ },
6053
+ "default": "undefined"
6054
+ },
6055
+ {
6056
+ "name": "itemType",
6057
+ "description": "Applies styling based on content type",
6058
+ "value": {
6059
+ "kind": "expression",
6060
+ "type": "SummaryGridItemType"
6061
+ },
6062
+ "default": "SummaryGridItemType.CUSTOM"
6063
+ },
6064
+ {
6065
+ "name": "infoIconTooltipText",
6066
+ "description": "Text showed in the info-icon tooltip on hover",
6067
+ "value": {
6068
+ "kind": "expression",
6069
+ "type": "string"
6070
+ },
6071
+ "default": "null"
6072
+ },
6073
+ {
6074
+ "name": "title",
6075
+ "required": true,
6076
+ "description": "Text used as a title",
6077
+ "value": {
6078
+ "kind": "expression",
6079
+ "type": "string"
6080
+ }
6081
+ },
6082
+ {
6083
+ "name": "fitContent",
6084
+ "description": "The width of `summary-grid-item` fits its content",
6085
+ "value": {
6086
+ "kind": "expression",
6087
+ "type": "boolean"
6088
+ },
6089
+ "default": "false"
6090
+ },
6091
+ {
6092
+ "name": "size",
6093
+ "description": "Defines the size of the `summary-grid-item` text content",
6094
+ "value": {
6095
+ "kind": "expression",
6096
+ "type": "BentoSummaryGridItemSize"
6097
+ },
6098
+ "default": "BentoSummaryGridItemSize.SMALL"
6099
+ },
6100
+ {
6101
+ "name": "trendDirection",
6102
+ "description": "Defines the color of trend label",
6103
+ "value": {
6104
+ "kind": "expression",
6105
+ "type": "BentoSummaryGridItemTrendDirection"
6106
+ },
6107
+ "default": "BentoSummaryGridItemTrendDirection.POSITIVE"
6108
+ },
6109
+ {
6110
+ "name": "trend",
6111
+ "description": "Shows colored trend label next to text content",
6112
+ "value": {
6113
+ "kind": "expression",
6114
+ "type": "string"
6115
+ },
6116
+ "default": "null"
6117
+ }
6118
+ ],
6119
+ "slots": [
6120
+ {
6121
+ "name": "default"
6122
+ }
6123
+ ],
6124
+ "source": {
6125
+ "module": "./src/components/summary-grid/components/summary-grid-item/summary-grid-item.vue",
6126
+ "symbol": "default"
6127
+ }
6128
+ },
5527
6129
  {
5528
6130
  "name": "tab",
5529
6131
  "description": "",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adyen/bento-vue2",
3
- "version": "0.7.1",
3
+ "version": "0.8.0",
4
4
  "description": "Adyen Bento Vue2 components",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
@@ -50,7 +50,7 @@
50
50
  "url": "git@github.com:Adyen/bento.git"
51
51
  },
52
52
  "dependencies": {
53
- "@adyen/bento-design-tokens": "0.4.5",
53
+ "@adyen/bento-design-tokens": "0.4.6",
54
54
  "@adyen/ui-assets-flag-icons": "1.2.0",
55
55
  "@adyen/ui-assets-icons-16": "3.1.0",
56
56
  "@adyen/ui-assets-payment-method-icons": "5.2.0",