@wireapp/react-ui-kit 8.1.0 → 8.4.0

package/src/Identity/colors-v2.js.map

@@ -1 +1 @@
-{"version":3,"sources":["colors-v2.ts"],"names":["BASE_LIGHT_COLOR","BLUE","GREEN","PETROL","PURPLE","RED","AMBER","BASE_DARK_COLOR","LIGHT_BLUE","BLUE_LIGHT_50","BLUE_LIGHT_100","BLUE_LIGHT_200","BLUE_LIGHT_300","BLUE_LIGHT_400","BLUE_LIGHT_500","BLUE_LIGHT_600","BLUE_LIGHT_700","BLUE_LIGHT_800","BLUE_LIGHT_900","DARK_BLUE","BLUE_DARK_50","BLUE_DARK_100","BLUE_DARK_200","BLUE_DARK_300","BLUE_DARK_400","BLUE_DARK_500","BLUE_DARK_600","BLUE_DARK_700","BLUE_DARK_800","BLUE_DARK_900","LIGHT_GREEN","GREEN_LIGHT_50","GREEN_LIGHT_100","GREEN_LIGHT_200","GREEN_LIGHT_300","GREEN_LIGHT_400","GREEN_LIGHT_500","GREEN_LIGHT_600","GREEN_LIGHT_700","GREEN_LIGHT_800","GREEN_LIGHT_900","DARK_GREEN","GREEN_DARK_50","GREEN_DARK_100","GREEN_DARK_200","GREEN_DARK_300","GREEN_DARK_400","GREEN_DARK_500","GREEN_DARK_600","GREEN_DARK_700","GREEN_DARK_800","GREEN_DARK_900","LIGHT_PETROL","PETROL_LIGHT_50","PETROL_LIGHT_100","PETROL_LIGHT_200","PETROL_LIGHT_300","PETROL_LIGHT_400","PETROL_LIGHT_500","PETROL_LIGHT_600","PETROL_LIGHT_700","PETROL_LIGHT_800","PETROL_LIGHT_900","DARK_PETROL","PETROL_DARK_50","PETROL_DARK_100","PETROL_DARK_200","PETROL_DARK_300","PETROL_DARK_400","PETROL_DARK_500","PETROL_DARK_600","PETROL_DARK_700","PETROL_DARK_800","PETROL_DARK_900","LIGHT_PURPLE","PURPLE_LIGHT_50","PURPLE_LIGHT_100","PURPLE_LIGHT_200","PURPLE_LIGHT_300","PURPLE_LIGHT_400","PURPLE_LIGHT_500","PURPLE_LIGHT_600","PURPLE_LIGHT_700","PURPLE_LIGHT_800","PURPLE_LIGHT_900","DARK_PURPLE","PURPLE_DARK_50","PURPLE_DARK_100","PURPLE_DARK_200","PURPLE_DARK_300","PURPLE_DARK_400","PURPLE_DARK_500","PURPLE_DARK_600","PURPLE_DARK_700","PURPLE_DARK_800","PURPLE_DARK_900","LIGHT_RED","RED_LIGHT_50","RED_LIGHT_100","RED_LIGHT_200","RED_LIGHT_300","RED_LIGHT_400","RED_LIGHT_500","RED_LIGHT_600","RED_LIGHT_700","RED_LIGHT_800","RED_LIGHT_900","DARK_RED","RED_DARK_50","RED_DARK_100","RED_DARK_200","RED_DARK_300","RED_DARK_400","RED_DARK_500","RED_DARK_600","RED_DARK_700","RED_DARK_800","RED_DARK_900","LIGHT_AMBER","AMBER_LIGHT_50","AMBER_LIGHT_100","AMBER_LIGHT_200","AMBER_LIGHT_300","AMBER_LIGHT_400","AMBER_LIGHT_500","AMBER_LIGHT_600","AMBER_LIGHT_700","AMBER_LIGHT_800","AMBER_LIGHT_900","DARK_AMBER","AMBER_DARK_50","AMBER_DARK_100","AMBER_DARK_200","AMBER_DARK_300","AMBER_DARK_400","AMBER_DARK_500","AMBER_DARK_600","AMBER_DARK_700","AMBER_DARK_800","AMBER_DARK_900","DARK","LIGHT","GRAYS","GRAY_10","GRAY_20","GRAY_30","GRAY_40","GRAY_50","GRAY_60","GRAY_70","GRAY_80","GRAY_90","GRAY_95","GRAY_100","COLOR","BLACK","WHITE"],"mappings":"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","sourcesContent":["/*\n * Wire\n * Copyright (C) 2022 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\nexport const BASE_LIGHT_COLOR: Record<string, string> = {\n  BLUE: '#0667c8',\n  GREEN: '#1d7833',\n  PETROL: '#01718e',\n  PURPLE: '#8944ab',\n  RED: '#c20013',\n  AMBER: '#a25915',\n};\n\nexport const BASE_DARK_COLOR: Record<string, string> = {\n  BLUE: '#54a6ff',\n  GREEN: '#30db5b',\n  PETROL: '#5de6ff',\n  PURPLE: '#da8fff',\n  RED: '#ff7770',\n  AMBER: '#ffd426',\n};\n\nconst LIGHT_BLUE: Record<string, string> = {\n  BLUE_LIGHT_50: '#e7f0fa',\n  BLUE_LIGHT_100: '#cde1f4',\n  BLUE_LIGHT_200: '#9bc2e9',\n  BLUE_LIGHT_300: '#6aa4de',\n  BLUE_LIGHT_400: '#3885d3',\n  BLUE_LIGHT_500: BASE_LIGHT_COLOR.BLUE,\n  BLUE_LIGHT_600: '#0552a0',\n  BLUE_LIGHT_700: '#043e78',\n  BLUE_LIGHT_800: '#022950',\n  BLUE_LIGHT_900: '#19324d',\n};\n\nconst DARK_BLUE: Record<string, string> = {\n  BLUE_DARK_50: '#eef7ff',\n  BLUE_DARK_100: '#ddedff',\n  BLUE_DARK_200: '#bbdbff',\n  BLUE_DARK_300: '#98caff',\n  BLUE_DARK_400: '#76b8ff',\n  BLUE_DARK_500: BASE_DARK_COLOR.BLUE,\n  BLUE_DARK_600: '#4385cc',\n  BLUE_DARK_700: '#326499',\n  BLUE_DARK_800: '#224266',\n  BLUE_DARK_900: '#19324d',\n};\n\nconst LIGHT_GREEN: Record<string, string> = {\n  GREEN_LIGHT_50: '#e8f1ea',\n  GREEN_LIGHT_100: '#d2e4d6',\n  GREEN_LIGHT_200: '#a5c9ad',\n  GREEN_LIGHT_300: '#77ae85',\n  GREEN_LIGHT_400: '#4a935c',\n  GREEN_LIGHT_500: BASE_LIGHT_COLOR.GREEN,\n  GREEN_LIGHT_600: '#176029',\n  GREEN_LIGHT_700: '#11481f',\n  GREEN_LIGHT_800: '#0c3014',\n  GREEN_LIGHT_900: '#0e421b',\n};\n\nconst DARK_GREEN: Record<string, string> = {\n  GREEN_DARK_50: '#ebfcef',\n  GREEN_DARK_100: '#d6f8de',\n  GREEN_DARK_200: '#acf1bd',\n  GREEN_DARK_300: '#83e99d',\n  GREEN_DARK_400: '#59e27c',\n  GREEN_DARK_500: BASE_DARK_COLOR.GREEN,\n  GREEN_DARK_600: '#26af49',\n  GREEN_DARK_700: '#1d8337',\n  GREEN_DARK_800: '#135824',\n  GREEN_DARK_900: '#0e421b',\n};\n\nconst LIGHT_PETROL: Record<string, string> = {\n  PETROL_LIGHT_50: '#e5f1f3',\n  PETROL_LIGHT_100: '#cce2e7',\n  PETROL_LIGHT_200: '#99c6d0',\n  PETROL_LIGHT_300: '#67a9b8',\n  PETROL_LIGHT_400: '#348da1',\n  PETROL_LIGHT_500: BASE_LIGHT_COLOR.PETROL,\n  PETROL_LIGHT_600: '#015a6e',\n  PETROL_LIGHT_700: '#014352',\n  PETROL_LIGHT_800: '#002d37',\n  PETROL_LIGHT_900: '#1c454d',\n};\n\nconst DARK_PETROL: Record<string, string> = {\n  PETROL_DARK_50: '#effdff',\n  PETROL_DARK_100: '#dffaff',\n  PETROL_DARK_200: '#bef5ff',\n  PETROL_DARK_300: '#9ef0ff',\n  PETROL_DARK_400: '#7debff',\n  PETROL_DARK_500: BASE_DARK_COLOR.PETROL,\n  PETROL_DARK_600: '#4Ab8cc',\n  PETROL_DARK_700: '#388a99',\n  PETROL_DARK_800: '#255c66',\n  PETROL_DARK_900: '#1c454d',\n};\n\nconst LIGHT_PURPLE: Record<string, string> = {\n  PURPLE_LIGHT_50: '#f4edf7',\n  PURPLE_LIGHT_100: '#e7daee',\n  PURPLE_LIGHT_200: '#d0b4dd',\n  PURPLE_LIGHT_300: '#b88fcd',\n  PURPLE_LIGHT_400: '#a169bc',\n  PURPLE_LIGHT_500: BASE_LIGHT_COLOR.PURPLE,\n  PURPLE_LIGHT_600: '#6e3689',\n  PURPLE_LIGHT_700: '#522967',\n  PURPLE_LIGHT_800: '#371b44',\n  PURPLE_LIGHT_900: '#412b4d',\n};\n\nconst DARK_PURPLE: Record<string, string> = {\n  PURPLE_DARK_50: '#fcf4ff',\n  PURPLE_DARK_100: '#f8e9ff',\n  PURPLE_DARK_200: '#f0d2ff',\n  PURPLE_DARK_300: '#e9bcff',\n  PURPLE_DARK_400: '#e1a5ff',\n  PURPLE_DARK_500: BASE_DARK_COLOR.PURPLE,\n  PURPLE_DARK_600: '#ae72cc',\n  PURPLE_DARK_700: '#835699',\n  PURPLE_DARK_800: '#573966',\n  PURPLE_DARK_900: '#412b4d',\n};\n\nconst LIGHT_RED: Record<string, string> = {\n  RED_LIGHT_50: '#f9e6e8',\n  RED_LIGHT_100: '#f3ccd0',\n  RED_LIGHT_200: '#e799a1',\n  RED_LIGHT_300: '#da6671',\n  RED_LIGHT_400: '#ce3342',\n  RED_LIGHT_500: BASE_LIGHT_COLOR.RED,\n  RED_LIGHT_600: '#9b000f',\n  RED_LIGHT_700: '#74000b',\n  RED_LIGHT_800: '#4e0008',\n  RED_LIGHT_900: '#4d2422',\n};\n\nconst DARK_RED: Record<string, string> = {\n  RED_DARK_50: '#fff2f1',\n  RED_DARK_100: '#ffe4e2',\n  RED_DARK_200: '#ffc9c6',\n  RED_DARK_300: '#ffada9',\n  RED_DARK_400: '#ff928d',\n  RED_DARK_500: BASE_DARK_COLOR.RED,\n  RED_DARK_600: '#cc5f5a',\n  RED_DARK_700: '#994743',\n  RED_DARK_800: '#66302d',\n  RED_DARK_900: '#4d2422',\n};\n\nconst LIGHT_AMBER: Record<string, string> = {\n  AMBER_LIGHT_50: '#f6eee8',\n  AMBER_LIGHT_100: '#ecded0',\n  AMBER_LIGHT_200: '#dabda1',\n  AMBER_LIGHT_300: '#c79b73',\n  AMBER_LIGHT_400: '#b57A44',\n  AMBER_LIGHT_500: BASE_LIGHT_COLOR.AMBER,\n  AMBER_LIGHT_600: '#824711',\n  AMBER_LIGHT_700: '#61350d',\n  AMBER_LIGHT_800: '#412408',\n  AMBER_LIGHT_900: '#201204',\n};\n\nconst DARK_AMBER: Record<string, string> = {\n  AMBER_DARK_50: '#fffbea',\n  AMBER_DARK_100: '#fff6d4',\n  AMBER_DARK_200: '#ffeea8',\n  AMBER_DARK_300: '#ffe57d',\n  AMBER_DARK_400: '#ffdd51',\n  AMBER_DARK_500: BASE_DARK_COLOR.AMBER,\n  AMBER_DARK_600: '#ccaa1e',\n  AMBER_DARK_700: '#997f17',\n  AMBER_DARK_800: '#66550f',\n  AMBER_DARK_900: '#4d400b',\n};\n\nconst DARK: Record<string, string> = {\n  ...DARK_BLUE,\n  ...DARK_GREEN,\n  ...DARK_PETROL,\n  ...DARK_PURPLE,\n  ...DARK_RED,\n  ...DARK_AMBER,\n};\n\nconst LIGHT: Record<string, string> = {\n  ...LIGHT_BLUE,\n  ...LIGHT_GREEN,\n  ...LIGHT_PETROL,\n  ...LIGHT_PURPLE,\n  ...LIGHT_RED,\n  ...LIGHT_AMBER,\n};\n\nconst GRAYS: Record<string, string> = {\n  GRAY_10: '#fafafa',\n  GRAY_20: '#edeff0',\n  GRAY_30: '#e5e8ea',\n  GRAY_40: '#dce0e3',\n  GRAY_50: '#cbced1',\n  GRAY_60: '#9fa1a7',\n  GRAY_70: '#676b71',\n  GRAY_80: '#54585f',\n  GRAY_90: '#34373d',\n  GRAY_95: '#26272c',\n  GRAY_100: '#17181a',\n};\n\nexport const COLOR: any = {\n  ...BASE_DARK_COLOR,\n  ...BASE_LIGHT_COLOR,\n  ...DARK,\n  ...LIGHT,\n  ...GRAYS,\n  BLACK: '#000',\n  WHITE: '#fff',\n};\n"],"file":"colors-v2.js"}
+{"version":3,"sources":["colors-v2.ts"],"names":["BASE_LIGHT_COLOR","BLUE","GREEN","PETROL","PURPLE","RED","AMBER","BASE_DARK_COLOR","LIGHT_BLUE","BLUE_LIGHT_50","BLUE_LIGHT_100","BLUE_LIGHT_200","BLUE_LIGHT_300","BLUE_LIGHT_400","BLUE_LIGHT_500","BLUE_LIGHT_600","BLUE_LIGHT_700","BLUE_LIGHT_800","BLUE_LIGHT_900","DARK_BLUE","BLUE_DARK_50","BLUE_DARK_100","BLUE_DARK_200","BLUE_DARK_300","BLUE_DARK_400","BLUE_DARK_500","BLUE_DARK_600","BLUE_DARK_700","BLUE_DARK_800","BLUE_DARK_900","LIGHT_GREEN","GREEN_LIGHT_50","GREEN_LIGHT_100","GREEN_LIGHT_200","GREEN_LIGHT_300","GREEN_LIGHT_400","GREEN_LIGHT_500","GREEN_LIGHT_600","GREEN_LIGHT_700","GREEN_LIGHT_800","GREEN_LIGHT_900","DARK_GREEN","GREEN_DARK_50","GREEN_DARK_100","GREEN_DARK_200","GREEN_DARK_300","GREEN_DARK_400","GREEN_DARK_500","GREEN_DARK_600","GREEN_DARK_700","GREEN_DARK_800","GREEN_DARK_900","LIGHT_PETROL","PETROL_LIGHT_50","PETROL_LIGHT_100","PETROL_LIGHT_200","PETROL_LIGHT_300","PETROL_LIGHT_400","PETROL_LIGHT_500","PETROL_LIGHT_600","PETROL_LIGHT_700","PETROL_LIGHT_800","PETROL_LIGHT_900","DARK_PETROL","PETROL_DARK_50","PETROL_DARK_100","PETROL_DARK_200","PETROL_DARK_300","PETROL_DARK_400","PETROL_DARK_500","PETROL_DARK_600","PETROL_DARK_700","PETROL_DARK_800","PETROL_DARK_900","LIGHT_PURPLE","PURPLE_LIGHT_50","PURPLE_LIGHT_100","PURPLE_LIGHT_200","PURPLE_LIGHT_300","PURPLE_LIGHT_400","PURPLE_LIGHT_500","PURPLE_LIGHT_600","PURPLE_LIGHT_700","PURPLE_LIGHT_800","PURPLE_LIGHT_900","DARK_PURPLE","PURPLE_DARK_50","PURPLE_DARK_100","PURPLE_DARK_200","PURPLE_DARK_300","PURPLE_DARK_400","PURPLE_DARK_500","PURPLE_DARK_600","PURPLE_DARK_700","PURPLE_DARK_800","PURPLE_DARK_900","LIGHT_RED","RED_LIGHT_50","RED_LIGHT_100","RED_LIGHT_200","RED_LIGHT_300","RED_LIGHT_400","RED_LIGHT_500","RED_LIGHT_600","RED_LIGHT_700","RED_LIGHT_800","RED_LIGHT_900","DARK_RED","RED_DARK_50","RED_DARK_100","RED_DARK_200","RED_DARK_300","RED_DARK_400","RED_DARK_500","RED_DARK_600","RED_DARK_700","RED_DARK_800","RED_DARK_900","LIGHT_AMBER","AMBER_LIGHT_50","AMBER_LIGHT_100","AMBER_LIGHT_200","AMBER_LIGHT_300","AMBER_LIGHT_400","AMBER_LIGHT_500","AMBER_LIGHT_600","AMBER_LIGHT_700","AMBER_LIGHT_800","AMBER_LIGHT_900","DARK_AMBER","AMBER_DARK_50","AMBER_DARK_100","AMBER_DARK_200","AMBER_DARK_300","AMBER_DARK_400","AMBER_DARK_500","AMBER_DARK_600","AMBER_DARK_700","AMBER_DARK_800","AMBER_DARK_900","DARK","LIGHT","GRAYS","GRAY_10","GRAY_20","GRAY_30","GRAY_40","GRAY_50","GRAY_60","GRAY_70","GRAY_80","GRAY_90","GRAY_95","GRAY_100","COLOR_V2","BLACK","WHITE"],"mappings":"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","sourcesContent":["/*\n * Wire\n * Copyright (C) 2022 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\nexport const BASE_LIGHT_COLOR: Record<string, string> = {\n  BLUE: '#0667c8',\n  GREEN: '#1d7833',\n  PETROL: '#01718e',\n  PURPLE: '#8944ab',\n  RED: '#c20013',\n  AMBER: '#a25915',\n};\n\nexport const BASE_DARK_COLOR: Record<string, string> = {\n  BLUE: '#54a6ff',\n  GREEN: '#30db5b',\n  PETROL: '#5de6ff',\n  PURPLE: '#da8fff',\n  RED: '#ff7770',\n  AMBER: '#ffd426',\n};\n\nconst LIGHT_BLUE: Record<string, string> = {\n  BLUE_LIGHT_50: '#e7f0fa',\n  BLUE_LIGHT_100: '#cde1f4',\n  BLUE_LIGHT_200: '#9bc2e9',\n  BLUE_LIGHT_300: '#6aa4de',\n  BLUE_LIGHT_400: '#3885d3',\n  BLUE_LIGHT_500: BASE_LIGHT_COLOR.BLUE,\n  BLUE_LIGHT_600: '#0552a0',\n  BLUE_LIGHT_700: '#043e78',\n  BLUE_LIGHT_800: '#022950',\n  BLUE_LIGHT_900: '#19324d',\n};\n\nconst DARK_BLUE: Record<string, string> = {\n  BLUE_DARK_50: '#eef7ff',\n  BLUE_DARK_100: '#ddedff',\n  BLUE_DARK_200: '#bbdbff',\n  BLUE_DARK_300: '#98caff',\n  BLUE_DARK_400: '#76b8ff',\n  BLUE_DARK_500: BASE_DARK_COLOR.BLUE,\n  BLUE_DARK_600: '#4385cc',\n  BLUE_DARK_700: '#326499',\n  BLUE_DARK_800: '#224266',\n  BLUE_DARK_900: '#19324d',\n};\n\nconst LIGHT_GREEN: Record<string, string> = {\n  GREEN_LIGHT_50: '#e8f1ea',\n  GREEN_LIGHT_100: '#d2e4d6',\n  GREEN_LIGHT_200: '#a5c9ad',\n  GREEN_LIGHT_300: '#77ae85',\n  GREEN_LIGHT_400: '#4a935c',\n  GREEN_LIGHT_500: BASE_LIGHT_COLOR.GREEN,\n  GREEN_LIGHT_600: '#176029',\n  GREEN_LIGHT_700: '#11481f',\n  GREEN_LIGHT_800: '#0c3014',\n  GREEN_LIGHT_900: '#0e421b',\n};\n\nconst DARK_GREEN: Record<string, string> = {\n  GREEN_DARK_50: '#ebfcef',\n  GREEN_DARK_100: '#d6f8de',\n  GREEN_DARK_200: '#acf1bd',\n  GREEN_DARK_300: '#83e99d',\n  GREEN_DARK_400: '#59e27c',\n  GREEN_DARK_500: BASE_DARK_COLOR.GREEN,\n  GREEN_DARK_600: '#26af49',\n  GREEN_DARK_700: '#1d8337',\n  GREEN_DARK_800: '#135824',\n  GREEN_DARK_900: '#0e421b',\n};\n\nconst LIGHT_PETROL: Record<string, string> = {\n  PETROL_LIGHT_50: '#e5f1f3',\n  PETROL_LIGHT_100: '#cce2e7',\n  PETROL_LIGHT_200: '#99c6d0',\n  PETROL_LIGHT_300: '#67a9b8',\n  PETROL_LIGHT_400: '#348da1',\n  PETROL_LIGHT_500: BASE_LIGHT_COLOR.PETROL,\n  PETROL_LIGHT_600: '#015a6e',\n  PETROL_LIGHT_700: '#014352',\n  PETROL_LIGHT_800: '#002d37',\n  PETROL_LIGHT_900: '#1c454d',\n};\n\nconst DARK_PETROL: Record<string, string> = {\n  PETROL_DARK_50: '#effdff',\n  PETROL_DARK_100: '#dffaff',\n  PETROL_DARK_200: '#bef5ff',\n  PETROL_DARK_300: '#9ef0ff',\n  PETROL_DARK_400: '#7debff',\n  PETROL_DARK_500: BASE_DARK_COLOR.PETROL,\n  PETROL_DARK_600: '#4Ab8cc',\n  PETROL_DARK_700: '#388a99',\n  PETROL_DARK_800: '#255c66',\n  PETROL_DARK_900: '#1c454d',\n};\n\nconst LIGHT_PURPLE: Record<string, string> = {\n  PURPLE_LIGHT_50: '#f4edf7',\n  PURPLE_LIGHT_100: '#e7daee',\n  PURPLE_LIGHT_200: '#d0b4dd',\n  PURPLE_LIGHT_300: '#b88fcd',\n  PURPLE_LIGHT_400: '#a169bc',\n  PURPLE_LIGHT_500: BASE_LIGHT_COLOR.PURPLE,\n  PURPLE_LIGHT_600: '#6e3689',\n  PURPLE_LIGHT_700: '#522967',\n  PURPLE_LIGHT_800: '#371b44',\n  PURPLE_LIGHT_900: '#412b4d',\n};\n\nconst DARK_PURPLE: Record<string, string> = {\n  PURPLE_DARK_50: '#fcf4ff',\n  PURPLE_DARK_100: '#f8e9ff',\n  PURPLE_DARK_200: '#f0d2ff',\n  PURPLE_DARK_300: '#e9bcff',\n  PURPLE_DARK_400: '#e1a5ff',\n  PURPLE_DARK_500: BASE_DARK_COLOR.PURPLE,\n  PURPLE_DARK_600: '#ae72cc',\n  PURPLE_DARK_700: '#835699',\n  PURPLE_DARK_800: '#573966',\n  PURPLE_DARK_900: '#412b4d',\n};\n\nconst LIGHT_RED: Record<string, string> = {\n  RED_LIGHT_50: '#f9e6e8',\n  RED_LIGHT_100: '#f3ccd0',\n  RED_LIGHT_200: '#e799a1',\n  RED_LIGHT_300: '#da6671',\n  RED_LIGHT_400: '#ce3342',\n  RED_LIGHT_500: BASE_LIGHT_COLOR.RED,\n  RED_LIGHT_600: '#9b000f',\n  RED_LIGHT_700: '#74000b',\n  RED_LIGHT_800: '#4e0008',\n  RED_LIGHT_900: '#4d2422',\n};\n\nconst DARK_RED: Record<string, string> = {\n  RED_DARK_50: '#fff2f1',\n  RED_DARK_100: '#ffe4e2',\n  RED_DARK_200: '#ffc9c6',\n  RED_DARK_300: '#ffada9',\n  RED_DARK_400: '#ff928d',\n  RED_DARK_500: BASE_DARK_COLOR.RED,\n  RED_DARK_600: '#cc5f5a',\n  RED_DARK_700: '#994743',\n  RED_DARK_800: '#66302d',\n  RED_DARK_900: '#4d2422',\n};\n\nconst LIGHT_AMBER: Record<string, string> = {\n  AMBER_LIGHT_50: '#f6eee8',\n  AMBER_LIGHT_100: '#ecded0',\n  AMBER_LIGHT_200: '#dabda1',\n  AMBER_LIGHT_300: '#c79b73',\n  AMBER_LIGHT_400: '#b57A44',\n  AMBER_LIGHT_500: BASE_LIGHT_COLOR.AMBER,\n  AMBER_LIGHT_600: '#824711',\n  AMBER_LIGHT_700: '#61350d',\n  AMBER_LIGHT_800: '#412408',\n  AMBER_LIGHT_900: '#201204',\n};\n\nconst DARK_AMBER: Record<string, string> = {\n  AMBER_DARK_50: '#fffbea',\n  AMBER_DARK_100: '#fff6d4',\n  AMBER_DARK_200: '#ffeea8',\n  AMBER_DARK_300: '#ffe57d',\n  AMBER_DARK_400: '#ffdd51',\n  AMBER_DARK_500: BASE_DARK_COLOR.AMBER,\n  AMBER_DARK_600: '#ccaa1e',\n  AMBER_DARK_700: '#997f17',\n  AMBER_DARK_800: '#66550f',\n  AMBER_DARK_900: '#4d400b',\n};\n\nconst DARK: Record<string, string> = {\n  ...DARK_BLUE,\n  ...DARK_GREEN,\n  ...DARK_PETROL,\n  ...DARK_PURPLE,\n  ...DARK_RED,\n  ...DARK_AMBER,\n};\n\nconst LIGHT: Record<string, string> = {\n  ...LIGHT_BLUE,\n  ...LIGHT_GREEN,\n  ...LIGHT_PETROL,\n  ...LIGHT_PURPLE,\n  ...LIGHT_RED,\n  ...LIGHT_AMBER,\n};\n\nconst GRAYS: Record<string, string> = {\n  GRAY_10: '#fafafa',\n  GRAY_20: '#edeff0',\n  GRAY_30: '#e5e8ea',\n  GRAY_40: '#dce0e3',\n  GRAY_50: '#cbced1',\n  GRAY_60: '#9fa1a7',\n  GRAY_70: '#676b71',\n  GRAY_80: '#54585f',\n  GRAY_90: '#34373d',\n  GRAY_95: '#26272c',\n  GRAY_100: '#17181a',\n};\n\nexport const COLOR_V2: any = {\n  ...BASE_DARK_COLOR,\n  ...BASE_LIGHT_COLOR,\n  ...DARK,\n  ...LIGHT,\n  ...GRAYS,\n  BLACK: '#000',\n  WHITE: '#fff',\n};\n"],"file":"colors-v2.js"}

package/src/Identity/colors-v2.md

@@ -3,7 +3,7 @@
 import {jsx} from '@emotion/react';
 import {COLOR, Container, H1, H2, H3, Line} from '@wireapp/react-ui-kit';
 import Color from 'color';
-import {COLOR as Colors, BASE_LIGHT_COLOR, BASE_DARK_COLOR} from './colors-v2';
+import {COLOR_V2 as Colors, BASE_LIGHT_COLOR, BASE_DARK_COLOR} from './colors-v2';
 
 const colorElementStyle = props => ({
   '&::after': {

package/src/Identity/index.d.js

@@ -56,6 +56,19 @@ Object.keys(_colors).forEach(function (key) {
   });
 });
 
+var _colorsV = require("./colors-v2");
+
+Object.keys(_colorsV).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _colorsV[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _colorsV[key];
+    }
+  });
+});
+
 var _Logo = require("./Logo");
 
 Object.keys(_Logo).forEach(function (key) {

package/src/Identity/index.d.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.d.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from './Animation';\nexport * from './Avatar';\nexport * from './AvatarGrid';\nexport * from './colors';\nexport * from './Logo';\n"],"file":"index.d.js"}
+{"version":3,"sources":["index.d.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from './Animation';\nexport * from './Avatar';\nexport * from './AvatarGrid';\nexport * from './colors';\nexport * from './colors-v2';\nexport * from './Logo';\n"],"file":"index.d.js"}

package/src/Identity/index.d.ts

@@ -2,4 +2,5 @@ export * from './Animation';
 export * from './Avatar';
 export * from './AvatarGrid';
 export * from './colors';
+export * from './colors-v2';
 export * from './Logo';

package/src/Identity/index.js

@@ -56,6 +56,19 @@ Object.keys(_colors).forEach(function (key) {
   });
 });
 
+var _colorsV = require("./colors-v2");
+
+Object.keys(_colorsV).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _colorsV[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _colorsV[key];
+    }
+  });
+});
+
 var _Logo = require("./Logo");
 
 Object.keys(_Logo).forEach(function (key) {

package/src/Identity/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;AAmBA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\nexport * from './Animation';\nexport * from './Avatar';\nexport * from './AvatarGrid';\nexport * from './colors';\nexport * from './Logo';\n"],"file":"index.js"}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;AAmBA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["/*\n * Wire\n * Copyright (C) 2018 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\nexport * from './Animation';\nexport * from './Avatar';\nexport * from './AvatarGrid';\nexport * from './colors';\nexport * from './colors-v2';\nexport * from './Logo';\n"],"file":"index.js"}

package/src/Layout/Theme.js

@@ -17,6 +17,8 @@ var _react2 = _interopRequireDefault(require("react"));
 
 var _colors = require("../Identity/colors");
 
+var _colorsV = require("../Identity/colors-v2");
+
 var _util = require("../util");
 
 var _themes;
@@ -32,7 +34,7 @@ exports.THEME_ID = THEME_ID;
 var themes = (_themes = {}, (0, _defineProperty2["default"])(_themes, THEME_ID.LIGHT, {
   Input: {
     backgroundColor: _colors.COLOR.WHITE,
-    backgroundColorDisabled: _colors.COLOR.DISABLED,
+    backgroundColorDisabled: _colorsV.COLOR_V2.GRAY_20,
     placeholderColor: _colors.COLOR.GRAY_DARKEN_24
   },
   general: {

package/src/Layout/Theme.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Theme.tsx"],"names":["THEME_ID","themes","LIGHT","Input","backgroundColor","COLOR","WHITE","backgroundColorDisabled","DISABLED","placeholderColor","GRAY_DARKEN_24","general","GRAY_LIGHTEN_88","color","TEXT","DARK","BLACK_LIGHTEN_24","BLACK","filterThemeProps","props","ThemeProvider","themeId"],"mappings":";;;;;;;;;;;;;AAoBA;;AACA;;AAEA;;AACA;;;;IAEYA,Q;;;WAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;GAAAA,Q,wBAAAA,Q;;AAiBL,IAAMC,MAAsC,4DAChDD,QAAQ,CAACE,KADuC,EAC/B;AAChBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,eAAe,EAAEC,cAAMC,KADlB;AAELC,IAAAA,uBAAuB,EAAEF,cAAMG,QAF1B;AAGLC,IAAAA,gBAAgB,EAAEJ,cAAMK;AAHnB,GADS;AAMhBC,EAAAA,OAAO,EAAE;AACPP,IAAAA,eAAe,EAAEC,cAAMO,eADhB;AAEPC,IAAAA,KAAK,EAAER,cAAMS;AAFN;AANO,CAD+B,6CAYhDd,QAAQ,CAACe,IAZuC,EAYhC;AACfZ,EAAAA,KAAK,EAAE;AACLC,IAAAA,eAAe,EAAEC,cAAMW,gBADlB;AAELT,IAAAA,uBAAuB,EAAEF,cAAMG,QAF1B;AAGLC,IAAAA,gBAAgB,EAAEJ,cAAMO;AAHnB,GADQ;AAMfD,EAAAA,OAAO,EAAE;AACPP,IAAAA,eAAe,EAAEC,cAAMY,KADhB;AAEPJ,IAAAA,KAAK,EAAER,cAAMC;AAFN;AANM,CAZgC,WAA5C;;;AA6BP,IAAMY,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD;AAAA,SAAuB,uBAAYA,KAAZ,EAAmB,CAAC,SAAD,CAAnB,CAAvB;AAAA,CAAzB;;AAEO,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACD,KAAD;AAAA,SAC3B,gBAAC,oBAAD;AAAsB,IAAA,KAAK,EAAElB,MAAM,CAACkB,KAAK,CAACE,OAAP;AAAnC,KAAwDH,gBAAgB,CAACC,KAAD,CAAxE,EAD2B;AAAA,CAAtB","sourcesContent":["/*\n * Wire\n * Copyright (C) 2019 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {jsx, ThemeProvider as EmotionThemeProvider} from '@emotion/react';\nimport React from 'react';\n\nimport {COLOR} from '../Identity/colors';\nimport {filterProps} from '../util';\n\nexport enum THEME_ID {\n  DARK = 'THEME_DARK',\n  LIGHT = 'THEME_LIGHT',\n}\n\nexport interface Theme {\n  general: {\n    backgroundColor: string;\n    color: string;\n  };\n  Input: {\n    backgroundColor: string;\n    backgroundColorDisabled: string;\n    placeholderColor: string;\n  };\n}\n\nexport const themes: {[themeId in THEME_ID]: Theme} = {\n  [THEME_ID.LIGHT]: {\n    Input: {\n      backgroundColor: COLOR.WHITE,\n      backgroundColorDisabled: COLOR.DISABLED,\n      placeholderColor: COLOR.GRAY_DARKEN_24,\n    },\n    general: {\n      backgroundColor: COLOR.GRAY_LIGHTEN_88,\n      color: COLOR.TEXT,\n    },\n  },\n  [THEME_ID.DARK]: {\n    Input: {\n      backgroundColor: COLOR.BLACK_LIGHTEN_24,\n      backgroundColorDisabled: COLOR.DISABLED,\n      placeholderColor: COLOR.GRAY_LIGHTEN_88,\n    },\n    general: {\n      backgroundColor: COLOR.BLACK,\n      color: COLOR.WHITE,\n    },\n  },\n};\n\nexport interface ThemeProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  themeId: THEME_ID;\n}\n\nconst filterThemeProps = (props: ThemeProps) => filterProps(props, ['themeId']);\n\nexport const ThemeProvider = (props: ThemeProps) => (\n  <EmotionThemeProvider theme={themes[props.themeId]} {...filterThemeProps(props)} />\n);\n"],"file":"Theme.js"}
+{"version":3,"sources":["Theme.tsx"],"names":["THEME_ID","themes","LIGHT","Input","backgroundColor","COLOR","WHITE","backgroundColorDisabled","COLOR_V2","GRAY_20","placeholderColor","GRAY_DARKEN_24","general","GRAY_LIGHTEN_88","color","TEXT","DARK","BLACK_LIGHTEN_24","DISABLED","BLACK","filterThemeProps","props","ThemeProvider","themeId"],"mappings":";;;;;;;;;;;;;AAoBA;;AACA;;AAEA;;AACA;;AACA;;;;IAEYA,Q;;;WAAAA,Q;AAAAA,EAAAA,Q;AAAAA,EAAAA,Q;GAAAA,Q,wBAAAA,Q;;AAiBL,IAAMC,MAAsC,4DAChDD,QAAQ,CAACE,KADuC,EAC/B;AAChBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,eAAe,EAAEC,cAAMC,KADlB;AAELC,IAAAA,uBAAuB,EAAEC,kBAASC,OAF7B;AAGLC,IAAAA,gBAAgB,EAAEL,cAAMM;AAHnB,GADS;AAMhBC,EAAAA,OAAO,EAAE;AACPR,IAAAA,eAAe,EAAEC,cAAMQ,eADhB;AAEPC,IAAAA,KAAK,EAAET,cAAMU;AAFN;AANO,CAD+B,6CAYhDf,QAAQ,CAACgB,IAZuC,EAYhC;AACfb,EAAAA,KAAK,EAAE;AACLC,IAAAA,eAAe,EAAEC,cAAMY,gBADlB;AAELV,IAAAA,uBAAuB,EAAEF,cAAMa,QAF1B;AAGLR,IAAAA,gBAAgB,EAAEL,cAAMQ;AAHnB,GADQ;AAMfD,EAAAA,OAAO,EAAE;AACPR,IAAAA,eAAe,EAAEC,cAAMc,KADhB;AAEPL,IAAAA,KAAK,EAAET,cAAMC;AAFN;AANM,CAZgC,WAA5C;;;AA6BP,IAAMc,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD;AAAA,SAAuB,uBAAYA,KAAZ,EAAmB,CAAC,SAAD,CAAnB,CAAvB;AAAA,CAAzB;;AAEO,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACD,KAAD;AAAA,SAC3B,gBAAC,oBAAD;AAAsB,IAAA,KAAK,EAAEpB,MAAM,CAACoB,KAAK,CAACE,OAAP;AAAnC,KAAwDH,gBAAgB,CAACC,KAAD,CAAxE,EAD2B;AAAA,CAAtB","sourcesContent":["/*\n * Wire\n * Copyright (C) 2019 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {jsx, ThemeProvider as EmotionThemeProvider} from '@emotion/react';\nimport React from 'react';\n\nimport {COLOR} from '../Identity/colors';\nimport {COLOR_V2} from '../Identity/colors-v2';\nimport {filterProps} from '../util';\n\nexport enum THEME_ID {\n  DARK = 'THEME_DARK',\n  LIGHT = 'THEME_LIGHT',\n}\n\nexport interface Theme {\n  general: {\n    backgroundColor: string;\n    color: string;\n  };\n  Input: {\n    backgroundColor: string;\n    backgroundColorDisabled: string;\n    placeholderColor: string;\n  };\n}\n\nexport const themes: {[themeId in THEME_ID]: Theme} = {\n  [THEME_ID.LIGHT]: {\n    Input: {\n      backgroundColor: COLOR.WHITE,\n      backgroundColorDisabled: COLOR_V2.GRAY_20,\n      placeholderColor: COLOR.GRAY_DARKEN_24,\n    },\n    general: {\n      backgroundColor: COLOR.GRAY_LIGHTEN_88,\n      color: COLOR.TEXT,\n    },\n  },\n  [THEME_ID.DARK]: {\n    Input: {\n      backgroundColor: COLOR.BLACK_LIGHTEN_24,\n      backgroundColorDisabled: COLOR.DISABLED,\n      placeholderColor: COLOR.GRAY_LIGHTEN_88,\n    },\n    general: {\n      backgroundColor: COLOR.BLACK,\n      color: COLOR.WHITE,\n    },\n  },\n};\n\nexport interface ThemeProps<T = HTMLDivElement> extends React.HTMLProps<T> {\n  themeId: THEME_ID;\n}\n\nconst filterThemeProps = (props: ThemeProps) => filterProps(props, ['themeId']);\n\nexport const ThemeProvider = (props: ThemeProps) => (\n  <EmotionThemeProvider theme={themes[props.themeId]} {...filterThemeProps(props)} />\n);\n"],"file":"Theme.js"}

package/src/Misc/ButtonGroup.d.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=ButtonGroup.d.js.map

package/src/Misc/ButtonGroup.d.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"ButtonGroup.d.js"}

package/src/Misc/ButtonGroup.d.ts

@@ -0,0 +1,14 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import { ReactElement } from 'react';
+interface GroupButtonProps<T = HTMLButtonElement> {
+    children?: ReactElement | string;
+    icon?: ReactElement;
+}
+declare const ButtonGroup: {
+    ({ children }: {
+        children: any;
+    }): jsx.JSX.Element;
+    Button: ({ children, icon, ...props }: GroupButtonProps) => jsx.JSX.Element;
+};
+export { ButtonGroup };

package/src/Misc/ButtonGroup.js

@@ -0,0 +1,113 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ButtonGroup = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = require("@emotion/react");
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _Identity = require("../Identity");
+
+var _excluded = ["children", "icon"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+var buttonGroupStyle = function buttonGroupStyle() {
+  return {
+    display: 'flex',
+    alignItems: 'center'
+  };
+};
+
+var buttonStyle = function buttonStyle(theme, _ref) {
+  var _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled;
+  return _objectSpread({
+    height: '32px',
+    borderRadius: '12px',
+    padding: '0 12px',
+    background: _Identity.COLOR_V2.WHITE,
+    border: "1px solid ".concat(_Identity.COLOR_V2.GRAY_40),
+    cursor: 'pointer',
+    display: 'flex',
+    alignItems: 'center',
+    backgroundColor: disabled ? _Identity.COLOR_V2.GRAY_20 : _Identity.COLOR_V2.WHITE,
+    svg: {
+      fill: disabled ? _Identity.COLOR_V2.GRAY_70 : _Identity.COLOR_V2.BLACK
+    },
+    '&:not(:last-child)': {
+      borderTopRightRadius: '0',
+      borderBottomRightRadius: '0'
+    },
+    '&:not(:first-child)': {
+      borderTopLeftRadius: '0',
+      borderBottomLeftRadius: '0'
+    },
+    '&:first-child:last-child': {
+      borderRadius: '0'
+    }
+  }, !disabled && {
+    '&:hover, &:focus': {
+      backgroundColor: _Identity.COLOR_V2.GRAY_20
+    },
+    '&:hover': {
+      borderColor: _Identity.COLOR_V2.GRAY_50
+    },
+    '&:focus': {
+      borderColor: _Identity.COLOR_V2.GRAY_60
+    },
+    '&:active': {
+      backgroundColor: _Identity.COLOR_V2.BLUE_LIGHT_50,
+      borderColor: _Identity.COLOR_V2.BLUE_LIGHT_300,
+      svg: {
+        fill: _Identity.COLOR_V2.BLUE
+      }
+    }
+  });
+};
+
+var ButtonGroup = function ButtonGroup(_ref2) {
+  var children = _ref2.children;
+  return (0, _react.jsx)("div", {
+    css: function css(theme) {
+      return buttonGroupStyle(theme);
+    },
+    role: "group",
+    "aria-label": "Button Group"
+  }, children);
+};
+
+exports.ButtonGroup = ButtonGroup;
+
+var Button = function Button(_ref3) {
+  var children = _ref3.children,
+      icon = _ref3.icon,
+      props = (0, _objectWithoutProperties2["default"])(_ref3, _excluded);
+  return (0, _react.jsx)("button", (0, _extends2["default"])({
+    css: function css(theme) {
+      return buttonStyle(theme, props);
+    }
+  }, props), icon, children && (0, _react.jsx)("span", {
+    css: /*#__PURE__*/(0, _react.css)({
+      marginLeft: !!icon && '6px',
+      fontSize: '12px',
+      fontWeight: 'bold',
+      lineHeight: '14px',
+      letterSpacing: '0.25px'
+    }, process.env.NODE_ENV === "production" ? "" : ";label:Button;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJ1dHRvbkdyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2RlUiLCJmaWxlIjoiQnV0dG9uR3JvdXAudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIFdpcmVcbiAqIENvcHlyaWdodCAoQykgMjAyMiBXaXJlIFN3aXNzIEdtYkhcbiAqXG4gKiBUaGlzIHByb2dyYW0gaXMgZnJlZSBzb2Z0d2FyZTogeW91IGNhbiByZWRpc3RyaWJ1dGUgaXQgYW5kL29yIG1vZGlmeVxuICogaXQgdW5kZXIgdGhlIHRlcm1zIG9mIHRoZSBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZSBhcyBwdWJsaXNoZWQgYnlcbiAqIHRoZSBGcmVlIFNvZnR3YXJlIEZvdW5kYXRpb24sIGVpdGhlciB2ZXJzaW9uIDMgb2YgdGhlIExpY2Vuc2UsIG9yXG4gKiAoYXQgeW91ciBvcHRpb24pIGFueSBsYXRlciB2ZXJzaW9uLlxuICpcbiAqIFRoaXMgcHJvZ3JhbSBpcyBkaXN0cmlidXRlZCBpbiB0aGUgaG9wZSB0aGF0IGl0IHdpbGwgYmUgdXNlZnVsLFxuICogYnV0IFdJVEhPVVQgQU5ZIFdBUlJBTlRZOyB3aXRob3V0IGV2ZW4gdGhlIGltcGxpZWQgd2FycmFudHkgb2ZcbiAqIE1FUkNIQU5UQUJJTElUWSBvciBGSVRORVNTIEZPUiBBIFBBUlRJQ1VMQVIgUFVSUE9TRS4gU2VlIHRoZVxuICogR05VIEdlbmVyYWwgUHVibGljIExpY2Vuc2UgZm9yIG1vcmUgZGV0YWlscy5cbiAqXG4gKiBZb3Ugc2hvdWxkIGhhdmUgcmVjZWl2ZWQgYSBjb3B5IG9mIHRoZSBHTlUgR2VuZXJhbCBQdWJsaWMgTGljZW5zZVxuICogYWxvbmcgd2l0aCB0aGlzIHByb2dyYW0uIElmIG5vdCwgc2VlIGh0dHA6Ly93d3cuZ251Lm9yZy9saWNlbnNlcy8uXG4gKlxuICovXG5cbi8qKiBAanN4IGpzeCAqL1xuaW1wb3J0IHtDU1NPYmplY3QsIGpzeH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHtSZWFjdEVsZW1lbnR9IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHtDT0xPUl9WMn0gZnJvbSAnLi4vSWRlbnRpdHknO1xuaW1wb3J0IHR5cGUge1RoZW1lfSBmcm9tICcuLi9MYXlvdXQnO1xuaW1wb3J0IHtJY29uQnV0dG9uUHJvcHN9IGZyb20gJy4vSWNvbkJ1dHRvbic7XG5cbmNvbnN0IGJ1dHRvbkdyb3VwU3R5bGU6IDxUPih0aGVtZTogVGhlbWUpID0+IENTU09iamVjdCA9ICgpID0+ICh7XG4gIGRpc3BsYXk6ICdmbGV4JyxcbiAgYWxpZ25JdGVtczogJ2NlbnRlcicsXG59KTtcblxuY29uc3QgYnV0dG9uU3R5bGU6IDxUPih0aGVtZTogVGhlbWUsIHByb3BzOiBJY29uQnV0dG9uUHJvcHM8VD4pID0+IENTU09iamVjdCA9ICh0aGVtZSwge2Rpc2FibGVkID0gZmFsc2V9KSA9PiAoe1xuICBoZWlnaHQ6ICczMnB4JyxcbiAgYm9yZGVyUmFkaXVzOiAnMTJweCcsXG4gIHBhZGRpbmc6ICcwIDEycHgnLFxuICBiYWNrZ3JvdW5kOiBDT0xPUl9WMi5XSElURSxcbiAgYm9yZGVyOiBgMXB4IHNvbGlkICR7Q09MT1JfVjIuR1JBWV80MH1gLFxuICBjdXJzb3I6ICdwb2ludGVyJyxcbiAgZGlzcGxheTogJ2ZsZXgnLFxuICBhbGlnbkl0ZW1zOiAnY2VudGVyJyxcbiAgYmFja2dyb3VuZENvbG9yOiBkaXNhYmxlZCA/IENPTE9SX1YyLkdSQVlfMjAgOiBDT0xPUl9WMi5XSElURSxcbiAgc3ZnOiB7XG4gICAgZmlsbDogZGlzYWJsZWQgPyBDT0xPUl9WMi5HUkFZXzcwIDogQ09MT1JfVjIuQkxBQ0ssXG4gIH0sXG4gICcmOm5vdCg6bGFzdC1jaGlsZCknOiB7XG4gICAgYm9yZGVyVG9wUmlnaHRSYWRpdXM6ICcwJyxcbiAgICBib3JkZXJCb3R0b21SaWdodFJhZGl1czogJzAnLFxuICB9LFxuICAnJjpub3QoOmZpcnN0LWNoaWxkKSc6IHtcbiAgICBib3JkZXJUb3BMZWZ0UmFkaXVzOiAnMCcsXG4gICAgYm9yZGVyQm90dG9tTGVmdFJhZGl1czogJzAnLFxuICB9LFxuICAnJjpmaXJzdC1jaGlsZDpsYXN0LWNoaWxkJzoge1xuICAgIGJvcmRlclJhZGl1czogJzAnLFxuICB9LFxuICAuLi4oIWRpc2FibGVkICYmIHtcbiAgICAnJjpob3ZlciwgJjpmb2N1cyc6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogQ09MT1JfVjIuR1JBWV8yMCxcbiAgICB9LFxuICAgICcmOmhvdmVyJzoge1xuICAgICAgYm9yZGVyQ29sb3I6IENPTE9SX1YyLkdSQVlfNTAsXG4gICAgfSxcbiAgICAnJjpmb2N1cyc6IHtcbiAgICAgIGJvcmRlckNvbG9yOiBDT0xPUl9WMi5HUkFZXzYwLFxuICAgIH0sXG4gICAgJyY6YWN0aXZlJzoge1xuICAgICAgYmFja2dyb3VuZENvbG9yOiBDT0xPUl9WMi5CTFVFX0xJR0hUXzUwLFxuICAgICAgYm9yZGVyQ29sb3I6IENPTE9SX1YyLkJMVUVfTElHSFRfMzAwLFxuICAgICAgc3ZnOiB7XG4gICAgICAgIGZpbGw6IENPTE9SX1YyLkJMVUUsXG4gICAgICB9LFxuICAgIH0sXG4gIH0pLFxufSk7XG5cbmludGVyZmFjZSBHcm91cEJ1dHRvblByb3BzPFQgPSBIVE1MQnV0dG9uRWxlbWVudD4ge1xuICBjaGlsZHJlbj86IFJlYWN0RWxlbWVudCB8IHN0cmluZztcbiAgaWNvbj86IFJlYWN0RWxlbWVudDtcbn1cblxuY29uc3QgQnV0dG9uR3JvdXAgPSAoe2NoaWxkcmVufSkgPT4gKFxuICA8ZGl2IGNzcz17KHRoZW1lOiBUaGVtZSkgPT4gYnV0dG9uR3JvdXBTdHlsZSh0aGVtZSl9IHJvbGU9XCJncm91cFwiIGFyaWEtbGFiZWw9XCJCdXR0b24gR3JvdXBcIj5cbiAgICB7Y2hpbGRyZW59XG4gIDwvZGl2PlxuKTtcblxuY29uc3QgQnV0dG9uID0gKHtjaGlsZHJlbiwgaWNvbiwgLi4ucHJvcHN9OiBHcm91cEJ1dHRvblByb3BzKSA9PiB7XG4gIHJldHVybiAoXG4gICAgPGJ1dHRvbiBjc3M9eyh0aGVtZTogVGhlbWUpID0+IGJ1dHRvblN0eWxlKHRoZW1lLCBwcm9wcyl9IHsuLi5wcm9wc30+XG4gICAgICB7aWNvbn1cbiAgICAgIHtjaGlsZHJlbiAmJiAoXG4gICAgICAgIDxzcGFuXG4gICAgICAgICAgY3NzPXt7XG4gICAgICAgICAgICBtYXJnaW5MZWZ0OiAhIWljb24gJiYgJzZweCcsXG4gICAgICAgICAgICBmb250U2l6ZTogJzEycHgnLFxuICAgICAgICAgICAgZm9udFdlaWdodDogJ2JvbGQnLFxuICAgICAgICAgICAgbGluZUhlaWdodDogJzE0cHgnLFxuICAgICAgICAgICAgbGV0dGVyU3BhY2luZzogJzAuMjVweCcsXG4gICAgICAgICAgfX1cbiAgICAgICAgPlxuICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgPC9zcGFuPlxuICAgICAgKX1cbiAgICA8L2J1dHRvbj5cbiAgKTtcbn07XG5cbkJ1dHRvbkdyb3VwLkJ1dHRvbiA9IEJ1dHRvbjtcblxuZXhwb3J0IHtCdXR0b25Hcm91cH07XG4iXX0= */")
+  }, children));
+};
+
+ButtonGroup.Button = Button;
+//# sourceMappingURL=ButtonGroup.js.map

package/src/Misc/ButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ButtonGroup.tsx"],"names":["buttonGroupStyle","display","alignItems","buttonStyle","theme","disabled","height","borderRadius","padding","background","COLOR_V2","WHITE","border","GRAY_40","cursor","backgroundColor","GRAY_20","svg","fill","GRAY_70","BLACK","borderTopRightRadius","borderBottomRightRadius","borderTopLeftRadius","borderBottomLeftRadius","borderColor","GRAY_50","GRAY_60","BLUE_LIGHT_50","BLUE_LIGHT_300","BLUE","ButtonGroup","children","Button","icon","props","marginLeft","fontSize","fontWeight","lineHeight","letterSpacing"],"mappings":";;;;;;;;;;;AAoBA;;;;;;AAGA;;;;;;;;AAIA,IAAMA,gBAAgD,GAAG,SAAnDA,gBAAmD;AAAA,SAAO;AAC9DC,IAAAA,OAAO,EAAE,MADqD;AAE9DC,IAAAA,UAAU,EAAE;AAFkD,GAAP;AAAA,CAAzD;;AAKA,IAAMC,WAAsE,GAAG,SAAzEA,WAAyE,CAACC,KAAD;AAAA,2BAASC,QAAT;AAAA,MAASA,QAAT,8BAAoB,KAApB;AAAA;AAC7EC,IAAAA,MAAM,EAAE,MADqE;AAE7EC,IAAAA,YAAY,EAAE,MAF+D;AAG7EC,IAAAA,OAAO,EAAE,QAHoE;AAI7EC,IAAAA,UAAU,EAAEC,mBAASC,KAJwD;AAK7EC,IAAAA,MAAM,sBAAeF,mBAASG,OAAxB,CALuE;AAM7EC,IAAAA,MAAM,EAAE,SANqE;AAO7Eb,IAAAA,OAAO,EAAE,MAPoE;AAQ7EC,IAAAA,UAAU,EAAE,QARiE;AAS7Ea,IAAAA,eAAe,EAAEV,QAAQ,GAAGK,mBAASM,OAAZ,GAAsBN,mBAASC,KATqB;AAU7EM,IAAAA,GAAG,EAAE;AACHC,MAAAA,IAAI,EAAEb,QAAQ,GAAGK,mBAASS,OAAZ,GAAsBT,mBAASU;AAD1C,KAVwE;AAa7E,0BAAsB;AACpBC,MAAAA,oBAAoB,EAAE,GADF;AAEpBC,MAAAA,uBAAuB,EAAE;AAFL,KAbuD;AAiB7E,2BAAuB;AACrBC,MAAAA,mBAAmB,EAAE,GADA;AAErBC,MAAAA,sBAAsB,EAAE;AAFH,KAjBsD;AAqB7E,gCAA4B;AAC1BjB,MAAAA,YAAY,EAAE;AADY;AArBiD,KAwBzE,CAACF,QAAD,IAAa;AACf,wBAAoB;AAClBU,MAAAA,eAAe,EAAEL,mBAASM;AADR,KADL;AAIf,eAAW;AACTS,MAAAA,WAAW,EAAEf,mBAASgB;AADb,KAJI;AAOf,eAAW;AACTD,MAAAA,WAAW,EAAEf,mBAASiB;AADb,KAPI;AAUf,gBAAY;AACVZ,MAAAA,eAAe,EAAEL,mBAASkB,aADhB;AAEVH,MAAAA,WAAW,EAAEf,mBAASmB,cAFZ;AAGVZ,MAAAA,GAAG,EAAE;AACHC,QAAAA,IAAI,EAAER,mBAASoB;AADZ;AAHK;AAVG,GAxB4D;AAAA,CAA/E;;AAiDA,IAAMC,WAAW,GAAG,SAAdA,WAAc;AAAA,MAAEC,QAAF,SAAEA,QAAF;AAAA,SAClB;AAAK,IAAA,GAAG,EAAE,aAAC5B,KAAD;AAAA,aAAkBJ,gBAAgB,CAACI,KAAD,CAAlC;AAAA,KAAV;AAAqD,IAAA,IAAI,EAAC,OAA1D;AAAkE,kBAAW;AAA7E,KACG4B,QADH,CADkB;AAAA,CAApB;;;;AAMA,IAAMC,MAAM,GAAG,SAATA,MAAS,QAAkD;AAAA,MAAhDD,QAAgD,SAAhDA,QAAgD;AAAA,MAAtCE,IAAsC,SAAtCA,IAAsC;AAAA,MAA7BC,KAA6B;AAC/D,SACE;AAAQ,IAAA,GAAG,EAAE,aAAC/B,KAAD;AAAA,aAAkBD,WAAW,CAACC,KAAD,EAAQ+B,KAAR,CAA7B;AAAA;AAAb,KAA8DA,KAA9D,GACGD,IADH,EAEGF,QAAQ,IACP;AACE,IAAA,GAAG,+BAAE;AACHI,MAAAA,UAAU,EAAE,CAAC,CAACF,IAAF,IAAU,KADnB;AAEHG,MAAAA,QAAQ,EAAE,MAFP;AAGHC,MAAAA,UAAU,EAAE,MAHT;AAIHC,MAAAA,UAAU,EAAE,MAJT;AAKHC,MAAAA,aAAa,EAAE;AALZ,KAAF;AADL,KASGR,QATH,CAHJ,CADF;AAkBD,CAnBD;;AAqBAD,WAAW,CAACE,MAAZ,GAAqBA,MAArB","sourcesContent":["/*\n * Wire\n * Copyright (C) 2022 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {CSSObject, jsx} from '@emotion/react';\nimport {ReactElement} from 'react';\n\nimport {COLOR_V2} from '../Identity';\nimport type {Theme} from '../Layout';\nimport {IconButtonProps} from './IconButton';\n\nconst buttonGroupStyle: <T>(theme: Theme) => CSSObject = () => ({\n  display: 'flex',\n  alignItems: 'center',\n});\n\nconst buttonStyle: <T>(theme: Theme, props: IconButtonProps<T>) => CSSObject = (theme, {disabled = false}) => ({\n  height: '32px',\n  borderRadius: '12px',\n  padding: '0 12px',\n  background: COLOR_V2.WHITE,\n  border: `1px solid ${COLOR_V2.GRAY_40}`,\n  cursor: 'pointer',\n  display: 'flex',\n  alignItems: 'center',\n  backgroundColor: disabled ? COLOR_V2.GRAY_20 : COLOR_V2.WHITE,\n  svg: {\n    fill: disabled ? COLOR_V2.GRAY_70 : COLOR_V2.BLACK,\n  },\n  '&:not(:last-child)': {\n    borderTopRightRadius: '0',\n    borderBottomRightRadius: '0',\n  },\n  '&:not(:first-child)': {\n    borderTopLeftRadius: '0',\n    borderBottomLeftRadius: '0',\n  },\n  '&:first-child:last-child': {\n    borderRadius: '0',\n  },\n  ...(!disabled && {\n    '&:hover, &:focus': {\n      backgroundColor: COLOR_V2.GRAY_20,\n    },\n    '&:hover': {\n      borderColor: COLOR_V2.GRAY_50,\n    },\n    '&:focus': {\n      borderColor: COLOR_V2.GRAY_60,\n    },\n    '&:active': {\n      backgroundColor: COLOR_V2.BLUE_LIGHT_50,\n      borderColor: COLOR_V2.BLUE_LIGHT_300,\n      svg: {\n        fill: COLOR_V2.BLUE,\n      },\n    },\n  }),\n});\n\ninterface GroupButtonProps<T = HTMLButtonElement> {\n  children?: ReactElement | string;\n  icon?: ReactElement;\n}\n\nconst ButtonGroup = ({children}) => (\n  <div css={(theme: Theme) => buttonGroupStyle(theme)} role=\"group\" aria-label=\"Button Group\">\n    {children}\n  </div>\n);\n\nconst Button = ({children, icon, ...props}: GroupButtonProps) => {\n  return (\n    <button css={(theme: Theme) => buttonStyle(theme, props)} {...props}>\n      {icon}\n      {children && (\n        <span\n          css={{\n            marginLeft: !!icon && '6px',\n            fontSize: '12px',\n            fontWeight: 'bold',\n            lineHeight: '14px',\n            letterSpacing: '0.25px',\n          }}\n        >\n          {children}\n        </span>\n      )}\n    </button>\n  );\n};\n\nButtonGroup.Button = Button;\n\nexport {ButtonGroup};\n"],"file":"ButtonGroup.js"}

package/src/Misc/ButtonGroup.md

@@ -0,0 +1,27 @@
+Demo:
+
+```js
+import {Button, Container, Columns, Column, H2, PlusIcon} from '@wireapp/react-ui-kit';
+
+<Container>
+  <H2>Button Group</H2>
+
+  <div style={{marginBottom: '20px'}}>
+    <ButtonGroup>
+      <ButtonGroup.Button icon={<PlusIcon height={12} width={12} />} />
+
+      <ButtonGroup.Button icon={<PlusIcon height={12} width={12} />}>Button</ButtonGroup.Button>
+
+      <ButtonGroup.Button>Text only</ButtonGroup.Button>
+    </ButtonGroup>
+  </div>
+
+  <ButtonGroup>
+    <ButtonGroup.Button>Text only</ButtonGroup.Button>
+  </ButtonGroup>
+
+  <ButtonGroup>
+    <ButtonGroup.Button icon={<PlusIcon height={12} width={12} />} disabled />
+  </ButtonGroup>
+</Container>;
+```

package/src/Misc/IconButton.d.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=IconButton.d.js.map

package/src/Misc/IconButton.d.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[],"file":"IconButton.d.js"}

package/src/Misc/IconButton.d.ts

@@ -0,0 +1,15 @@
+/** @jsx jsx */
+import { CSSObject, jsx } from '@emotion/react';
+import type { Theme } from '../Layout';
+import { TextProps } from '../Text';
+declare enum IconButtonVariant {
+    PRIMARY = "primary",
+    SECONDARY = "secondary"
+}
+export interface IconButtonProps<T = HTMLButtonElement> extends TextProps<T> {
+    variant?: IconButtonVariant;
+    backgroundColor?: string;
+}
+export declare const iconButtonStyle: <T>(theme: Theme, props: IconButtonProps<T>) => CSSObject;
+export declare const IconButton: ({ children, ...props }: IconButtonProps) => jsx.JSX.Element;
+export {};

package/src/Misc/IconButton.js

@@ -0,0 +1,122 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.IconButton = exports.iconButtonStyle = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = require("@emotion/react");
+
+var _Identity = require("../Identity");
+
+var _motions = require("../Identity/motions");
+
+var _Text = require("../Text");
+
+var _util = require("../util");
+
+var _excluded = ["children"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+var IconButtonVariant;
+
+(function (IconButtonVariant) {
+  IconButtonVariant["PRIMARY"] = "primary";
+  IconButtonVariant["SECONDARY"] = "secondary";
+})(IconButtonVariant || (IconButtonVariant = {}));
+
+var iconButtonStyle = function iconButtonStyle(theme, _ref) {
+  var _ref$variant = _ref.variant,
+      variant = _ref$variant === void 0 ? IconButtonVariant.PRIMARY : _ref$variant,
+      backgroundColor = _ref.backgroundColor,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled;
+  return _objectSpread(_objectSpread({
+    border: 0,
+    borderRadius: '12px',
+    cursor: disabled ? 'default' : 'pointer',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    marginBottom: '16px',
+    padding: 0,
+    outline: 'none',
+    textDecoration: 'none',
+    touchAction: 'manipulation',
+    transition: _motions.defaultTransition,
+    width: '40px',
+    height: '32px',
+    '&:hover, &:focus': {
+      textDecoration: 'none'
+    }
+  }, variant === IconButtonVariant.PRIMARY && _objectSpread({
+    backgroundColor: disabled ? _Identity.COLOR_V2.GRAY_20 : backgroundColor || _Identity.COLOR_V2.WHITE,
+    border: "1px solid ".concat(_Identity.COLOR_V2.GRAY_40),
+    svg: {
+      fill: disabled ? _Identity.COLOR_V2.GRAY_70 : _Identity.COLOR_V2.BLACK
+    }
+  }, !disabled && {
+    '&:hover, &:focus': {
+      backgroundColor: _Identity.COLOR_V2.GRAY_20
+    },
+    '&:hover': {
+      borderColor: _Identity.COLOR_V2.GRAY_50
+    },
+    '&:focus': {
+      borderColor: _Identity.COLOR_V2.GRAY_60
+    },
+    '&:active': {
+      backgroundColor: _Identity.COLOR_V2.BLUE_LIGHT_50,
+      borderColor: _Identity.COLOR_V2.BLUE_LIGHT_300,
+      svg: {
+        fill: _Identity.COLOR_V2.BLUE
+      }
+    }
+  })), variant === IconButtonVariant.SECONDARY && _objectSpread({
+    svg: {
+      fill: disabled ? _Identity.COLOR_V2.GRAY_60 : _Identity.COLOR_V2.BLACK
+    }
+  }, !disabled && {
+    '&:hover, &:focus, &:active': {
+      svg: {
+        fill: _Identity.COLOR_V2.BLUE
+      }
+    },
+    '&:focus': {
+      border: "1px solid ".concat(_Identity.COLOR_V2.BLUE_LIGHT_300)
+    },
+    '&:active': {
+      backgroundColor: _Identity.COLOR_V2.GRAY_10
+    }
+  }));
+};
+
+exports.iconButtonStyle = iconButtonStyle;
+
+var IconButton = function IconButton(_ref2) {
+  var children = _ref2.children,
+      props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
+  return (0, _react.jsx)("button", (0, _extends2["default"])({
+    css: function css(theme) {
+      return iconButtonStyle(theme, props);
+    }
+  }, filterButtonProps(props)), children);
+};
+
+exports.IconButton = IconButton;
+
+var filterButtonProps = function filterButtonProps(props) {
+  return (0, _util.filterProps)((0, _Text.filterTextProps)(props), ['backgroundColor']);
+};
+//# sourceMappingURL=IconButton.js.map

package/src/Misc/IconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["IconButton.tsx"],"names":["IconButtonVariant","iconButtonStyle","theme","variant","PRIMARY","backgroundColor","disabled","border","borderRadius","cursor","display","alignItems","justifyContent","marginBottom","padding","outline","textDecoration","touchAction","transition","defaultTransition","width","height","COLOR_V2","GRAY_20","WHITE","GRAY_40","svg","fill","GRAY_70","BLACK","borderColor","GRAY_50","GRAY_60","BLUE_LIGHT_50","BLUE_LIGHT_300","BLUE","SECONDARY","GRAY_10","IconButton","children","props","filterButtonProps"],"mappings":"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","sourcesContent":["/*\n * Wire\n * Copyright (C) 2022 Wire Swiss GmbH\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see http://www.gnu.org/licenses/.\n *\n */\n\n/** @jsx jsx */\nimport {CSSObject, jsx} from '@emotion/react';\n\nimport {COLOR_V2} from '../Identity';\nimport {defaultTransition} from '../Identity/motions';\nimport type {Theme} from '../Layout';\nimport {TextProps, filterTextProps} from '../Text';\nimport {filterProps} from '../util';\n\nenum IconButtonVariant {\n  PRIMARY = 'primary',\n  SECONDARY = 'secondary',\n}\n\nexport interface IconButtonProps<T = HTMLButtonElement> extends TextProps<T> {\n  variant?: IconButtonVariant;\n  backgroundColor?: string;\n}\n\nexport const iconButtonStyle: <T>(theme: Theme, props: IconButtonProps<T>) => CSSObject = (\n  theme,\n  {variant = IconButtonVariant.PRIMARY, backgroundColor, disabled = false},\n) => ({\n  border: 0,\n  borderRadius: '12px',\n  cursor: disabled ? 'default' : 'pointer',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  marginBottom: '16px',\n  padding: 0,\n  outline: 'none',\n  textDecoration: 'none',\n  touchAction: 'manipulation',\n  transition: defaultTransition,\n  width: '40px',\n  height: '32px',\n  '&:hover, &:focus': {\n    textDecoration: 'none',\n  },\n  ...(variant === IconButtonVariant.PRIMARY && {\n    backgroundColor: disabled ? COLOR_V2.GRAY_20 : backgroundColor || COLOR_V2.WHITE,\n    border: `1px solid ${COLOR_V2.GRAY_40}`,\n    svg: {\n      fill: disabled ? COLOR_V2.GRAY_70 : COLOR_V2.BLACK,\n    },\n    ...(!disabled && {\n      '&:hover, &:focus': {\n        backgroundColor: COLOR_V2.GRAY_20,\n      },\n      '&:hover': {\n        borderColor: COLOR_V2.GRAY_50,\n      },\n      '&:focus': {\n        borderColor: COLOR_V2.GRAY_60,\n      },\n      '&:active': {\n        backgroundColor: COLOR_V2.BLUE_LIGHT_50,\n        borderColor: COLOR_V2.BLUE_LIGHT_300,\n        svg: {\n          fill: COLOR_V2.BLUE,\n        },\n      },\n    }),\n  }),\n  ...(variant === IconButtonVariant.SECONDARY && {\n    svg: {\n      fill: disabled ? COLOR_V2.GRAY_60 : COLOR_V2.BLACK,\n    },\n    ...(!disabled && {\n      '&:hover, &:focus, &:active': {\n        svg: {\n          fill: COLOR_V2.BLUE,\n        },\n      },\n      '&:focus': {\n        border: `1px solid ${COLOR_V2.BLUE_LIGHT_300}`,\n      },\n      '&:active': {\n        backgroundColor: COLOR_V2.GRAY_10,\n      },\n    }),\n  }),\n});\n\nexport const IconButton = ({children, ...props}: IconButtonProps) => (\n  <button css={(theme: Theme) => iconButtonStyle(theme, props)} {...filterButtonProps(props)}>\n    {children}\n  </button>\n);\n\nconst filterButtonProps = (props: IconButtonProps) => {\n  return filterProps(filterTextProps(props) as IconButtonProps, ['backgroundColor']);\n};\n"],"file":"IconButton.js"}

package/src/Misc/IconButton.md

@@ -0,0 +1,43 @@
+Demo:
+
+```js
+import {IconButton, Container, Columns, Column, H2, InfoIcon} from '@wireapp/react-ui-kit';
+
+<Container>
+  <H2>Primary</H2>
+  <Columns>
+    <Column>Enabled</Column>
+    <Column>
+      <IconButton>
+        <InfoIcon />
+      </IconButton>
+    </Column>
+  </Columns>
+  <Columns>
+    <Column>Disabled</Column>
+    <Column>
+      <IconButton disabled onClick={() => alert('This should not work')}>
+        <InfoIcon />
+      </IconButton>
+    </Column>
+  </Columns>
+
+  <H2>Secondary</H2>
+  <Columns>
+    <Column>Enabled</Column>
+    <Column>
+      <IconButton variant="secondary">
+        <InfoIcon />
+      </IconButton>
+    </Column>
+  </Columns>
+  <Columns>
+    <Column>Disabled</Column>
+    <Column>
+      <IconButton variant="secondary" disabled onClick={() => alert('This should not work')}>
+        <InfoIcon />
+      </IconButton>
+    </Column>
+  </Columns>
+</Container>;
+```

package/src/Misc/childrenWithDefaultProps.d.ts

@@ -3,4 +3,4 @@ export interface ChildrenProps<T extends Element, P extends React.HTMLProps<T>>
     children: React.ReactNode;
     defaultProps: P;
 }
-export declare const childrenWithDefaultProps: <E extends Element, P extends unknown>(props: ChildrenProps<E, P>) => (React.ReactChild | React.ReactFragment | React.ReactPortal)[];
+export declare const childrenWithDefaultProps: <E extends Element, P extends unknown>(props: ChildrenProps<E, P>) => (string | number | React.ReactElement<any, string | React.JSXElementConstructor<any>> | React.ReactFragment | React.ReactPortal)[];