fix(examples): update slider import to actual deployed package (#35)

* chore(examples): install sliders dependency

* fix(examples): use actual package

* docs(readme): remove mention about perfekt

* chore(prettier): ignore changelog

* docs(example): update link to CodeSandbox

* docs: add list of links to CodeSandbox examples

Author: xhudec

.prettierignore

@@ -1,3 +1,6 @@
 node_modules
 .cache
 dist
+
+# Generated by `semantic-release`
+CHANGELOG.md

README.md

@@ -40,7 +40,6 @@
 - [x] Fully typed with TypeScript
 - [x] Based on [our already existing open source tools](https://www.strv.io/tools/frontend)
   - [`code-quality-tools`](https://github.com/strvcom/code-quality-tools)
-  - [`perfekt`](https://github.com/lekterable/perfekt)
 
 ## Install
 
@@ -109,6 +108,8 @@ const SliderExample = () => {
 }
 ```
 
+If you want so see more, head to the [list of existing CodeSandbox examples](examples/README.md).
+
 ### Hooks API
 
 - [`useSlider`](src/hooks/docs/useSlider.md)

examples/README.md

@@ -0,0 +1,3 @@
+# CodeSandbox Examples
+
+- [with `styled-components`](https://codesandbox.io/s/github/strvcom/react-sliders/tree/master/examples/with-styled-components)

examples/with-styled-components/README.md

@@ -2,5 +2,5 @@
 
 You can play with the example on:
 
-- [CodeSandbox](TODO)
+- [CodeSandbox](https://codesandbox.io/s/github/strvcom/react-sliders/tree/master/examples/with-styled-components)
 - Run and play around locally by running `npm run start` inside `/examples/with-styled-components`

examples/with-styled-components/components/RangeSlider.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react'
+import { useRangeSlider, IRangeMarker, TRangeTuple } from '@strv/react-sliders'
 
 import {
   SliderContainer,
@@ -9,8 +10,6 @@ import {
   SliderMarkerLabel,
 } from '../styles'
 
-import { useRangeSlider, IRangeMarker, TRangeTuple } from '../../../dist'
-
 export interface IRangeSliderProps {
   value: TRangeTuple
   min: number

examples/with-styled-components/components/Slider.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react'
+import { useSlider, IRangeMarker } from '@strv/react-sliders'
 
 import {
   SliderContainer,
@@ -9,8 +10,6 @@ import {
   SliderMarker,
 } from '../styles'
 
-import { useSlider, IRangeMarker } from '../../../dist'
-
 export interface ISliderProps {
   value: number
   min: number

examples/with-styled-components/index.tsx

@@ -1,10 +1,10 @@
 import 'react-app-polyfill/ie11'
 import * as React from 'react'
 import * as ReactDOM from 'react-dom'
+import { TRangeTuple } from '@strv/react-sliders'
 
 import { Slider } from './components/Slider'
 import { RangeSlider } from './components/RangeSlider'
-import { TRangeTuple } from '../../dist'
 
 const markers = [
   { value: 0 },

examples/with-styled-components/package-lock.json

@@ -8,6 +8,7 @@
     "build": "parcel build index.html"
   },
   "dependencies": {
+    "@strv/react-sliders": "^1.0.0",
     "react": "^16.13.1",
     "react-app-polyfill": "^1.0.0",
     "react-dom": "^16.13.1",