npm - @x15ventures/x15-ui-library - Versions diffs - 3.11.4 - Mend

@x15ventures/x15-ui-library 3.11.4

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 (1494) hide show

package/dist/styles/themes/x15Core/x15Core.css.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sourceRoot":"","sources":["file:///Users/katieboland/Projects/x15-ui-library/src/styles/themes/x15Core/darkTheme/variables.scss","file:///Users/katieboland/Projects/x15-ui-library/src/styles/shared/utilities/_mixins.scss","file:///Users/katieboland/Projects/x15-ui-library/src/styles/shared/partials/buttons/_buttonMixins.scss","file:///Users/katieboland/Projects/x15-ui-library/src/styles/shared/partials/colors/_colorVariables.scss","file:///Users/katieboland/Projects/x15-ui-library/src/styles/themes/x15Core/index.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AC+DA;AC1DA;AA8EE;EA+KA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAvCA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAvCA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACpRM;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AADf;EAAe;;;AACf;EAAe;;;AAMrB;EAIQ;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;;;ACVV;EACE;EACA;EACA;EACA;EAEA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;;AAIA;EACE;EACA;;AJxCF;EACE;;AIoCJ;EJjCE;EACA;EACA;EAEA;EACA;EAEA;EAEA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA"}

package/dist/styles/themes/x15Core/x15Core.min.3.11.4.css ADDED Viewed

@@ -0,0 +1 @@

+ :root{--primaryButtonBg: #e70077;--primaryButtonBorder: 1px solid #e70077;--primaryButtonFgColor: #fff;--primaryButtonBgHover: rgb(255, 1.5, 132.0909090909);--primaryButtonFgColorHover: #fff;--primaryButtonBorderHover: 1px solid rgb(255, 1.5, 132.0909090909);--primaryButtonFocusOutline: 1px solid rgb(255, 180, 218.6363636364);--primaryTextOnlyColor: #e70077;--primaryButtonInverseBg: rgb(255, 205.5, 231);--primaryButtonInverseBorder: 1px solid rgb(255, 205.5, 231);--primaryButtonInverseFgColor: #222;--primaryButtonInverseBgHover: rgb(255, 154.5, 206.2727272727);--primaryButtonInverseFgColorHover: #000;--primaryButtonInverseBorderHover: 1px solid rgb(255, 154.5, 206.2727272727);--primaryButtonInverseFocusOutline: 1px solid rgb(129, 0, 66.4545454545);--primaryButtonDisabledBg: rgba(231, 0, 119, 0.5);--primaryButtonDisabledBorder: 1px solid rgba(231, 0, 119, 0.5);--primaryButtonDisabledFgColor: rgba(255, 255, 255, 0.5);--primaryButtonDisabledBgHover: rgba(231, 0, 119, 0.5);--primaryButtonDisabledFgColorHover: rgba(255, 255, 255, 0.5);--primaryButtonDisabledBorderHover: 1px solid rgba(231, 0, 119, 0.5);--primaryButtonDisabledFocusOutline: 1px solid rgba(231, 0, 119, 0.35);--primaryButtonOutlineStyleBg: transparent;--primaryButtonOutlineStyleBorder: 1px solid rgb(255, 180, 218.6363636364);--primaryButtonOutlineStyleFgColor: #e70077;--primaryButtonOutlineStyleBgHover: transparent;--primaryButtonOutlineStyleFgColorHover: rgb(255, 27, 144.4545454545);--primaryButtonOutlineStyleBorderHover: 1px solid rgb(255, 27, 144.4545454545);--primaryButtonOutlineStyleFocusOutline: 1px solid rgb(255, 154.5, 206.2727272727);--primaryButtonOutlineInvertStyleBg: transparent;--primaryButtonOutlineInvertStyleBorder: 1px solid rgb(1.5, 0, 0.7727272727);--primaryButtonOutlineInvertStyleFgColor: rgb(1.5, 0, 0.7727272727);--primaryButtonOutlineInvertStyleBgHover: transparent;--primaryButtonOutlineInvertStyleFgColorHover: rgb(52.5, 0, 27.0454545455);--primaryButtonOutlineInvertStyleBorderHover: 1px solid rgb(52.5, 0, 27.0454545455);--primaryButtonOutlineInvertStyleFocusOutline: 1px solid rgb(129, 0, 66.4545454545);--secondaryButtonBg: #c8dce9;--secondaryButtonBorder: 1px solid #c8dce9;--secondaryButtonFgColor: #222;--secondaryButtonBgHover: rgb(218.2142857143, 231.5909090909, 240.2857142857);--secondaryButtonFgColorHover: #000;--secondaryButtonBorderHover: 1px solid rgb(218.2142857143, 231.5909090909, 240.2857142857);--secondaryButtonFocusOutline: 1px solid #c8dce9;--secondaryTextOnlyColor: #000;--secondaryButtonInverseBg: #000;--secondaryButtonInverseBorder: 1px solid #000;--secondaryButtonInverseFgColor: #c8dce9;--secondaryButtonInverseBgHover: #222;--secondaryButtonInverseFgColorHover: #fff;--secondaryButtonInverseBorderHover: 1px solid #222;--secondaryButtonInverseFocusOutline: 1px solid rgb(127.1428571429, 173.6363636364, 203.8571428571);--secondaryButtonDisabledBg: rgba(200, 220, 233, 0.5);--secondaryButtonDisabledBorder: 1px solid rgba(200, 220, 233, 0.5);--secondaryButtonDisabledFgColor: rgba(34, 34, 34, 0.5);--secondaryButtonDisabledBgHover: rgba(200, 220, 233, 0.5);--secondaryButtonDisabledFgColorHover: rgba(34, 34, 34, 0.5);--secondaryButtonDisabledBorderHover: 1px solid rgba(200, 220, 233, 0.5);--secondaryButtonDisabledFocusOutline: 1px solid rgba(200, 220, 233, 0.35);--secondaryButtonOutlineStyleBg: transparent;--secondaryButtonOutlineStyleBorder: 1px solid #c8dce9;--secondaryButtonOutlineStyleFgColor: rgb(58.1428571429, 111, 145.3571428571);--secondaryButtonOutlineStyleBgHover: transparent;--secondaryButtonOutlineStyleFgColorHover: rgb(58.1428571429, 111, 145.3571428571);--secondaryButtonOutlineStyleBorderHover: 1px solid rgb(58.1428571429, 111, 145.3571428571);--secondaryButtonOutlineStyleFocusOutline: 1px solid rgb(58.1428571429, 111, 145.3571428571);--secondaryButtonOutlineInvertStyleBg: transparent;--secondaryButtonOutlineInvertStyleBorder: 1px solid #c8dce9;--secondaryButtonOutlineInvertStyleFgColor: #c8dce9;--secondaryButtonOutlineInvertStyleBgHover: transparent;--secondaryButtonOutlineInvertStyleFgColorHover: rgb(72.7142857143, 138.8181818182, 181.7857142857);--secondaryButtonOutlineInvertStyleBorderHover: 1px solid rgb(72.7142857143, 138.8181818182, 181.7857142857);--secondaryButtonOutlineInvertStyleFocusOutline: 1px solid rgb(127.1428571429, 173.6363636364, 203.8571428571);--tertiaryButtonBg: #24282b;--tertiaryButtonBorder: 1px solid #24282b;--tertiaryButtonFgColor: #fff;--tertiaryButtonBgHover: rgb(47.6202531646, 52.9113924051, 56.8797468354);--tertiaryButtonFgColorHover: #fff;--tertiaryButtonBorderHover: 1px solid rgb(47.6202531646, 52.9113924051, 56.8797468354);--tertiaryButtonFocusOutline: 1px solid rgb(131.4430379747, 142.9367088608, 151.5569620253);--tertiaryTextOnlyColor: #24282b;--tertiaryButtonInverseBg: rgb(145.3227848101, 155.5253164557, 163.1772151899);--tertiaryButtonInverseBorder: 1px solid rgb(145.3227848101, 155.5253164557, 163.1772151899);--tertiaryButtonInverseFgColor: #222;--tertiaryButtonInverseBgHover: rgb(117.5632911392, 130.3481012658, 139.9367088608);--tertiaryButtonInverseFgColorHover: #000;--tertiaryButtonInverseBorderHover: 1px solid rgb(117.5632911392, 130.3481012658, 139.9367088608);--tertiaryButtonInverseFocusOutline: 1px solid hsl(205.7142857143, 8.8607594937%, -4.5098039216%);--tertiaryButtonDisabledBg: rgba(36, 40, 43, 0.5);--tertiaryButtonDisabledBorder: 1px solid rgba(36, 40, 43, 0.5);--tertiaryButtonDisabledFgColor: rgba(255, 255, 255, 0.5);--tertiaryButtonDisabledBgHover: rgba(36, 40, 43, 0.5);--tertiaryButtonDisabledFgColorHover: rgba(255, 255, 255, 0.5);--tertiaryButtonDisabledBorderHover: 1px solid rgba(36, 40, 43, 0.5);--tertiaryButtonDisabledFocusOutline: 1px solid rgba(36, 40, 43, 0.35);--tertiaryButtonOutlineStyleBg: transparent;--tertiaryButtonOutlineStyleBorder: 1px solid rgb(131.4430379747, 142.9367088608, 151.5569620253);--tertiaryButtonOutlineStyleFgColor: #24282b;--tertiaryButtonOutlineStyleBgHover: transparent;--tertiaryButtonOutlineStyleFgColorHover: rgb(59.2405063291, 65.8227848101, 70.7594936709);--tertiaryButtonOutlineStyleBorderHover: 1px solid rgb(59.2405063291, 65.8227848101, 70.7594936709);--tertiaryButtonOutlineStyleFocusOutline: 1px solid rgb(117.5632911392, 130.3481012658, 139.9367088608);--tertiaryButtonOutlineInvertStyleBg: transparent;--tertiaryButtonOutlineInvertStyleBorder: 1px solid hsl(205.7142857143, 8.8607594937%, -29.5098039216%);--tertiaryButtonOutlineInvertStyleFgColor: hsl(205.7142857143, 8.8607594937%, -29.5098039216%);--tertiaryButtonOutlineInvertStyleBgHover: transparent;--tertiaryButtonOutlineInvertStyleFgColorHover: hsl(205.7142857143, 8.8607594937%, -19.5098039216%);--tertiaryButtonOutlineInvertStyleBorderHover: 1px solid hsl(205.7142857143, 8.8607594937%, -19.5098039216%);--tertiaryButtonOutlineInvertStyleFocusOutline: 1px solid hsl(205.7142857143, 8.8607594937%, -4.5098039216%)}.primaryButtonBg_fg{color:var(--primaryButtonBg)}.primaryButtonBg_bg{background-color:var(--primaryButtonBg)}.secondaryButtonBg_fg{color:var(--secondaryButtonBg)}.secondaryButtonBg_bg{background-color:var(--secondaryButtonBg)}.tertiaryButtonBg_fg{color:var(--tertiaryButtonBg)}.tertiaryButtonBg_bg{background-color:var(--tertiaryButtonBg)}.baseTextColor_fg{color:var(--baseTextColor)}.baseTextColor_bg{background-color:var(--baseTextColor)}.inverseTextColor_fg{color:var(--inverseTextColor)}.inverseTextColor_bg{background-color:var(--inverseTextColor)}.baseTint_fg{color:var(--baseTint)}.baseTint_bg{background-color:var(--baseTint)}.inverseTint_fg{color:var(--inverseTint)}.inverseTint_bg{background-color:var(--inverseTint)}.palette1_fg{color:var(--palette1)}.palette1_bg{background-color:var(--palette1)}.palette2_fg{color:var(--palette2)}.palette2_bg{background-color:var(--palette2)}.palette1-900_fg{color:var(--palette1-900)}.palette1-900_bg{background-color:var(--palette1-900)}.palette1-800_fg{color:var(--palette1-800)}.palette1-800_bg{background-color:var(--palette1-800)}.palette1-700_fg{color:var(--palette1-700)}.palette1-700_bg{background-color:var(--palette1-700)}.palette1-600_fg{color:var(--palette1-600)}.palette1-600_bg{background-color:var(--palette1-600)}.palette1-500_fg{color:var(--palette1-500)}.palette1-500_bg{background-color:var(--palette1-500)}.palette1-400_fg{color:var(--palette1-400)}.palette1-400_bg{background-color:var(--palette1-400)}.palette1-300_fg{color:var(--palette1-300)}.palette1-300_bg{background-color:var(--palette1-300)}.palette1-200_fg{color:var(--palette1-200)}.palette1-200_bg{background-color:var(--palette1-200)}.palette1-100_fg{color:var(--palette1-100)}.palette1-100_bg{background-color:var(--palette1-100)}.palette1-50_fg{color:var(--palette1-50)}.palette1-50_bg{background-color:var(--palette1-50)}.palette2-900_fg{color:var(--palette2-900)}.palette2-900_bg{background-color:var(--palette2-900)}.palette2-800_fg{color:var(--palette2-800)}.palette2-800_bg{background-color:var(--palette2-800)}.palette2-700_fg{color:var(--palette2-700)}.palette2-700_bg{background-color:var(--palette2-700)}.palette2-600_fg{color:var(--palette2-600)}.palette2-600_bg{background-color:var(--palette2-600)}.palette2-500_fg{color:var(--palette2-500)}.palette2-500_bg{background-color:var(--palette2-500)}.palette2-400_fg{color:var(--palette2-400)}.palette2-400_bg{background-color:var(--palette2-400)}.palette2-300_fg{color:var(--palette2-300)}.palette2-300_bg{background-color:var(--palette2-300)}.palette2-200_fg{color:var(--palette2-200)}.palette2-200_bg{background-color:var(--palette2-200)}.palette2-100_fg{color:var(--palette2-100)}.palette2-100_bg{background-color:var(--palette2-100)}.palette2-50_fg{color:var(--palette2-50)}.palette2-50_bg{background-color:var(--palette2-50)}.white_fg{color:var(--white)}.white_bg{background-color:var(--white)}.white-10_fg{color:var(--white-10)}.white-10_bg{background-color:var(--white-10)}.white-20_fg{color:var(--white-20)}.white-20_bg{background-color:var(--white-20)}.white-30_fg{color:var(--white-30)}.white-30_bg{background-color:var(--white-30)}.white-40_fg{color:var(--white-40)}.white-40_bg{background-color:var(--white-40)}.white-50_fg{color:var(--white-50)}.white-50_bg{background-color:var(--white-50)}.white-60_fg{color:var(--white-60)}.white-60_bg{background-color:var(--white-60)}.white-70_fg{color:var(--white-70)}.white-70_bg{background-color:var(--white-70)}.white-80_fg{color:var(--white-80)}.white-80_bg{background-color:var(--white-80)}.white-90_fg{color:var(--white-90)}.white-90_bg{background-color:var(--white-90)}.black_fg{color:var(--black)}.black_bg{background-color:var(--black)}.black-10_fg{color:var(--black-10)}.black-10_bg{background-color:var(--black-10)}.black-20_fg{color:var(--black-20)}.black-20_bg{background-color:var(--black-20)}.black-30_fg{color:var(--black-30)}.black-30_bg{background-color:var(--black-30)}.black-40_fg{color:var(--black-40)}.black-40_bg{background-color:var(--black-40)}.black-50_fg{color:var(--black-50)}.black-50_bg{background-color:var(--black-50)}.black-60_fg{color:var(--black-60)}.black-60_bg{background-color:var(--black-60)}.black-70_fg{color:var(--black-70)}.black-70_bg{background-color:var(--black-70)}.black-80_fg{color:var(--black-80)}.black-80_bg{background-color:var(--black-80)}.black-90_fg{color:var(--black-90)}.black-90_bg{background-color:var(--black-90)}.neutral_fg{color:var(--neutral)}.neutral_bg{background-color:var(--neutral)}.neutral-10_fg{color:var(--neutral-10)}.neutral-10_bg{background-color:var(--neutral-10)}.neutral-20_fg{color:var(--neutral-20)}.neutral-20_bg{background-color:var(--neutral-20)}.neutral-30_fg{color:var(--neutral-30)}.neutral-30_bg{background-color:var(--neutral-30)}.neutral-40_fg{color:var(--neutral-40)}.neutral-40_bg{background-color:var(--neutral-40)}.neutral-50_fg{color:var(--neutral-50)}.neutral-50_bg{background-color:var(--neutral-50)}.neutral-60_fg{color:var(--neutral-60)}.neutral-60_bg{background-color:var(--neutral-60)}.neutral-70_fg{color:var(--neutral-70)}.neutral-70_bg{background-color:var(--neutral-70)}.neutral-80_fg{color:var(--neutral-80)}.neutral-80_bg{background-color:var(--neutral-80)}.neutral-90_fg{color:var(--neutral-90)}.neutral-90_bg{background-color:var(--neutral-90)}.neutral-95_fg{color:var(--neutral-95)}.neutral-95_bg{background-color:var(--neutral-95)}:root{--primaryButtonBg: rgb(231, 0, 119);--secondaryButtonBg: rgb(200, 220, 233);--tertiaryButtonBg: rgb(36, 40, 43);--baseTextColor: rgb(24, 26, 27);--inverseTextColor: rgb(246, 248, 250);--baseTint: rgb(255, 255, 255);--inverseTint: rgb(0, 0, 0);--palette1: rgb(231, 0, 119);--palette2: rgb(200, 220, 233);--palette1-900: rgb(63, 13, 37);--palette1-800: rgb(116, 28, 70);--palette1-700: rgb(176, 37, 104);--palette1-600: rgb(193, 23, 105);--palette1-500: rgb(236, 0, 140);--palette1-400: rgb(243, 71, 174);--palette1-300: rgb(245, 124, 197);--palette1-200: rgb(245, 178, 219);--palette1-100: rgb(255, 214, 238);--palette1-50: rgb(255, 241, 249);--palette2-900: rgb(36, 40, 43);--palette2-800: rgb(56, 65, 71);--palette2-700: rgb(81, 100, 114);--palette2-600: rgb(126, 151, 167);--palette2-500: rgb(168, 188, 201);--palette2-400: rgb(194, 208, 217);--palette2-300: rgb(211, 222, 228);--palette2-200: rgb(229, 235, 239);--palette2-100: rgb(238, 242, 244);--palette2-50: rgb(246, 248, 250);--white: rgb(255, 255, 255);--white-10: rgb(242, 242, 242);--white-20: rgb(230, 230, 230);--white-30: rgb(217, 217, 217);--white-40: rgb(204, 204, 204);--white-50: rgb(191, 191, 191);--white-60: rgb(179, 179, 179);--white-70: rgb(166, 166, 166);--white-80: rgb(153, 153, 153);--white-90: rgb(140, 140, 140);--black: rgb(0, 0, 0);--black-10: rgb(13, 13, 13);--black-20: rgb(26, 26, 26);--black-30: rgb(38, 38, 38);--black-40: rgb(51, 51, 51);--black-50: rgb(64, 64, 64);--black-60: rgb(77, 77, 77);--black-70: rgb(89, 89, 89);--black-80: rgb(102, 102, 102);--black-90: rgb(115, 115, 115);--neutral: rgb(168, 188, 201);--neutral-10: rgb(24, 26, 27);--neutral-20: rgb(36, 40, 43);--neutral-30: rgb(56, 65, 71);--neutral-40: rgb(81, 100, 114);--neutral-50: rgb(126, 151, 167);--neutral-60: rgb(194, 208, 217);--neutral-70: rgb(211, 222, 228);--neutral-80: rgb(229, 235, 239);--neutral-90: rgb(238, 242, 244);--neutral-95: rgb(246, 248, 250)}:root{--tooltipIconBg: #e70077;--tooltipIconFgColor: #fff;--tooltipContentBg: #e5ebef;--tooltipContentFgColor: #181a1b;--accordionHeaderFont: "Catalogue", "Arial", "Helvetica", sans-serif;--bodyFont: "Catalogue", "Arial", "Helvetica", sans-serif;--headingFont: "Catalogue", "Arial", "Helvetica", sans-serif;--chipFontAdjust: 0.9em;--chipYellowSoftBorder: rgb(246.6875, 198, 168.3125);--chipOrangeSoftBorder: rgb(252.145631068, 221.4611650485, 208.854368932);--chipRedSoftBorder: rgb(249.4788732394, 218.5211267606, 218.5211267606);--chipPurpleSoftBorder: rgb(229.7462686567, 209.8656716418, 246.1343283582);--chipBlueSoftBorder: rgb(212.3170731707, 220.6097560976, 247.6829268293);--chipGreenSoftBorder: rgb(146.6097560976, 231.3902439024, 178.8048780488);--chipDarkgreySoftBorder: rgb(184.125, 192.875, 206.875);--chipLightgreySoftBorder: rgb(244.1063829787, 244.7021276596, 245.8936170213);--chipBorder: 1px solid;--bannerAlertBg: #e70077;--bannerAlertBgSecondary: rgb(255, 78, 169.1818181818);--bannerAlertSecondaryBorder: #e70077}.dark-theme body{background-color:#000;color:#fff}.dark-theme ::-webkit-scrollbar-track{box-shadow:1px 1px 3px inset #45f5a5}.dark-theme{--bodyBg: #000;--bodyFgColor: #fff;--chipFontAdjust: 0.9em;--scrollBarFgColor: #999;--scrollBarBgColor: #333;--pageContainerBg: #000;--mainHeaderBg: #000;--mainHeaderFgColor: #fff;--mainHeaderBorderBottom: 1px solid #e70077;--mainHeaderBoxShadow: 0 3px 5px 0 #e70077;--mainContentBg: #000;--mainContentFgColor: #fff;--accordionBorder: 1px solid #45f5a5;--accordionHeaderIconColor: #f347ae;--accordionHeaderBorder: 1px solid #45f5a5;--accordionHeaderBoxShadow: 0 2px 5px 0 #2c93ce;--cardBorder: 1px solid #45f5a5;--cardBoxShadow: 0 0 5px 0 #2c93ce;--cardHeaderBg: none;--cardHeaderFg: #fff;--cardHeaderBorder: 1px solid #45f5a5;--cardHeaderBoxShadow: 0 1px 5px 0 #2c93ce;--cardHeaderIconColor: #fff;--cardContentBg: none;--cardContentFg: #fff;--cardFooterBg: none;--cardFooterFg: #fff;--cardFooterBorder: 1px solid #45f5a5;--cardFooterBoxShadow: 0 -1px 5px 0 #2c93ce;--dialogOverlayColor: rgba(66, 66, 66, 0.5);--dialogBg: #222;--dialogFg: #fff;--dialogBorder: 1px solid #45f5a5;--dialogBorderRadius: 3px;--dialogShadow: 0 0 10px 0 #2c93ce;--dialogHeaderHeight: 50px;--dialogHeaderBottomBorder: 1px solid #45f5a5;--dialogHeaderShadow: 0 1px 3px 0 #2c93ce;--dialogHeaderPadding: 0 20px;--dialogContentPadding: 20px;--dialogFooterPadding: 0 20px;--dialogFooterHeight: 50px;--dialogFooterTopBorder: 1px solid #45f5a5;--dialogFooterShadow: 0 -1px 3px 0 #2c93ce;--dialogCloseButtonBg: #000;--dialogCloseButtonFg: #45f5a5;--dialogCloseButtonBorder: 1px solid #45f5a5;--dialogCloseButtonShadow: 0 0 5px 0 #2c93ce;--notificationIconBg: #f347ae;--notificationIconFg: #000;--notificationIconBorder: 4px solid #f347ae;--notificationIconBoxShadow: 0 0 3px 0 #45f5a5;--tooltipIconBg: #e70077;--tooltipIconFgColor: #000;--tooltipContentBg: hsl(203.6363636364, 23.4042553191%, 107.3529411765%);--tooltipContentFgColor: #fff}

package/dist/styles/themes/x15Core/x15Core.min.3.11.4.css.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sourceRoot":"","sources":["file:///Users/katieboland/Projects/x15-ui-library/src/styles/shared/partials/buttons/_buttonMixins.scss","file:///Users/katieboland/Projects/x15-ui-library/src/styles/shared/partials/colors/_colorVariables.scss","file:///Users/katieboland/Projects/x15-ui-library/src/styles/themes/x15Core/index.scss","file:///Users/katieboland/Projects/x15-ui-library/src/styles/themes/x15Core/darkTheme/variables.scss"],"names":[],"mappings":"AAmFE,MA+KA,2BACA,yCACA,6BACA,sDACA,kCACA,oEACA,qEACA,gCAEA,+CACA,6DACA,oCACA,+DACA,yCACA,6EACA,yEAEA,kDACA,gEACA,yDACA,uDACA,8DACA,qEACA,uEAEA,2CACA,2EACA,4CACA,gDACA,sEACA,+EACA,mFAEA,iDACA,6EACA,oEACA,sDACA,2EACA,oFACA,oFAvCA,6BACA,2CACA,+BACA,8EACA,oCACA,4FACA,iDACA,+BAEA,iCACA,+CACA,yCACA,sCACA,2CACA,oDACA,oGAEA,sDACA,oEACA,wDACA,2DACA,6DACA,yEACA,2EAEA,6CACA,uDACA,8EACA,kDACA,mFACA,4FACA,6FAEA,mDACA,6DACA,oDACA,wDACA,oGACA,6GACA,+GAvCA,4BACA,0CACA,8BACA,0EACA,mCACA,wFACA,4FACA,iCAEA,+EACA,6FACA,qCACA,oFACA,0CACA,kGACA,kGAEA,kDACA,gEACA,0DACA,uDACA,+DACA,qEACA,uEAEA,4CACA,kGACA,6CACA,iDACA,2FACA,oGACA,wGAEA,kDACA,wGACA,+FACA,uDACA,oGACA,6GACA,6GCpRM,iDACA,4DADA,qDACA,gEADA,mDACA,8DADA,6CACA,wDADA,mDACA,8DADA,mCACA,8CADA,yCACA,oDADA,mCACA,8CADA,mCACA,8CADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,yCACA,oDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,2CACA,sDADA,yCACA,oDADA,6BACA,wCADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,6BACA,wCADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,mCACA,8CADA,iCACA,4CADA,uCACA,kDADA,uCACA,kDADA,uCACA,kDADA,uCACA,kDADA,uCACA,kDADA,uCACA,kDADA,uCACA,kDADA,uCACA,kDADA,uCACA,kDADA,uCACA,kDAMN,MAIQ,i4DCVV,MACE,yBACA,2BACA,4BACA,iCAEA,qEAEA,0DACA,6DAEA,wBACA,qDACA,0EACA,yEACA,4EACA,0EACA,2EACA,yDACA,+EACA,wBAEA,yBACA,uDACA,sCAIA,iBACE,sBACA,WCxCF,sCACE,qCDoCJ,YCjCE,eACA,oBACA,wBAEA,yBACA,yBAEA,wBAEA,qBACA,0BACA,4CACA,2CAEA,sBACA,2BAEA,qCACA,oCACA,2CACA,gDAEA,gCACA,mCACA,qBACA,qBACA,sCACA,2CACA,4BACA,sBACA,sBACA,qBACA,qBACA,sCACA,4CAEA,4CACA,iBACA,iBACA,kCACA,0BACA,mCACA,2BACA,8CACA,0CACA,8BACA,6BACA,8BACA,2BACA,2CACA,2CACA,4BACA,+BACA,6CACA,6CAEA,8BACA,2BACA,4CACA,+CAEA,yBACA,2BACA,yEACA"}

package/dist/styles/themes/x15Core/x15Core.min.css ADDED Viewed

@@ -0,0 +1 @@

package/dist/styles/themes/x15Core/x15Core.min.css.map ADDED Viewed

@@ -0,0 +1 @@

package/package.json ADDED Viewed

@@ -0,0 +1,337 @@
+{
+  "name": "@x15ventures/x15-ui-library",
+  "description": "Collection of UI resources for development",
+  "type": "module",
+  "main": "dist/cjs/index.js",
+  "module": "dist/esm/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.js"
+    },
+    "./components": {
+      "types": "./dist/components/index.d.ts",
+      "import": "./dist/esm/components/index.js",
+      "require": "./dist/cjs/components/index.js"
+    },
+    "./components/*": {
+      "types": "./dist/components/*.d.ts",
+      "import": "./dist/esm/components/*.js",
+      "require": "./dist/cjs/components/*.js"
+    },
+    "./constants": {
+      "types": "./dist/constants/index.d.ts",
+      "import": "./dist/esm/constants/index.js",
+      "require": "./dist/cjs/constants/index.js"
+    },
+    "./constants/*": {
+      "types": "./dist/constants/*.d.ts",
+      "import": "./dist/esm/constants/*.js",
+      "require": "./dist/cjs/constants/*.js"
+    },
+    "./interfaces": {
+      "types": "./dist/interfaces/index.d.ts",
+      "import": "./dist/esm/interfaces/index.js",
+      "require": "./dist/cjs/interfaces/index.js"
+    },
+    "./interfaces/*": {
+      "types": "./dist/interfaces/*.d.ts",
+      "import": "./dist/esm/interfaces/*.js",
+      "require": "./dist/cjs/interfaces/*.js"
+    },
+    "./helpers": {
+      "types": "./dist/helpers/index.d.ts",
+      "import": "./dist/esm/helpers/index.js",
+      "require": "./dist/cjs/helpers/index.js"
+    },
+    "./helpers/*": {
+      "types": "./dist/helpers/*.d.ts",
+      "import": "./dist/esm/helpers/*.js",
+      "require": "./dist/cjs/helpers/*.js"
+    },
+    "./hooks": {
+      "types": "./dist/hooks/index.d.ts",
+      "import": "./dist/esm/hooks/index.js",
+      "require": "./dist/cjs/hooks/index.js"
+    },
+    "./hooks/*": {
+      "types": "./dist/hooks/*.d.ts",
+      "import": "./dist/esm/hooks/*.js",
+      "require": "./dist/cjs/hooks/*.js"
+    },
+    "./mocks": {
+      "types": "./dist/mocks/index.d.ts",
+      "import": "./dist/esm/mocks/index.js",
+      "require": "./dist/cjs/mocks/index.js"
+    },
+    "./mocks/*": {
+      "types": "./dist/mocks/*.d.ts",
+      "import": "./dist/esm/mocks/*.js",
+      "require": "./dist/cjs/mocks/*.js"
+    },
+    "./contextProviders": {
+      "types": "./dist/contextProviders/index.d.ts",
+      "import": "./dist/esm/contextProviders/index.js",
+      "require": "./dist/cjs/contextProviders/index.js"
+    },
+    "./contextProviders/*": {
+      "types": "./dist/contextProviders/*.d.ts",
+      "import": "./dist/esm/contextProviders/*.js",
+      "require": "./dist/cjs/contextProviders/*.js"
+    },
+    "./fonts/*": "./dist/fonts/*",
+    "./styles/*": "./dist/styles/*",
+    "./images/*": "./dist/images/*"
+  },
+  "typesVersions": {
+    "*": {
+      "components/*": [
+        "dist/components/*.d.ts"
+      ],
+      "constants/*": [
+        "dist/constants/*.d.ts"
+      ],
+      "interfaces/*": [
+        "dist/interfaces/*.d.ts"
+      ],
+      "helpers/*": [
+        "dist/helpers/*.d.ts"
+      ],
+      "hooks/*": [
+        "dist/hooks/*.d.ts"
+      ],
+      "mocks/*": [
+        "dist/mocks/*.d.ts"
+      ],
+      "contextProviders/*": [
+        "dist/contextProviders/*.d.ts"
+      ],
+      "components": [
+        "dist/components/index.d.ts"
+      ],
+      "constants": [
+        "dist/constants/index.d.ts"
+      ],
+      "interfaces": [
+        "dist/interfaces/index.d.ts"
+      ],
+      "helpers": [
+        "dist/helpers/index.d.ts"
+      ],
+      "hooks": [
+        "dist/hooks/index.d.ts"
+      ],
+      "mocks": [
+        "dist/mocks/index.d.ts"
+      ],
+      "contextProviders": [
+        "dist/contextProviders/index.d.ts"
+      ],
+      "*": [
+        "dist/*.d.ts"
+      ]
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "version": "3.11.4",
+  "packageManager": "pnpm@10.11.0",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/x15ventures/x15-ui-library.git"
+  },
+  "scripts": {
+    "library:dev": "pnpm watch && pnpm serve",
+    "serve": "node localServer/server.js",
+    "watch": "pnpm watch:react && pnpm watch:sass",
+    "watch:react": "nodemon --watch src --ext ts,tsx --exec 'pnpm build:react'",
+    "watch:sass": "nodemon --watch src/styles --ext scss --exec 'pnpm build:sass'",
+    "build": "",
+    "build:cicd": "pnpm build:sass && pnpm build:react && pnpm build:types && pnpm build:sass",
+    "build:local": "pnpm build:react && pnpm storybook:build",
+    "build:react": "run-func buildLibrary.js buildLibrary",
+    "build:sass": "run-func sass.utilities.js buildSassFiles && pnpm storybook:styles",
+    "build:static": "pnpm build:react && pnpm build:sass",
+    "build:types": "npx tsc --build tsconfig.lib.json --force",
+    "build:ai:docs": "run-func aiTools/scripts/componentAIDocExtractor.js generateDocumentation",
+    "build:ai:library": "run-func buildLibrary.js makeAIReferenceFiles",
+    "build:ai:styles": "node aiTools/scripts/componentAICssExtractor.js",
+    "build:ai:styles:reference": "node aiTools/scripts/buildAiStylesReference.js",
+    "build:ai:concat": "node buildLibrary.ai.bundles.js",
+    "precommit": "lefthook run pre-commit",
+    "eslint": "eslint . --config eslint.config.js",
+    "eslint:fix": "eslint . --config eslint.config.js --fix",
+    "test": "cross-env TZ=UTC jest --config=config/jest/jest.config.cjs --runInBand --silent",
+    "storybook": "./start-storybook.sh && pnpm storybook:styles:watch",
+    "storybook:styles": "sass src/styles/storybook/storybook.scss dist/styles/storybook.css --no-source-map",
+    "storybook:styles:watch": "sass --watch src/styles/storybook/storybook.scss:dist/styles/storybook.css --no-source-map",
+    "storybook:dev": "ttab pnpm watch:sass && ttab pnpm storybook",
+    "storybook:debug": "ttab pnpm watch:sass && ttab pnpm storybook --debug-webpack",
+    "storybook:build": "pnpm install --frozen-lockfile && pnpm build:cicd && storybook build --config-dir config/storybook/web --output-dir ./storybook-static"
+  },
+  "dependencies": {
+    "@hookform/error-message": "^2.0.1",
+    "@semantic-release/exec": "^7.0.3",
+    "@x15ventures/x15-ui-library-icons": "^1.0.4",
+    "babel-plugin-transform-imports": "^2.0.0",
+    "html-react-parser": "^5.1.16",
+    "jsdom": "^26.1.0",
+    "react": "^18",
+    "react-dom": "^18",
+    "react-helmet": "^6.1.0",
+    "react-hook-form": "^7.53.0",
+    "run-func": "^3.0.0",
+    "storybook": "^10.1.10",
+    "use-debounce": "^10.0.3"
+  },
+  "peerDependencies": {
+    "core-js": "^3.44.0",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "storybook": "^10.1.10"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.26.4",
+    "@babel/core": "^7",
+    "@babel/eslint-parser": "^7.26.10",
+    "@babel/eslint-plugin": "^7.26.10",
+    "@babel/plugin-syntax-jsx": "^7.25.9",
+    "@babel/plugin-transform-class-properties": "^7.25.9",
+    "@babel/plugin-transform-modules-commonjs": "^7.26.3",
+    "@babel/plugin-transform-runtime": "^7",
+    "@babel/preset-env": "^7",
+    "@babel/preset-react": "^7",
+    "@babel/preset-typescript": "^7",
+    "@babel/runtime": "^7.26.10",
+    "@eslint/js": "^9.38.0",
+    "@jest/globals": "^29.7.0",
+    "@jest/types": "^29.6.3",
+    "@mdx-js/mdx": "^3.1.0",
+    "@mdx-js/react": "^3.1.0",
+    "@rollup/plugin-commonjs": "^28.0.2",
+    "@rollup/plugin-node-resolve": "^16.0.0",
+    "@rollup/plugin-typescript": "^12.1.2",
+    "@semantic-release/changelog": "^6.0.3",
+    "@semantic-release/commit-analyzer": "^13.0.1",
+    "@semantic-release/git": "^10.0.1",
+    "@semantic-release/npm": "^12.0.1",
+    "@semantic-release/release-notes-generator": "^14.0.3",
+    "@storybook/addon-a11y": "^10.1.10",
+    "@storybook/addon-docs": "^10.1.10",
+    "@storybook/addon-knobs": "^8.0.1",
+    "@storybook/addon-links": "^10.1.10",
+    "@storybook/addon-styling-webpack": "^1.0.0",
+    "@storybook/cli": "^10.1.10",
+    "@storybook/core-events": "^8.2.8",
+    "@storybook/manager-api": "^8.3.6",
+    "@storybook/mdx2-csf": "^1.1.0",
+    "@storybook/preset-scss": "^1.0.3",
+    "@storybook/preview-api": "^8.6.12",
+    "@storybook/react": "^10.1.10",
+    "@storybook/react-webpack5": "^10.1.10",
+    "@storybook/types": "^8.6.14",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.0.1",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/enzyme": "^3.10.18",
+    "@types/enzyme-adapter-react-16": "^1.0.9",
+    "@types/jest": "^29.5.12",
+    "@types/node": "^20",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
+    "@types/react-helmet": "^6.1.11",
+    "@types/webpack": "^5.28.5",
+    "@types/webpack-env": "^1.18.5",
+    "@typescript-eslint/eslint-plugin": "^8.22.0",
+    "@typescript-eslint/parser": "^8.22.0",
+    "@x15stack/aws": "^1.6.5",
+    "autoprefixer": "^10.4.23",
+    "babel-jest": "^30.2.0",
+    "babel-loader": "^9.1.3",
+    "babel-plugin-macros": "^3.1.0",
+    "chromatic": "^11.10.1",
+    "copy-webpack-plugin": "^12.0.2",
+    "cors": "^2.8.5",
+    "cross-env": "^7.0.3",
+    "css-loader": "^7.1.2",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.8",
+    "esbuild": "^0.25.0",
+    "esbuild-sass-plugin": "^3.3.1",
+    "eslint": "^9.19.0",
+    "eslint-import-resolver-typescript": "^3.7.0",
+    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-jest": "^28.11.0",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-react": "^7.37.4",
+    "eslint-plugin-storybook": "10.1.10",
+    "express": "^5.2.1",
+    "file-loader": "^6.2.0",
+    "fs": "0.0.1-security",
+    "fs-extra": "^11.3.0",
+    "glob": "^11.0.1",
+    "globals": "^15.14.0",
+    "jest": "^30.2.0",
+    "jest-environment-jsdom": "^29.7.0",
+    "lefthook": "^1.11.2",
+    "nodemon": "^3.1.4",
+    "npm-run-all": "^4.1.5",
+    "null-loader": "^4.0.1",
+    "postcss": "^8.5.6",
+    "postcss-loader": "^8.1.1",
+    "raw-loader": "^4.0.2",
+    "react-docgen-typescript": "^2.2.2",
+    "react-docgen-typescript-loader": "^3.7.2",
+    "react-dropzone": "^14.3.8",
+    "sass": "^1.83.4",
+    "sass-loader": "^16.0.5",
+    "semantic-release": "^24.2.1",
+    "style-loader": "^4.0.0",
+    "ts-jest": "^29.2.5",
+    "ts-morph": "^25.0.0",
+    "tsconfig-paths-webpack-plugin": "^4.1.0",
+    "ttab": "^0.9.0",
+    "typescript": "5.5.4",
+    "url-loader": "^4.1.1",
+    "vitest": "3.1.1"
+  },
+  "pnpm": {
+    "overrides": {
+      "brace-expansion": "2.0.1",
+      "form-data": ">=4.0.4",
+      "react": "^18",
+      "react-dom": "^18",
+      "cookie": "1.0.1",
+      "cross-spawn@<7.0.5": ">=7.0.5",
+      "vitest-axe>vitest": "3.1.1",
+      "vite": ">=7.1.11",
+      "@webpack-contrib/schema-utils>webpack": "5.97.1",
+      "@octokit/request-error@>=6.0.0 <6.1.7": ">=6.1.7",
+      "@octokit/endpoint@>=10.0.0 <10.1.3": ">=10.1.3",
+      "@octokit/request@>=1.0.0 <9.2.1": ">=9.2.1",
+      "@octokit/plugin-paginate-rest@>=1.0.0 <11.4.1": ">=11.4.1",
+      "esbuild@<=0.24.2": ">=0.25.0",
+      "@babel/runtime": "^7.26.10",
+      "@eslint/plugin-kit": ">=0.3.4",
+      "brace-expansion@>=1.0.0 <=1.1.11": ">=1.1.12",
+      "brace-expansion@>=2.0.0 <=2.0.1": ">=2.0.2",
+      "minimatch>brace-expansion": "2.0.2",
+      "js-yaml": ">=4.1.1",
+      "glob": ">=11.1.0",
+      "mdast-util-to-hast@>=13.0.0 <13.2.1": ">=13.2.1",
+      "qs@<6.14.1": ">=6.14.1",
+      "lodash-es": ">=4.17.23",
+      "lodash": ">=4.17.23",
+      "undici": ">=7.18.2"
+    },
+    "auditConfig": {
+      "ignoreCves": [
+        "GHSA-rx8g-88g5-qh64",
+        "CVE-2025-57352"
+      ]
+    }
+  }
+}

package/readme.md ADDED Viewed

@@ -0,0 +1,207 @@
+# x15 UI Library
+## Pre-requisites
+You will need to have the following installed on your machine to be able to run the commands below.
+Refer to the Appendix for further instructions if required.
+- Node
+- nvm
+- sass
+- homebrew
+## NPMRC
+To use the library, you will need to add a .npmrc file to your project with the following content:
+```shell
+@x15ventures:registry=https://npm.pkg.github.com
+@x15stack:registry=https://npm.pkg.github.com
+//npm.pkg.github.com/:_authToken=${GITHUB_TOKEN}
+```
+This will allow you to install the x15-ui-library-icons from GitHub packages. You will need to set the GITHUB_TOKEN environment variable to a personal access token with the `read:packages` scope.
+## Installation
+Note: This project uses pnpm as the package manager and is treated as its own workspace to ensure that it can be used within a turbo repo but also as a standalone project. If you do include it inside a turbo repo, you will need to make sure to exclude it from the turbo repo's workspace. You can do this by adding to the parent turbo repo's pnpm-workspace.yaml file:
+```shell
+pnpm add @x15ventures/x15-ui-library storybook core-js
+```
+To install the project dependencies, run the following command:
+```shell
+pnpm install
+```
+You should notice that the library has its own pnpm-lock.yaml file and node_modules directory. If you add new dependencies to the project, please ensure that the lock file is updated and committed.
+## Building the project
+To build the project, you can use the following command:
+```shell
+pnpm build:cicd
+```
+This will run a custom script that babels the tsx files and creates commonjs files in the dist directory. It will also compile the scss files to css. The package tar file will include the src, styles, icons and dist directories.
+**Important**: The build:cicd command starts and finishes with the same command build:sass. It is necessary to pre-build the styles as they are leveraged by part of the react build process. They are then rebuilt to create additional versions.
+## Running the project locally
+The project uses storybook and jest unit tests to ensure that the components are working as expected. To run storybook locally, you can use the following commands:
+```shell
+pnpm storybook:dev
+```
+This will start storybook at http://localhost:9006/ so you can view the components in the browser. It will also start a custom sass watcher that will compile the scss files to css whenever changes are made.
+## Running the library locally
+### Emulated CDN
+The library can be run locally as an emulated CDN using Docker. This is useful for testing the library in a
+production-like environment. Add the following to your docker-compose.yml file:
+```yaml
+    component-cdn:
+    build:
+      context: .
+      dockerfile: packages/x15-ui-library/Dockerfile
+    ports:
+      - "3300:3300"
+```
+Then run the following command:
+```shell
+docker-compose up --build
+```
+This will start the library at http://localhost:3300/ so you can serve the components in the browser.
+### As a workspace package
+In the consuming apps package.json file swap the dependency to be workspace:* and run the following command:
+```shell
+pnpm install
+```
+Then edit your tsconfig.json file so that the paths are pointing to the correct location:
+```json
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@x15/ui-library": [
+        "packages/x15-ui-library/src"
+      ],
+      "@x15/ui-library/*": [
+        "packages/x15-ui-library/src"
+      ]
+    }
+  }
+}
+```
+## Committing changes
+The library uses lefthook to manage pre-commit hooks. To install the pre-commit hooks, run the following command:
+```shell
+lefthook install
+```
+## Publishing the library
+The library uses the semantic-versioning npm package to manage versioning. To publish a new version of the library, when you check in your changes, you will need to prefix your commit message with one of the following:
+- fix: A bug fix
+- feat: A new feature
+- BREAKING CHANGE: A breaking change
+Once your PR has met all the required criteria including a successful build and at least 1 approval and no requested changes, a GitHub action will automatically increase the version number, merge and delete the branch, and publish the package to GitHub packages. This will automatically increment the version number based on the changes you have made.
+# Appendix
+## Installation guides
+Install homebrew first as you can use it to install many of the other apps.
+Note you will need to set your Mac to elevated privileges first.
+### Homebrew
+If you do not have homebrew installed you can use this command on a mac to install it.
+```shell
+/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
+```
+### NodeJs
+```shell
+brew install node
+```
+### SASS
+```shell
+brew install sass
+```
+### NVM (Node version manager)
+```shell
+curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash
+```
+## Tips, tricks and FAQs
+### How do all the pieces work?
+The scss files are compiled to css and the tsx files are compiled to commonjs files. The dist directory is then packaged up into a tar file that is published to GitHub packages. The library can then be consumed by other projects.
+The library is built using custom build scripts that run the required processors. There are also custom watchers to handle instant updates and hot reloading.
+For the sass functionality, the building and watching functionality is handled by the **sass.utilities.js** file. This script also copies static assets such as icons, images and fonts to the dist directory.
+The compilation of the tsx files is handled by **buildLibrary.js**. This script babels the tsx files and creates files in the dist directory suitable for a range of different JS versions. It also makes some minor adjustments to the css import paths.
+### Why isn't it bundled into a single file?
+The library is designed to be consumed by other projects and as such, it is more efficient to have the library as separate files. This allows the consuming project to only import the components that are required. It also allows for better tree shaking and smaller bundle sizes.
+### Why are the scss files built into separate css files?
+The library supports theming via scss variables and css variables. By having the scss files as separate files, it allows the consuming project to import only the theme that they require or all themes if they wish. In the case of an app that wants to support multiple themes, it can import all the themes and switch between them as required.
+Alternative methods such as css-in-js or css modules have not been used for a number of reasons:
+1. they are not as flexible as scss and css files.
+2. they require more processing
+3. are not as easy to maintain
+4. require complex logic to support theming - especially when using css-in-js
+5. require complex build configurations to support theming.
+Most bundlers are not designed well to handle more than 2 themes at most in a single build. They are typically setup to create a single highly compressed bundled css file for optimised performance in the browser. However, to support theming, the different theme styles need to be built separately otherwise the css variables conflict and override with each other essentially meaning the different styles don't actually get applied.
+### Why is there an empty build script in the package.json file?
+The library is designed to be able to run in a turbo repo or as a standalone project. When it is hosted inside a turbo repo, the 'build' command from the turbo repo affects aspects of the library in an undesired manner. As such, the script is left empty so that it doesn't run but exists to not cause issues in the turbo repo. Instead, the library has its own build scripts as follows.
+| Build Commands   | Description                                                                                   |
+|------------------|-----------------------------------------------------------------------------------------------|
+| **pnpm build:cicd** | Used by the CICD process to create the full set of assets required for a distributed package. |
+| pnpm build:local | Used to build the library for local development. This includes building the storybook.        |
+| pnpm build:react | An efficiency function for rebuilding just the react components.                              |
+| pnpm build:sass  | An efficiency function for rebuilding just the scss files.                                    |
+| pnpm build:static | An efficiency function for rebuilding just the react and scss files.                          |
+| pnpm build:types | Used for distribution builds only. Creates .d.ts files in the dist.                           |
+| pnpm build:svgicons | Used to convert the SVG icons in src/icons/svgIconLibrary/sourceSvgs into icon definitions    |
+### Emulated CDN
+The library also includes a localServer so that you can serve it as a static site emulating a CDN. To run the localServer, you can use the following command:
+```shell
+pnpm serve
+```
+This will start the server at http://localhost:3300/ so you can serve the css files as absolute URLs in the browser. You can specify an alternate port by adding the port number to your .env file:
+```shell
+PORT=3300
+```
+It will treat the dist file as a static site and serve the css files and other static assets as absolute URLs. You will need to make sure you build the library first to generate the dist files.
+```