@aivenio/aquarium 1.38.1 → 1.39.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 (20) hide show
  1. package/README.md +2 -1
  2. package/dist/_variables.scss +1 -1
  3. package/dist/atoms.cjs +1 -560
  4. package/dist/atoms.mjs +1 -560
  5. package/dist/src/molecules/Combobox/Combobox.js +4 -2
  6. package/dist/src/molecules/Grid/Grid.d.ts +1 -2
  7. package/dist/src/molecules/Grid/Grid.js +2 -1
  8. package/dist/src/molecules/Input/Input.js +3 -2
  9. package/dist/src/molecules/List/List.js +2 -2
  10. package/dist/src/molecules/Section/Section.js +2 -2
  11. package/dist/src/molecules/Toast/Toast.d.ts +1 -0
  12. package/dist/src/molecules/Toast/Toast.js +21 -6
  13. package/dist/system.cjs +35 -573
  14. package/dist/system.mjs +33 -572
  15. package/dist/tokens.json +0 -560
  16. package/dist/tsconfig.module.tsbuildinfo +1 -1
  17. package/dist/types/designTokens.d.ts +1 -1
  18. package/package.json +3 -7
  19. package/dist/_variables_timescale.scss +0 -174
  20. package/dist/styles_timescaledb.css +0 -2861
package/README.md CHANGED
@@ -30,6 +30,7 @@ Implementation of Aiven Aquarium design system, released as an npm package. Quic
30
30
  )
31
31
  )
32
32
  ```
33
+
33
34
  - If you encounter problems resolving EcmaScript modules disable "fullySpecified" mode using this Webpack config:
34
35
  ```module.exports = {
35
36
  webpack: {
@@ -130,7 +131,7 @@ Storybook is deployed to Cloudflare Pages everytime new code is merged to main.
130
131
 
131
132
  #### How to build Aquarium package locally
132
133
 
133
- - run `npm run build:ds`
134
+ - run `npm run build`
134
135
  - see `dist` for the built code
135
136
 
136
137
  #### How to create a release
package/dist/_variables.scss CHANGED
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Thu, 14 Sep 2023 07:13:40 GMT
3
+ // Generated on Fri, 22 Sep 2023 07:20:15 GMT
4
4
 
5
5
  $border-radius-none: 0px !default;
6
6
  $border-radius-sm: 0.125rem !default;
package/dist/atoms.cjs CHANGED
@@ -3836,566 +3836,6 @@ var require_tokens = __commonJS({
3836
3836
  "tokens.json"(exports, module2) {
3837
3837
  module2.exports = {
3838
3838
  themes: {
3839
- timescale: {
3840
- colors: {
3841
- "error-100": "#aa0000",
3842
- "error-90": "#b90000",
3843
- "error-80": "#c50001",
3844
- "error-70": "#d80005",
3845
- "error-60": "#e70000",
3846
- "error-50": "#e62728",
3847
- "error-40": "#e0504f",
3848
- "error-30": "#ed7975",
3849
- "error-20": "#ffadb3",
3850
- "error-10": "#ffcbd2",
3851
- "error-5": "#fee8e7",
3852
- "error-0": "#fef2f1",
3853
- "warning-100": "#fe6d00",
3854
- "warning-90": "#ff9003",
3855
- "warning-80": "#fd9f00",
3856
- "warning-70": "#ffb300",
3857
- "warning-60": "#ffc107",
3858
- "warning-50": "#fdc926",
3859
- "warning-40": "#fdd44d",
3860
- "warning-30": "#fddf81",
3861
- "warning-20": "#feebb2",
3862
- "warning-10": "#fff2cd",
3863
- "warning-5": "#fff8ea",
3864
- "warning-0": "#fffdf9",
3865
- "success-100": "#006f00",
3866
- "success-90": "#008e00",
3867
- "success-80": "#009f00",
3868
- "success-70": "#00b300",
3869
- "success-60": "#00c300",
3870
- "success-50": "#40ce37",
3871
- "success-40": "#60db57",
3872
- "success-30": "#89eb80",
3873
- "success-20": "#afffa7",
3874
- "success-10": "#cbffc9",
3875
- "success-5": "#ecf7ed",
3876
- "success-0": "#f5faf5",
3877
- "info-100": "#02569a",
3878
- "info-90": "#0174ba",
3879
- "info-80": "#0788d1",
3880
- "info-70": "#0399e3",
3881
- "info-60": "#02a8f3",
3882
- "info-50": "#28b4f4",
3883
- "info-40": "#4cc2f7",
3884
- "info-30": "#7fd1f7",
3885
- "info-20": "#b4e5fb",
3886
- "info-10": "#e0f5fe",
3887
- "info-5": "#effaff",
3888
- "info-0": "#f9fdff",
3889
- "grey-100": "#19191d",
3890
- "grey-90": "#292a31",
3891
- "grey-80": "#3a3a44",
3892
- "grey-70": "#4a4b57",
3893
- "grey-60": "#5a5b6a",
3894
- "grey-50": "#787885",
3895
- "grey-40": "#9696a0",
3896
- "grey-30": "#b4b4bb",
3897
- "grey-20": "#d2d2d6",
3898
- "grey-10": "#e1e1e3",
3899
- "grey-5": "#ededf0",
3900
- "grey-0": "#f7f7fa",
3901
- "secondary-100": "#e11d16",
3902
- "secondary-90": "#eb4610",
3903
- "secondary-80": "#f3580d",
3904
- "secondary-70": "#f96a02",
3905
- "secondary-60": "#ff7700",
3906
- "secondary-50": "#fc871a",
3907
- "secondary-40": "#fb9a3e",
3908
- "secondary-30": "#fab26e",
3909
- "secondary-20": "#f8c99c",
3910
- "secondary-10": "#fee8d0",
3911
- "secondary-5": "#fff3e8",
3912
- "secondary-0": "#fffbf8",
3913
- "primary-100": "#02569a",
3914
- "primary-90": "#0174ba",
3915
- "primary-80": "#0788d1",
3916
- "primary-70": "#0399e3",
3917
- "primary-60": "#02a8f3",
3918
- "primary-50": "#28b4f4",
3919
- "primary-40": "#4cc2f7",
3920
- "primary-30": "#7fd1f7",
3921
- "primary-20": "#b4e5fb",
3922
- "primary-10": "#e0f5fe",
3923
- "primary-5": "#effaff",
3924
- "primary-0": "#f9fdff"
3925
- },
3926
- typography: {
3927
- sizes: [
3928
- {
3929
- name: "large-heading",
3930
- className: "typography-large-heading",
3931
- style: {
3932
- fontFamily: "Inter",
3933
- fontSize: "32px",
3934
- fontWeight: 700,
3935
- fontStyle: "normal",
3936
- lineHeight: 1.375,
3937
- textTransform: "none"
3938
- },
3939
- fontPostScriptName: "Inter-Bold"
3940
- },
3941
- {
3942
- name: "heading",
3943
- className: "typography-heading",
3944
- style: {
3945
- fontFamily: "Inter",
3946
- fontSize: "24px",
3947
- fontWeight: 700,
3948
- fontStyle: "normal",
3949
- lineHeight: 1.375,
3950
- textTransform: "none"
3951
- },
3952
- fontPostScriptName: "Inter-Bold"
3953
- },
3954
- {
3955
- name: "subheading",
3956
- className: "typography-subheading",
3957
- style: {
3958
- fontFamily: "Inter",
3959
- fontSize: "20px",
3960
- fontWeight: 600,
3961
- fontStyle: "normal",
3962
- lineHeight: 1.375,
3963
- textTransform: "none"
3964
- },
3965
- fontPostScriptName: "Inter-Bold"
3966
- },
3967
- {
3968
- name: "large-strong",
3969
- className: "typography-large-strong",
3970
- style: {
3971
- fontFamily: "Inter",
3972
- fontSize: "20px",
3973
- fontWeight: 600,
3974
- fontStyle: "normal",
3975
- lineHeight: 1.58,
3976
- textTransform: "none"
3977
- },
3978
- fontPostScriptName: "Inter-SemiBold"
3979
- },
3980
- {
3981
- name: "large",
3982
- className: "typography-large",
3983
- style: {
3984
- fontFamily: "Inter",
3985
- fontSize: "20px",
3986
- fontWeight: 500,
3987
- fontStyle: "normal",
3988
- lineHeight: 1.58,
3989
- textTransform: "none"
3990
- },
3991
- fontPostScriptName: "Inter-SemiBold"
3992
- },
3993
- {
3994
- name: "default-strong",
3995
- className: "typography-default-strong",
3996
- style: {
3997
- fontFamily: "Inter",
3998
- fontSize: "16px",
3999
- fontWeight: 500,
4000
- fontStyle: "normal",
4001
- lineHeight: 1.5,
4002
- textTransform: "none"
4003
- },
4004
- fontPostScriptName: "Inter-SemiBold"
4005
- },
4006
- {
4007
- name: "default",
4008
- className: "typography-default",
4009
- style: {
4010
- fontFamily: "Inter",
4011
- fontSize: "16px",
4012
- fontWeight: 400,
4013
- fontStyle: "normal",
4014
- lineHeight: 1.5,
4015
- textTransform: "none"
4016
- },
4017
- fontPostScriptName: null
4018
- },
4019
- {
4020
- name: "small-strong",
4021
- className: "typography-small-strong",
4022
- style: {
4023
- fontFamily: "Inter",
4024
- fontSize: "14px",
4025
- fontWeight: 500,
4026
- fontStyle: "normal",
4027
- lineHeight: 1.42,
4028
- textTransform: "none"
4029
- },
4030
- fontPostScriptName: "Inter-SemiBold"
4031
- },
4032
- {
4033
- name: "small",
4034
- className: "typography-small",
4035
- style: {
4036
- fontFamily: "Inter",
4037
- fontSize: "14px",
4038
- fontWeight: 400,
4039
- fontStyle: "normal",
4040
- lineHeight: 1.42,
4041
- textTransform: "none"
4042
- },
4043
- fontPostScriptName: null
4044
- },
4045
- {
4046
- name: "caption",
4047
- className: "typography-caption",
4048
- style: {
4049
- fontFamily: "Inter",
4050
- fontSize: "12px",
4051
- fontWeight: 400,
4052
- fontStyle: "normal",
4053
- lineHeight: 1.26,
4054
- textTransform: "none"
4055
- },
4056
- fontPostScriptName: null
4057
- },
4058
- {
4059
- name: "caption-small",
4060
- className: "typography-caption-small",
4061
- style: {
4062
- fontFamily: "Inter",
4063
- fontSize: "10px",
4064
- fontWeight: 400,
4065
- fontStyle: "normal",
4066
- lineHeight: 1.2,
4067
- textTransform: "none"
4068
- },
4069
- fontPostScriptName: null
4070
- },
4071
- {
4072
- name: "caption-default",
4073
- className: "typography-caption-default",
4074
- style: {
4075
- fontFamily: "Inter",
4076
- fontSize: "12px",
4077
- fontWeight: 400,
4078
- fontStyle: "normal",
4079
- lineHeight: 1.26,
4080
- letterSpacing: 0,
4081
- textTransform: "none"
4082
- },
4083
- fontPostScriptName: null
4084
- },
4085
- {
4086
- name: "overline-small",
4087
- className: "typography-overline-small",
4088
- style: {
4089
- fontFamily: "Inter",
4090
- fontSize: "10px",
4091
- fontWeight: 400,
4092
- fontStyle: "normal",
4093
- lineHeight: 1,
4094
- letterSpacing: 0,
4095
- textTransform: "uppercase"
4096
- },
4097
- fontPostScriptName: null
4098
- },
4099
- {
4100
- name: "overline-default",
4101
- className: "typography-overline-default",
4102
- style: {
4103
- fontFamily: "Inter",
4104
- fontSize: "12px",
4105
- fontWeight: 400,
4106
- fontStyle: "normal",
4107
- lineHeight: 1,
4108
- letterSpacing: 0,
4109
- textTransform: "uppercase"
4110
- },
4111
- fontPostScriptName: null
4112
- },
4113
- {
4114
- name: "button-small",
4115
- className: "typography-button-small",
4116
- style: {
4117
- fontFamily: "Inter",
4118
- fontSize: "12px",
4119
- fontWeight: 500,
4120
- fontStyle: "normal",
4121
- lineHeight: 1,
4122
- letterSpacing: 0,
4123
- textTransform: "none"
4124
- },
4125
- fontPostScriptName: "Inter-Medium"
4126
- },
4127
- {
4128
- name: "button-medium",
4129
- className: "typography-button-medium",
4130
- style: {
4131
- fontFamily: "Inter",
4132
- fontSize: "14px",
4133
- fontWeight: 400,
4134
- fontStyle: "normal",
4135
- lineHeight: 1,
4136
- letterSpacing: 0,
4137
- textTransform: "none"
4138
- },
4139
- fontPostScriptName: "Inter-SemiBold"
4140
- },
4141
- {
4142
- name: "button-large",
4143
- className: "typography-button-large",
4144
- style: {
4145
- fontFamily: "Inter",
4146
- fontSize: "16px",
4147
- fontWeight: 500,
4148
- fontStyle: "normal",
4149
- lineHeight: 1.5,
4150
- letterSpacing: 0,
4151
- textTransform: "none"
4152
- },
4153
- fontPostScriptName: "Inter-Medium"
4154
- },
4155
- {
4156
- name: "body-small",
4157
- className: "typography-body-small",
4158
- style: {
4159
- fontFamily: "Inter",
4160
- fontSize: "14px",
4161
- fontWeight: 400,
4162
- fontStyle: "normal",
4163
- lineHeight: 1.43,
4164
- letterSpacing: 0,
4165
- textTransform: "none"
4166
- },
4167
- fontPostScriptName: null
4168
- },
4169
- {
4170
- name: "body-small-medium",
4171
- className: "typography-body-small-medium",
4172
- style: {
4173
- fontFamily: "Inter",
4174
- fontSize: "14px",
4175
- fontWeight: 500,
4176
- fontStyle: "normal",
4177
- lineHeight: 1.43,
4178
- letterSpacing: 0,
4179
- textTransform: "none"
4180
- },
4181
- fontPostScriptName: "Inter-SemiBold"
4182
- },
4183
- {
4184
- name: "body-default",
4185
- className: "typography-body-default",
4186
- style: {
4187
- fontFamily: "Inter",
4188
- fontSize: "16px",
4189
- fontWeight: 400,
4190
- fontStyle: "normal",
4191
- lineHeight: 1.5,
4192
- letterSpacing: 0,
4193
- textTransform: "none"
4194
- },
4195
- fontPostScriptName: null
4196
- },
4197
- {
4198
- name: "body-default-medium",
4199
- className: "typography-body-default-medium",
4200
- style: {
4201
- fontFamily: "Inter",
4202
- fontSize: "16px",
4203
- fontWeight: 500,
4204
- fontStyle: "normal",
4205
- lineHeight: 1.5,
4206
- letterSpacing: 0,
4207
- textTransform: "none"
4208
- },
4209
- fontPostScriptName: "Inter-SemiBold"
4210
- },
4211
- {
4212
- name: "body-large",
4213
- className: "typography-body-large",
4214
- style: {
4215
- fontFamily: "Inter",
4216
- fontSize: "20px",
4217
- fontWeight: 400,
4218
- fontStyle: "normal",
4219
- lineHeight: 1.58,
4220
- letterSpacing: 0,
4221
- textTransform: "none"
4222
- },
4223
- fontPostScriptName: null
4224
- },
4225
- {
4226
- name: "body-large-medium",
4227
- className: "typography-body-large-medium",
4228
- style: {
4229
- fontFamily: "Inter",
4230
- fontSize: "20px",
4231
- fontWeight: 400,
4232
- fontStyle: "normal",
4233
- lineHeight: 1.2,
4234
- letterSpacing: 0,
4235
- textTransform: "none"
4236
- },
4237
- fontPostScriptName: "Inter-SemiBold"
4238
- },
4239
- {
4240
- name: "heading-large",
4241
- className: "typography-heading-large",
4242
- style: {
4243
- fontFamily: "Inter",
4244
- fontSize: "20px",
4245
- fontWeight: 700,
4246
- fontStyle: "normal",
4247
- lineHeight: 1.5,
4248
- letterSpacing: 0.15,
4249
- textTransform: "none"
4250
- },
4251
- fontPostScriptName: "Inter-Bold"
4252
- },
4253
- {
4254
- name: "heading-xl",
4255
- className: "typography-heading-xl",
4256
- style: {
4257
- fontFamily: "Inter",
4258
- fontSize: "24px",
4259
- fontWeight: 700,
4260
- fontStyle: "normal",
4261
- lineHeight: 1.5,
4262
- letterSpacing: 0,
4263
- textTransform: "none"
4264
- },
4265
- fontPostScriptName: "Inter-Bold"
4266
- },
4267
- {
4268
- name: "heading-2xl",
4269
- className: "typography-heading-2xl",
4270
- style: {
4271
- fontFamily: "Inter",
4272
- fontSize: "34px",
4273
- fontWeight: 700,
4274
- fontStyle: "normal",
4275
- lineHeight: 1.28,
4276
- letterSpacing: 0,
4277
- textTransform: "none"
4278
- },
4279
- fontPostScriptName: "Inter-Bold"
4280
- },
4281
- {
4282
- name: "heading-3xl",
4283
- className: "typography-heading-3xl",
4284
- style: {
4285
- fontFamily: "Inter",
4286
- fontSize: "48px",
4287
- fontWeight: 700,
4288
- fontStyle: "normal",
4289
- lineHeight: 1.24,
4290
- letterSpacing: -0.48,
4291
- textTransform: "none"
4292
- },
4293
- fontPostScriptName: "Inter-Bold"
4294
- },
4295
- {
4296
- name: "heading-4xl",
4297
- className: "typography-heading-4xl",
4298
- style: {
4299
- fontFamily: "Inter",
4300
- fontSize: "60px",
4301
- fontWeight: 700,
4302
- fontStyle: "normal",
4303
- lineHeight: 1.2,
4304
- letterSpacing: -1.5,
4305
- textTransform: "none"
4306
- },
4307
- fontPostScriptName: "Inter-Bold"
4308
- },
4309
- {
4310
- name: "heading-5xl",
4311
- className: "typography-heading-5xl",
4312
- style: {
4313
- fontFamily: "Inter",
4314
- fontSize: "76px",
4315
- fontWeight: 700,
4316
- fontStyle: "normal",
4317
- lineHeight: 1.2,
4318
- letterSpacing: -1.98,
4319
- textTransform: "none"
4320
- },
4321
- fontPostScriptName: "Inter-Bold"
4322
- }
4323
- ]
4324
- },
4325
- elevations: {
4326
- "24dp": "0px 24px 48px rgba(90, 91, 106, 0.08), 0px 12px 24px rgba(58, 58, 68, 0.08)",
4327
- "16dp": "0px 16px 32px rgba(90, 91, 106, 0.12), 0px 8px 16px rgba(58, 58, 68, 0.12)",
4328
- "8dp": "0px 8px 16px rgba(90, 91, 106, 0.16), 0px 4px 8px rgba(58, 58, 68, 0.16)",
4329
- "4dp": "0px 4px 8px rgba(90, 91, 106, 0.20), 0px 2px 4px rgba(58, 58, 68, 0.20)",
4330
- "2dp": "0px 2px 4px rgba(90, 91, 106, 0.24), 0px 1px 2px rgba(58, 58, 68, 0.24)"
4331
- },
4332
- spacing: {
4333
- layout01: {
4334
- px: 16,
4335
- rem: 1
4336
- },
4337
- layout02: {
4338
- px: 24,
4339
- rem: 1.5
4340
- },
4341
- layout03: {
4342
- px: 32,
4343
- rem: 2
4344
- },
4345
- layout04: {
4346
- px: 48,
4347
- rem: 3
4348
- },
4349
- layout05: {
4350
- px: 64,
4351
- rem: 4
4352
- },
4353
- layout06: {
4354
- px: 96,
4355
- rem: 6
4356
- },
4357
- layout07: {
4358
- px: 160,
4359
- rem: 10
4360
- },
4361
- spacing01: {
4362
- px: 2,
4363
- rem: 0.125
4364
- },
4365
- spacing02: {
4366
- px: 4,
4367
- rem: 0.25
4368
- },
4369
- spacing03: {
4370
- px: 8,
4371
- rem: 0.5
4372
- },
4373
- spacing04: {
4374
- px: 12,
4375
- rem: 0.75
4376
- },
4377
- spacing05: {
4378
- px: 16,
4379
- rem: 1
4380
- },
4381
- spacing06: {
4382
- px: 24,
4383
- rem: 1.5
4384
- },
4385
- spacing07: {
4386
- px: 32,
4387
- rem: 2
4388
- },
4389
- spacing08: {
4390
- px: 40,
4391
- rem: 2.5
4392
- },
4393
- spacing09: {
4394
- px: 48,
4395
- rem: 3
4396
- }
4397
- }
4398
- },
4399
3839
  aiven: {
4400
3840
  colors: {
4401
3841
  "error-100": "#aa0000",
@@ -7493,6 +6933,7 @@ var GridComponent = Tailwindify(
7493
6933
  }
7494
6934
  );
7495
6935
  Grid.Item = GridItem;
6936
+ Grid.Item.displayName = "Grid.Item";
7496
6937
 
7497
6938
  // src/atoms/InputGroup/InputGroup.tsx
7498
6939
  var gridColumnStyles = {